LVGL学习笔记4 - 主题Themes

目录

1. 获取主题句柄

2. 设置基础主题

3. 设置主题的回调函数

4. 使能主题

5. 实例

5.1 定义一个全局Style变量

5.2 显示默认主题风格的矩形

5.3 初始化新主题的样式

 5.4 初始化新主题

 5.5 回调函数的实现

 5.6 设置新主题

5.7 显示

---

主题是风格的集合。对应的变量结构体是lv_theme_t。定义一个主题也必须是全局变量或者静态的。

1. 获取主题句柄

lv_theme_t  * lv_theme_get_from_obj(lv_obj_t * obj);

参数含义：

obj - 对象句柄，如果是NULL，则获取的是默认主题。

2. 设置基础主题

为主题设置基础主题。基础主题中的样式将添加到当前主题的样式之前。通过设置基本主题，可以创建任意长的主题链。

void lv_theme_set_parent(lv_theme_t * new_theme, lv_theme_t * parent);

参数含义：

new_theme - 新主题句柄

parent - 基础主题句柄

3. 设置主题的回调函数

回调函数用于向不同对象添加样式。

void lv_theme_set_apply_cb(lv_theme_t * theme, lv_theme_apply_cb_t apply_cb);

参数含义：

theme - 被设置回调函数的主题句柄

apply_cb - 回调函数

typedef void (*lv_theme_apply_cb_t)(struct _lv_theme_t *, lv_obj_t *);

4. 使能主题

void lv_disp_set_theme(lv_disp_t * disp, lv_theme_t * th);

设置显示器的主题。

参数含义：

disp - 显示器句柄

th - 主题句柄

5. 实例

画3个矩形框，第一个是默认主题的风格，另外2个是新的主题。

5.1 定义一个全局Style变量

static lv_style_t gThemeRectStyle;

5.2 显示默认主题风格的矩形

lv_obj_t* rect = lv_obj_create(lv_scr_act());

lv_obj_set_size(rect, LV_PCT(20), LV_PCT(20));
lv_obj_align(rect, LV_ALIGN_TOP_LEFT, 20, 20);

5.3 初始化新主题的样式

/*Set a background color and a radius*/
lv_style_init(&gThemeRectStyle);
lv_style_set_radius(&gThemeRectStyle, 5);
lv_style_set_bg_opa(&gThemeRectStyle, LV_OPA_COVER);
lv_style_set_bg_color(&gThemeRectStyle, lv_palette_lighten(LV_PALETTE_GREY, 1));

/*Add a shadow*/
lv_style_set_shadow_width(&gThemeRectStyle, 55);
lv_style_set_shadow_color(&gThemeRectStyle, lv_palette_main(LV_PALETTE_BLUE));

lv_style_set_radius设置半径，对于矩形是四个边角的弧形大小。改成15后显示效果：

lv_style_set_bg_opa设置背景的透明度。LV_OPA_COVER是无透明度，覆盖。改为50%透明度LV_OPA_50的显示效果：

lv_style_set_bg_color设置背景颜色。lv_palette_lighten(LV_PALETTE_GREY, 1)是LVGL预设颜色值，LV_PALETTE_GREY表示灰色，第二个参数表示亮度，有效值1-5。改为LV_PALETTE_ORANGE和3的显示效果：

lv_style_set_shadow_width设置阴影的宽度。改为10、20、40后显示的效果依次如下：

 

 lv_style_set_shadow_color设置阴影的颜色。改为LV_PALETTE_RED的显示效果：

 5.4 初始化新主题

/*通过当前主题初始化新主题*/
lv_theme_t* th_active = lv_theme_get_from_obj(NULL);
static lv_theme_t th_new;
th_new = *th_active;

/*设置父主题和新主题的样式适播放回调函数*/
lv_theme_set_parent(&th_new, th_active);
lv_theme_set_apply_cb(&th_new, new_theme_apply_cb);

 5.5 回调函数的实现

static void new_theme_apply_cb(lv_theme_t* th, lv_obj_t* obj)
{
    if (lv_obj_check_type(obj, &lv_obj_class))
    {
        lv_obj_add_style(obj, &gThemeRectStyle, LV_STATE_DEFAULT);
    }
}

通过lv_obj_check_type判断对象类型，只有对应的对象才使用对应的Style。对象类型可以参考文件lv_theme_basic.c中的函数theme_apply，里面有一组if判断各个对象类型。

 5.6 设置新主题

lv_disp_set_theme(NULL, &th_new);

5.7 显示

    lv_obj_t* rect2 = lv_obj_create(lv_scr_act());

    lv_obj_set_size(rect2, LV_PCT(20), LV_PCT(20));
    lv_obj_align(rect2, LV_ALIGN_TOP_LEFT, 220, 20);

    lv_obj_t* rect3 = lv_obj_create(lv_scr_act());

    lv_obj_set_size(rect3, LV_PCT(20), LV_PCT(20));
    lv_obj_align(rect3, LV_ALIGN_TOP_LEFT, 420, 20);

当设置了新的主题后，显示所有的lv_obj_class部件都会采用新主题的风格显示。