Set LV_COLOR_SCREEN_TRANSP to 1, display error (littlevGL 6.1)

How-to
1

Description

When I set LV_COLOR_SCREEN_TRANSP to 1, the LCD only display black without anything else. If clear LV_COLOR_SCREEN_TRANSP to 0, the LCD can display my application (rectangle filled with red color drawn in canvas)

What MCU/Processor/Board and compiler are you using?

LPC54608, TFT lcd

What do you want to achieve?

I want to implement opacity display. (a background picture and a rectangle with a specify opacity value)

What have you tried so far?

#define LV_COLOR_DEPTH 32
#define LV_COLOR_SCREEN_TRANSP 1

Code to reproduce

The code block(s) should be formatted like:

memset((uint32_t *)CANVAS_RECT_BUF_ADDR, 0x00, CANVAS_RECT_BUF_SIZE);
    lv_obj_t *canvas_rect = lv_canvas_create(lv_scr_act(), NULL);
    lv_canvas_set_buffer(canvas_rect, (uint32_t *)CANVAS_RECT_BUF_ADDR, CANVAS_RECT_BUF_W, CANVAS_RECT_BUF_H, LV_IMG_CF_TRUE_COLOR);
    
    lv_style_t canvas_rect_style;
    lv_style_copy(&canvas_rect_style, &lv_style_plain);
    canvas_rect_style.body.main_color = LV_COLOR_RED;
    canvas_rect_style.body.grad_color = LV_COLOR_RED;
    canvas_rect_style.body.opa = LV_OPA_100;
    
    lv_canvas_draw_rect(canvas_rect, 0, 0, 124, 124, &canvas_rect_style);
    lv_obj_set_x(canvas_rect, 0);
    lv_obj_set_y(canvas_rect, 0);

Screenshot and/or video

If possible, add screenshots and/or videos about the current state.

2

Are you trying to display LittlevGL on top of an existing framebuffer (drawn by another graphics library) or do you just want to draw a translucent rectangle on top of a regular image?

If it’s the latter, you don’t need LV_COLOR_SCREEN_TRANSP or lv_canvas. Simply create an image object to draw your image with, then create a base object and set its style to canvas_rect_style to draw your rectangle.

3

Thanks for your reply.
I want to display a screen like the screenshot below:
222
I will change the rectangle coordinate pixel by pixel with a timer.
In the lv_sim_visual_studio_sdl simulator, I create a canvas and enable LV_COLOR_SCREEN_TRANSP, draw the rectangle successfully. But with the LPC54608 platform, if enable LV_COLOR_SCRREN_TRANSP, the LCD is black.

And I tried as you said to draw the rectangle by lv_draw_rect(), the lcd display a back screen again.
Is there anything wrong in my driver or application code?

The application code is as below:
…

void demo_create(void)
{

lv_obj_t * wp = lv_img_create(lv_scr_act(), NULL);
lv_img_set_src(wp, &test);
lv_obj_set_width(wp, LV_HOR_RES * 4);
lv_obj_set_protect(wp, LV_PROTECT_POS);
   

lv_style_t style;
lv_style_copy(&style, &lv_style_plain);
style.body.main_color = LV_COLOR_RED;
style.body.grad_color = LV_COLOR_RED;

lv_area_t area = {.x1=0,.y1=0,.x2=50,.y2=50};
lv_area_t mask = {.x1=0,.y1=0,.x2=100,.y2=100};

lv_draw_rect(&area, &mask, &style, LV_OPA_100); //if comment this function call, lcd can display the wallpaper fine.


return;

}
…

4

Why are you trying to use lv_draw_rect? Why don’t you just create an lv_obj like I suggested above and apply the style you had created to it?

5

Got it, sorry for misunderstanding your reply.
Thank you very much.

…
#if LV_DEMO_WALLPAPER
lv_obj_t * wp = lv_img_create(lv_scr_act(), NULL);
lv_img_set_src(wp, &test);
lv_obj_set_width(wp, LV_HOR_RES * 4);
lv_obj_set_protect(wp, LV_PROTECT_POS);
#endif /* #if LV_DEMO_WALLPAPER */

lv_obj_t *test = lv_obj_create(lv_scr_act(), NULL);
lv_style_t style;
lv_style_copy(&style, &lv_style_plain);
style.body.main_color = LV_COLOR_RED;
style.body.grad_color = LV_COLOR_RED;
style.body.opa = LV_OPA_20;

lv_obj_set_style(test, &style);
lv_obj_set_x(test, 50);
lv_obj_set_y(test, 70);

…

1 Like