LVGL V8之background styles

创建style

• 初时化style

    static lv_style_t style;
    lv_style_init(&style);

• 设置倒角

  lv_style_set_radius(&style, 5);

• 设置背景透明度为LV_OPA_COVER，即不透明

  lv_style_set_bg_opa(&style, LV_OPA_COVER);

• 设置背景色为淡灰色

lv_style_set_bg_color(&style, lv_palette_lighten(LV_PALETTE_GREY, 1));

• 设置渐变颜色为蓝色

 lv_style_set_bg_grad_color(&style, lv_palette_main(LV_PALETTE_BLUE));

• 设置渐变方向为垂直方向

  lv_style_set_bg_grad_dir(&style, LV_GRAD_DIR_VER);

• 设置主停止颜色为128

 lv_style_set_bg_main_stop(&style, 128);

• 设置渐变停止颜色为192

  lv_style_set_bg_grad_stop(&style, 192);

• 创建obj,添加style并居中对齐

    lv_obj_t* obj = lv_obj_create(lv_scr_act());
    lv_obj_add_style(obj, &style, 0);
    lv_obj_center(obj);

完整代码，仅供参考

static void lv_example_style_2(void)
{
    static lv_style_t style;
    lv_style_init(&style);
    lv_style_set_radius(&style, 5);
    /*Make a gradient*/
    lv_style_set_bg_opa(&style, LV_OPA_COVER);
    lv_style_set_bg_color(&style, lv_palette_lighten(LV_PALETTE_GREY, 1));
    lv_style_set_bg_grad_color(&style, lv_palette_main(LV_PALETTE_BLUE));
    lv_style_set_bg_grad_dir(&style, LV_GRAD_DIR_VER);
    lv_style_set_bg_main_stop(&style, 128);
    lv_style_set_bg_grad_stop(&style, 192);
    /*Create an object with the new style*/
    lv_obj_t* obj = lv_obj_create(lv_scr_act());
    lv_obj_add_style(obj, &style, 0);
    lv_obj_center(obj);
}

调用lv_example_style_2运行效果

• 修改渐变方向为水平

lv_style_set_bg_grad_dir(&style, LV_GRAD_DIR_HOR);

• 运行效果