Image recolor vs background color

How-to
,
1

Hi all,
in one of my projects i am using a button (default widget) and assigning to its pressed state the following style:

lv_style_init(&style);
lv_style_set_pad_all(&style, 0);
lv_style_set_border_width(&style, 0);
lv_style_set_radius(&style, 0);
lv_style_set_bg_color(&style, lv_color_hex(0xffcc00));

then i am also recoloring an image (when in its pressed state) created using the online image converter (ONLY_ALPHA_CHANNEL) assigning to it the following style:

lv_style_init(&style2);
lv_style_set_img_recolor_opa(&style2, 255);
lv_style_set_img_recolor(&style2,lv_color_hex(0xffcc00));

the two things both recolors as yellow when pressed, however the second one is of a darker yellow color while i want them to be of th eexact same color.
What is the solution to this problem?

2

Hi @dami ,

The discrepancy you’re seeing is almost certainly due to alpha premultiplication / compositing when rendering an ONLY_ALPHA_CHANNEL image.

When you use an alpha-only image, each pixel has no color of its own. It only carries an opacity value. LVGL’s recolor blending formula mixes the recolor with the existing pixel color (which for an alpha-only source is effectively black/zero).

The recolor opacity (img_recolor_opa = 255) means full recolor, but the final rendered color is still modulated by the per-pixel alpha of the image