In lvgl 7.x has the widget lv_objmask
and some examples.
In lvgl 8.x has the command lv_draw_mask_add(...)
and some examples related to masks,
such as the lv_roller widget.
However, lvgl 9 does not include the lv_draw_mask_add
command,
causing the lv_roller example to not run correctly.
Are there any examples for masking with alpha images using lvgl 9?
Thank you.
In v9 we focused on better GPU support so we have dropped the “home-made” masking solutions.
The current solution is to support masking with a bitmap. LVGL’s rendering features are being extended to allow drawing in L8, A8, and AL88 formats. See here.
This way you will be able to generate masks at run time using an lv_canvas.
Hi, I wish to create a rect that masked by an image A8 like the following picture.
In the first attempt, I utilized an image (A8) widget with a rectangle widget.
However, the outcome didn’t meet my expectations.
In the second attempt, I utilized an canvas A8 widget with a rectangle widget.
However, the outcome still didn’t meet my expectations.
How to solve the solution?
Thank you.
You can have a single white vase shaped image source. Create an lv_bar
and set the image as bg_image
for both the MAIN
and the INDICATOR
part. After that by adjusting the bar, it will clip the image of the indicator. You can also recolor the indicator to blue.
1 Like
I tried the code above with A8 and 565A8,
but the clip area is inverted.
You should use lv_obj_set_style_bg_image_recolor(bar, blue, LV_PART_INDICATOR)
and lv_obj_set_style_bg_image_recolor(bar, 255, LV_PART_INDICATOR)
instead of setting the background color.
1 Like
It already is cliped .
However the white area I don’t want to display.
How to remove the white area?
Thank you.
Just not set the bg_image
for the main part and set bg_opa = 0
for it.
1 Like
It’s already working now,
thank you very much.
And I’m wondering about another issue:
how to mask 30 rectangles as shown in the image?
It’s the same, just use and image like this
as bg_image
.
These are mini scrollbars
You can disable them by lv_obj_set_scrollbar_mode(obj, LV_SCROLLBAR_MODE_OFF);
.
Thanks for the reply.
Since I want to control the color of the 30-rectangle objects myself later by set_value(...)
,
then I don’t want to create them using an image object as before.
Is it possible to create another object that generates a mask
with the LV_EVENT_DRAW_MAIN_BEGIN , LV_EVENT_DRAW_MAIN_END event etc…,
using an image (format A8) for masking the 30-rectangle objects?
Thank you.
I would like to apply masking on v9.x
similar to the following code on v8.4.0
by image A8 masking
as shown in following…
Thank you.
In v9 we already have masking support via the style_bitmap_mask_src
property.
Normally style_bitmap_mask_src
works on the whole widget and not on the parts. (It would be nice to make it work on the parts too though)
However, to make masking work lv_draw_image_dsc_t
has a bitmap_mask_src
field. If you draw the colored bars to a canvas, and set it as the bg_image
of the indicator, you can just set bitmap_mask_src=&my_mask
in lv_draw_image_t
in a draw event.
It’s worked now!!
Thank you very much. !
2 Likes
Hi @TridentTD, would you be willing to share the source code for your working example? I would like to do something similar
Thanks