lvgl/lvgl

corners of bg_image are not clipped in objects

Opened this issue · 12 comments

LVGL version

v9.1

What happened?

Hi there, here we have a situation as mentioned above. I am not sure it's a bug whether or not.

image

How to reproduce?

void obj_bg_clip_test(void){
lv_obj_t *obj = lv_obj_create(lv_screen_active());
lv_obj_set_size( obj, 480, 272);
lv_obj_align(obj, LV_ALIGN_CENTER, 0, 0);
lv_obj_set_style_bg_image_src(obj, &bg16, 0);
lv_obj_set_style_bg_image_tiled(obj, 1, 0);
lv_obj_set_style_clip_corner(obj, 1, 0);
lv_obj_set_style_radius(obj, 272/2, 0);
}

I could reproduce it, but still not sure how to fix it the best way. Probably the image rendering should be extended at least with a radius parameter.

@FASTSHIFT, @nicusorcitu, @anaGrad can you handle it VG-Lite too?

I believe the NXP VGLite code already covers that if there is a a radius descriptor. After you do the fix please let us know so we can test it.

We observed that in our unit tests as well. Circle also had no rounded background image because of missing the radius descriptor.

My implementation: #6121
image

We need to add the clip_radius parameter in _lv_layer_t to let the GPU know the rounded corner clipping size:
image

Still the same effect in bg_image with tiled enabled. @FASTSHIFT

void obj_bg_clip_test(void){
lv_obj_t *obj = lv_obj_create(lv_screen_active());
lv_obj_set_size( obj, 480, 272);
lv_obj_align(obj, LV_ALIGN_CENTER, 0, 0);
lv_obj_set_style_bg_image_src(obj, &bg16, 0);
lv_obj_set_style_bg_image_tiled(obj, 1, 0);
lv_obj_set_style_clip_corner(obj, 1, 0);
lv_obj_set_style_radius(obj, 272/2, 0);
}

As I mentioned it here, the radius should be applied on any images not only on layer.

For tiled images we need not only the radius but the larger area on which the radius shall be applied. Fortunately we have image_draw_dsc.image_area which gives the full image area and radius should be applied on this area.

We need some feedback on this issue.

Now we mark this as "stale" because there was no activity here for 14 days.

Remove the "stale" label or comment else this will be closed in 7 days.

@anaGrad @cristian-stoica can you please verify if this is fixed in our rounded rectangle (or circle) unit test with background image?
Thanks.

Theoretical question: If the image is rotated the radius mask shall be rotated too. That is the rounded image is rotated and not the rotated image is masked with a normal radius mask. I think this makes the most sense but it's quite complicated to implement in SW rendering as the mask needs to be rotated too.

I tested the PR for this ticket and I have a mention about the implementation.
I noticed that the rounded corner image works only if done by creating an image widget with lv_image_create(). On our tests, we have a rectangle with background image, and so the radius doesn't apply to it.
The simplest way I found it possible to pass the radius to the image in that case was by giving the image radius the value from the rectangle in lv_draw_rect.
Please take a look at the patch below and tell me if there is something else I should take into account or if it's ok for it to be also included in the PR.

image_radius.patch

If the image is rotated the radius mask shall be rotated too.

This is valid in software because the GPU does not use mask to draw an image with a defined pattern.
To rotate the image, the GPU simply needs the rotation angle in image descriptor.

@anaGrad
True, bg_image drawing should know the radius too.

@nicusorcitu
At the first pass we can accept it as a limitation of the SW render and support it only for non rotated images.