Gradient

cancel
Showing results for 
Show  only  | Search instead for 
Did you mean: 

Gradient

Jump to solution
1,845 Views
frozen
Contributor III

Hello,

I want to have a background like attached picture but I could not make it with gradient tool. You see it starts with dark color at top, then goes to light blue in the middle and goes to darker color at the bottom. Could someone help me to do that ? I will use it with imx RT1176. I use latest Gui Guider and latest lvgl version in the program.

frozen_0-1694721406065.png

 

0 Kudos
Reply
1 Solution
1,793 Views
LiubinGong
NXP Employee
NXP Employee

Hi @frozen 

   The current LVGL does not support multi-point gradient colors. We recommend that you first use two items to splice them together to achieve the effect you want. 

Capture.PNG

By the way,  you can add the custom style code to the current screen. 

lv_obj_set_style_bg_grad_stop(ui->screen_cont_1, 0, LV_PART_MAIN|LV_STATE_DEFAULT);

The API can set the point from which the background's gradient color should start. 0 means to top/left size, 255 for the bottom/right side, and 128 for the center.

Best regards 

Liubin

View solution in original post

0 Kudos
Reply
1 Reply
1,794 Views
LiubinGong
NXP Employee
NXP Employee

Hi @frozen 

   The current LVGL does not support multi-point gradient colors. We recommend that you first use two items to splice them together to achieve the effect you want. 

Capture.PNG

By the way,  you can add the custom style code to the current screen. 

lv_obj_set_style_bg_grad_stop(ui->screen_cont_1, 0, LV_PART_MAIN|LV_STATE_DEFAULT);

The API can set the point from which the background's gradient color should start. 0 means to top/left size, 255 for the bottom/right side, and 128 for the center.

Best regards 

Liubin

0 Kudos
Reply