从今天开始我将开始记录我的LVGL的学习过程。包括LVGL在OS上的应用,这里我使用的是freertos操作系统。
我将从windows系统上仿真学习开始,逐步展开,最后迁移到freertos中。这即是我自己的笔记也是对于其他人刚刚入门的学习笔记的共享。
这里我跟的课程是正点原子的新版课程,使用的编译工具是codeblocks 20.03 mingw和keil5.这里不包括工程的建立以及移植,只有使用编程的方法以及思想。希望与大家共勉。
一,工程结构。
笔者任务LVGL按照作用分为这四个文件夹即可,不一定要按照教程分为很多很多,这个也看个人喜好。每个文件夹的意思都比较明了,这里不过多解释。大家移植后按照自己的习惯来即可。在codeblocks中编写的自己的mygui移植过来即可。
二,基础对象的创建
LVGL 用结构体实例化出基础对象,实现类的思维,面相对象编程。
lv_obj_t* switch_obj = lv_switch_create(lv_scr_act());
lv_obj_set_size(switch_obj,120,60);
lv_obj_align(switch_obj,LV_ALIGN_CENTER,0,0);
这里lv_obj_t 是结构体,switch_obj为按键控件的名称,lv_switch_create为创建按键控件的函数,lv_scr_act()为父对象,以这个为活动屏幕。
lv_obj_set_size(switch_obj,120,60);为设置大小的函数 入口参数分别为 部件,长,宽。
lv_obj_align为父对象对齐函数。
lv_obj_t* switch1 = lv_switch_create(lv_scr_act());
lv_obj_set_size(switch1,120,60);
lv_obj_t* switch2 = lv_switch_create(switch1);
这里我们做一个空间父对象的解释,看这段代码。我创建的第二个开关部件以第一个部件为父空间对象。
由此我们可以理解基础对象的重要性。其他所有的对象都是由基础对象展开衍生的。类似集合的关系。
编程记忆:基础对象结构体lv_obj_t 使用例lv_obj_t* switch1 = 函数(父对象)
下面我们创建一个框来模拟我们的lcd屏幕,例如2.8寸tftlcd
对比就可以很明显的看出其中的关系
三,部件的基本属性
主要有大小(size) 位置(position)对齐(alignmen) 样式(styles)事件(events)
3.1 大小 size
相关api函数
设置宽度:lv_obj_set_width(obj, new_width);
设置高度:lv_obj_set_height(obj, new_height);
同时设置宽度、高度:lv_obj_set_size(obj, new_width, new_height);
3.2 位置 position
屏幕坐标关系 注意这里关系是基于父对象的位置关系,以父对象空间的左上角作为坐标原点。
api函数
设置X轴坐标:lv_obj_set_x(obj, new_x);
设置Y轴坐标:lv_obj_set_y(obj, new_y);
同时设置X、Y轴坐标:lv_obj_set_pos(obj, new_x, new_y);
3.3 对齐 alignmen
对齐方式:
相关api
参照父对象对齐:
lv_obj_set_align(obj, LV_ALIGN_...);
参照父对象对齐,再进行偏移:
lv_obj_align(obj, LV_ALIGN_..., x, y);
参照父对象对齐不支持OUT模式
参照其他对象对齐(无父子关系),再进行偏移:
lv_obj_align_to(obj_to_align, obj_referece, LV_ALIGN_..., x, y);
//obj_to_align为基准对象 obj_referece为需要对齐的对象
对齐模式
这里写在代码的LV_ALIGN_...中。
3.4 样式styles
样式用于设置部件的外观,以优化显示界面和实现用户交互
样式的添加无非四个考虑:
如何给部件添加样式?
什么时候样式会生效?
有哪些样式属性可以设置?
如何单独设置部件中某个部分的样式?
问题1,如何添加的api
添加普通样式:(必须是全局或静态) 相当于添加一个状态预设
static lv_style_t style; /* 定义样式变量 */
lv_style_init(&style); /* 初始化样式 */
lv_style_set_bg_color(&style, lv_color_hex(0xf4b183)); /* 设置背景颜色 */
lv_obj_t * obj = lv_obj_create(lv_scr_act()); /* 创建一个部件 */
lv_obj_add_style(obj1,&style,LV_STATE_DEFAULT); /* 设置部件的样式 */
LV_STATE_DEFAULT 是处于什么状态被应用的模式 这是默认状态 详细看第二个问题。
添加本地样式:
相当于只对一个对象赋值操作
lv_obj_t * obj = lv_obj_create(lv_scr_act()); /* 创建一个部件 */
lv_obj_set_style_bg_color(obj, lv_color_hex(0xf4b183),LV_STATE_DEFAULT); /* 设置部件的样式 */
入口参数 部件名 颜色 状态触发模式
问题二,什么时候样式会生效?
enum {
LV_STATE_DEFAULT = 0x0000, /* 默认状态 */
LV_STATE_CHECKED = 0x0001, /* 切换或选中状态 */
LV_STATE_FOCUSED = 0x0002, /* 通过键盘、编码器聚焦或通过触摸板、鼠标单击 */
LV_STATE_FOCUS_KEY = 0x0004, /* 通过键盘、编码器聚焦 */
LV_STATE_EDITED = 0x0008, /* 由编码器编辑 */
LV_STATE_HOVERED = 0x0010, /* 鼠标悬停(现在不支持)*/
LV_STATE_PRESSED = 0x0020, /* 已按下 */
LV_STATE_SCROLLED = 0x0040, /* 滚动状态 */
LV_STATE_DISABLED = 0x0080, /* 禁用状态 */
…
};
有哪些样式属性可以设置?大小 Size 位置 Position 背景 Background 轮廓 Outline 边框Border 阴影 Shadow 其他 Others 查找声明查找,具体信息查找lvgl官网 style properties
void lv_obj_set_style_width(struct _lv_obj_t * obj, lv_coord_t value, lv_style_selector_t selector);
void lv_obj_set_style_min_width(struct _lv_obj_t * obj, lv_coord_t value, lv_style_selector_t selector);
void lv_obj_set_style_max_width(struct _lv_obj_t * obj, lv_coord_t value, lv_style_selector_t selector);
void lv_obj_set_style_height(struct _lv_obj_t * obj, lv_coord_t value, lv_style_selector_t selector);
void lv_obj_set_style_min_height(struct _lv_obj_t * obj, lv_coord_t value, lv_style_selector_t selector);
void lv_obj_set_style_max_height(struct _lv_obj_t * obj, lv_coord_t value, lv_style_selector_t selector);
void lv_obj_set_style_x(struct _lv_obj_t * obj, lv_coord_t value, lv_style_selector_t selector);
void lv_obj_set_style_y(struct _lv_obj_t * obj, lv_coord_t value, lv_style_selector_t selector);
void lv_obj_set_style_align(struct _lv_obj_t * obj, lv_align_t value, lv_style_selector_t selector);
void lv_obj_set_style_transform_width(struct _lv_obj_t * obj, lv_coord_t value, lv_style_selector_t selector);
void lv_obj_set_style_transform_height(struct _lv_obj_t * obj, lv_coord_t value, lv_style_selector_t selector);
void lv_obj_set_style_translate_x(struct _lv_obj_t * obj, lv_coord_t value, lv_style_selector_t selector);
void lv_obj_set_style_translate_y(struct _lv_obj_t * obj, lv_coord_t value, lv_style_selector_t selector);
void lv_obj_set_style_transform_zoom(struct _lv_obj_t * obj, lv_coord_t value, lv_style_selector_t selector);
void lv_obj_set_style_transform_angle(struct _lv_obj_t * obj, lv_coord_t value, lv_style_selector_t selector);
void lv_obj_set_style_pad_top(struct _lv_obj_t * obj, lv_coord_t value, lv_style_selector_t selector);
void lv_obj_set_style_pad_bottom(struct _lv_obj_t * obj, lv_coord_t value, lv_style_selector_t selector);
void lv_obj_set_style_pad_left(struct _lv_obj_t * obj, lv_coord_t value, lv_style_selector_t selector);
void lv_obj_set_style_pad_right(struct _lv_obj_t * obj, lv_coord_t value, lv_style_selector_t selector);
void lv_obj_set_style_pad_row(struct _lv_obj_t * obj, lv_coord_t value, lv_style_selector_t selector);
void lv_obj_set_style_pad_column(struct _lv_obj_t * obj, lv_coord_t value, lv_style_selector_t selector);
void lv_obj_set_style_radius(struct _lv_obj_t * obj, lv_coord_t value, lv_style_selector_t selector);
void lv_obj_set_style_clip_corner(struct _lv_obj_t * obj, bool value, lv_style_selector_t selector);
void lv_obj_set_style_opa(struct _lv_obj_t * obj, lv_opa_t value, lv_style_selector_t selector);
void lv_obj_set_style_color_filter_dsc(struct _lv_obj_t * obj, const lv_color_filter_dsc_t * value,
lv_style_selector_t selector);
void lv_obj_set_style_color_filter_opa(struct _lv_obj_t * obj, lv_opa_t value, lv_style_selector_t selector);
void lv_obj_set_style_anim_time(struct _lv_obj_t * obj, uint32_t value, lv_style_selector_t selector);
void lv_obj_set_style_anim_speed(struct _lv_obj_t * obj, uint32_t value, lv_style_selector_t selector);
void lv_obj_set_style_transition(struct _lv_obj_t * obj, const lv_style_transition_dsc_t * value,
lv_style_selector_t selector);
void lv_obj_set_style_blend_mode(struct _lv_obj_t * obj, lv_blend_mode_t value, lv_style_selector_t selector);
void lv_obj_set_style_layout(struct _lv_obj_t * obj, uint16_t value, lv_style_selector_t selector);
void lv_obj_set_style_base_dir(struct _lv_obj_t * obj, lv_base_dir_t value, lv_style_selector_t selector);
void lv_obj_set_style_bg_color(struct _lv_obj_t * obj, lv_color_t value, lv_style_selector_t selector);
void lv_obj_set_style_bg_color_filtered(struct _lv_obj_t * obj, lv_color_t value, lv_style_selector_t selector);
void lv_obj_set_style_bg_opa(struct _lv_obj_t * obj, lv_opa_t value, lv_style_selector_t selector);
void lv_obj_set_style_bg_grad_color(struct _lv_obj_t * obj, lv_color_t value, lv_style_selector_t selector);
void lv_obj_set_style_bg_grad_color_filtered(struct _lv_obj_t * obj, lv_color_t value, lv_style_selector_t selector);
void lv_obj_set_style_bg_grad_dir(struct _lv_obj_t * obj, lv_grad_dir_t value, lv_style_selector_t selector);
void lv_obj_set_style_bg_main_stop(struct _lv_obj_t * obj, lv_coord_t value, lv_style_selector_t selector);
void lv_obj_set_style_bg_grad_stop(struct _lv_obj_t * obj, lv_coord_t value, lv_style_selector_t selector);
void lv_obj_set_style_bg_img_src(struct _lv_obj_t * obj, const void * value, lv_style_selector_t selector);
void lv_obj_set_style_bg_img_opa(struct _lv_obj_t * obj, lv_opa_t value, lv_style_selector_t selector);
void lv_obj_set_style_bg_img_recolor(struct _lv_obj_t * obj, lv_color_t value, lv_style_selector_t selector);
void lv_obj_set_style_bg_img_recolor_filtered(struct _lv_obj_t * obj, lv_color_t value, lv_style_selector_t selector);
void lv_obj_set_style_bg_img_recolor_opa(struct _lv_obj_t * obj, lv_opa_t value, lv_style_selector_t selector);
void lv_obj_set_style_bg_img_tiled(struct _lv_obj_t * obj, bool value, lv_style_selector_t selector);
void lv_obj_set_style_border_color(struct _lv_obj_t * obj, lv_color_t value, lv_style_selector_t selector);
void lv_obj_set_style_border_color_filtered(struct _lv_obj_t * obj, lv_color_t value, lv_style_selector_t selector);
void lv_obj_set_style_border_opa(struct _lv_obj_t * obj, lv_opa_t value, lv_style_selector_t selector);
void lv_obj_set_style_border_width(struct _lv_obj_t * obj, lv_coord_t value, lv_style_selector_t selector);
void lv_obj_set_style_border_side(struct _lv_obj_t * obj, lv_border_side_t value, lv_style_selector_t selector);
void lv_obj_set_style_border_post(struct _lv_obj_t * obj, bool value, lv_style_selector_t selector);
void lv_obj_set_style_text_color(struct _lv_obj_t * obj, lv_color_t value, lv_style_selector_t selector);
void lv_obj_set_style_text_color_filtered(struct _lv_obj_t * obj, lv_color_t value, lv_style_selector_t selector);
void lv_obj_set_style_text_opa(struct _lv_obj_t * obj, lv_opa_t value, lv_style_selector_t selector);
void lv_obj_set_style_text_font(struct _lv_obj_t * obj, const lv_font_t * value, lv_style_selector_t selector);
void lv_obj_set_style_text_letter_space(struct _lv_obj_t * obj, lv_coord_t value, lv_style_selector_t selector);
void lv_obj_set_style_text_line_space(struct _lv_obj_t * obj, lv_coord_t value, lv_style_selector_t selector);
void lv_obj_set_style_text_decor(struct _lv_obj_t * obj, lv_text_decor_t value, lv_style_selector_t selector);
void lv_obj_set_style_text_align(struct _lv_obj_t * obj, lv_text_align_t value, lv_style_selector_t selector);
void lv_obj_set_style_img_opa(struct _lv_obj_t * obj, lv_opa_t value, lv_style_selector_t selector);
void lv_obj_set_style_img_recolor(struct _lv_obj_t * obj, lv_color_t value, lv_style_selector_t selector);
void lv_obj_set_style_img_recolor_filtered(struct _lv_obj_t * obj, lv_color_t value, lv_style_selector_t selector);
void lv_obj_set_style_img_recolor_opa(struct _lv_obj_t * obj, lv_opa_t value, lv_style_selector_t selector);
void lv_obj_set_style_outline_width(struct _lv_obj_t * obj, lv_coord_t value, lv_style_selector_t selector);
void lv_obj_set_style_outline_color(struct _lv_obj_t * obj, lv_color_t value, lv_style_selector_t selector);
void lv_obj_set_style_outline_color_filtered(struct _lv_obj_t * obj, lv_color_t value, lv_style_selector_t selector);
void lv_obj_set_style_outline_opa(struct _lv_obj_t * obj, lv_opa_t value, lv_style_selector_t selector);
void lv_obj_set_style_outline_pad(struct _lv_obj_t * obj, lv_coord_t value, lv_style_selector_t selector);
void lv_obj_set_style_shadow_width(struct _lv_obj_t * obj, lv_coord_t value, lv_style_selector_t selector);
void lv_obj_set_style_shadow_ofs_x(struct _lv_obj_t * obj, lv_coord_t value, lv_style_selector_t selector);
void lv_obj_set_style_shadow_ofs_y(struct _lv_obj_t * obj, lv_coord_t value, lv_style_selector_t selector);
void lv_obj_set_style_shadow_spread(struct _lv_obj_t * obj, lv_coord_t value, lv_style_selector_t selector);
void lv_obj_set_style_shadow_color(struct _lv_obj_t * obj, lv_color_t value, lv_style_selector_t selector);
void lv_obj_set_style_shadow_color_filtered(struct _lv_obj_t * obj, lv_color_t value, lv_style_selector_t selector);
void lv_obj_set_style_shadow_opa(struct _lv_obj_t * obj, lv_opa_t value, lv_style_selector_t selector);
void lv_obj_set_style_line_width(struct _lv_obj_t * obj, lv_coord_t value, lv_style_selector_t selector);
void lv_obj_set_style_line_dash_width(struct _lv_obj_t * obj, lv_coord_t value, lv_style_selector_t selector);
void lv_obj_set_style_line_dash_gap(struct _lv_obj_t * obj, lv_coord_t value, lv_style_selector_t selector);
void lv_obj_set_style_line_rounded(struct _lv_obj_t * obj, bool value, lv_style_selector_t selector);
void lv_obj_set_style_line_color(struct _lv_obj_t * obj, lv_color_t value, lv_style_selector_t selector);
void lv_obj_set_style_line_color_filtered(struct _lv_obj_t * obj, lv_color_t value, lv_style_selector_t selector);
void lv_obj_set_style_line_opa(struct _lv_obj_t * obj, lv_opa_t value, lv_style_selector_t selector);
void lv_obj_set_style_arc_width(struct _lv_obj_t * obj, lv_coord_t value, lv_style_selector_t selector);
void lv_obj_set_style_arc_rounded(struct _lv_obj_t * obj, bool value, lv_style_selector_t selector);
void lv_obj_set_style_arc_color(struct _lv_obj_t * obj, lv_color_t value, lv_style_selector_t selector);
void lv_obj_set_style_arc_color_filtered(struct _lv_obj_t * obj, lv_color_t value, lv_style_selector_t selector);
void lv_obj_set_style_arc_opa(struct _lv_obj_t * obj, lv_opa_t value, lv_style_selector_t selector);
void lv_obj_set_style_arc_img_src(struct _lv_obj_t * obj, const void * value, lv_style_selector_t selector);
void lv_style_set_width(lv_style_t * style, lv_coord_t value);
void lv_style_set_min_width(lv_style_t * style, lv_coord_t value);
void lv_style_set_max_width(lv_style_t * style, lv_coord_t value);
void lv_style_set_height(lv_style_t * style, lv_coord_t value);
void lv_style_set_min_height(lv_style_t * style, lv_coord_t value);
void lv_style_set_max_height(lv_style_t * style, lv_coord_t value);
void lv_style_set_x(lv_style_t * style, lv_coord_t value);
void lv_style_set_y(lv_style_t * style, lv_coord_t value);
void lv_style_set_align(lv_style_t * style, lv_align_t value);
void lv_style_set_transform_width(lv_style_t * style, lv_coord_t value);
void lv_style_set_transform_height(lv_style_t * style, lv_coord_t value);
void lv_style_set_translate_x(lv_style_t * style, lv_coord_t value);
void lv_style_set_translate_y(lv_style_t * style, lv_coord_t value);
void lv_style_set_transform_zoom(lv_style_t * style, lv_coord_t value);
void lv_style_set_transform_angle(lv_style_t * style, lv_coord_t value);
void lv_style_set_pad_top(lv_style_t * style, lv_coord_t value);
void lv_style_set_pad_bottom(lv_style_t * style, lv_coord_t value);
void lv_style_set_pad_left(lv_style_t * style, lv_coord_t value);
void lv_style_set_pad_right(lv_style_t * style, lv_coord_t value);
void lv_style_set_pad_row(lv_style_t * style, lv_coord_t value);
void lv_style_set_pad_column(lv_style_t * style, lv_coord_t value);
void lv_style_set_radius(lv_style_t * style, lv_coord_t value);
void lv_style_set_clip_corner(lv_style_t * style, bool value);
void lv_style_set_opa(lv_style_t * style, lv_opa_t value);
void lv_style_set_color_filter_dsc(lv_style_t * style, const lv_color_filter_dsc_t * value);
void lv_style_set_color_filter_opa(lv_style_t * style, lv_opa_t value);
void lv_style_set_anim_time(lv_style_t * style, uint32_t value);
void lv_style_set_anim_speed(lv_style_t * style, uint32_t value);
void lv_style_set_transition(lv_style_t * style, const lv_style_transition_dsc_t * value);
void lv_style_set_blend_mode(lv_style_t * style, lv_blend_mode_t value);
void lv_style_set_layout(lv_style_t * style, uint16_t value);
void lv_style_set_base_dir(lv_style_t * style, lv_base_dir_t value);
void lv_style_set_bg_color(lv_style_t * style, lv_color_t value);
void lv_style_set_bg_color_filtered(lv_style_t * style, lv_color_t value);
void lv_style_set_bg_opa(lv_style_t * style, lv_opa_t value);
void lv_style_set_bg_grad_color(lv_style_t * style, lv_color_t value);
void lv_style_set_bg_grad_color_filtered(lv_style_t * style, lv_color_t value);
void lv_style_set_bg_grad_dir(lv_style_t * style, lv_grad_dir_t value);
void lv_style_set_bg_main_stop(lv_style_t * style, lv_coord_t value);
void lv_style_set_bg_grad_stop(lv_style_t * style, lv_coord_t value);
void lv_style_set_bg_img_src(lv_style_t * style, const void * value);
void lv_style_set_bg_img_opa(lv_style_t * style, lv_opa_t value);
void lv_style_set_bg_img_recolor(lv_style_t * style, lv_color_t value);
void lv_style_set_bg_img_recolor_filtered(lv_style_t * style, lv_color_t value);
void lv_style_set_bg_img_recolor_opa(lv_style_t * style, lv_opa_t value);
void lv_style_set_bg_img_tiled(lv_style_t * style, bool value);
void lv_style_set_border_color(lv_style_t * style, lv_color_t value);
void lv_style_set_border_color_filtered(lv_style_t * style, lv_color_t value);
void lv_style_set_border_opa(lv_style_t * style, lv_opa_t value);
void lv_style_set_border_width(lv_style_t * style, lv_coord_t value);
void lv_style_set_border_side(lv_style_t * style, lv_border_side_t value);
void lv_style_set_border_post(lv_style_t * style, bool value);
void lv_style_set_text_color(lv_style_t * style, lv_color_t value);
void lv_style_set_text_color_filtered(lv_style_t * style, lv_color_t value);
void lv_style_set_text_opa(lv_style_t * style, lv_opa_t value);
void lv_style_set_text_font(lv_style_t * style, const lv_font_t * value);
void lv_style_set_text_letter_space(lv_style_t * style, lv_coord_t value);
void lv_style_set_text_line_space(lv_style_t * style, lv_coord_t value);
void lv_style_set_text_decor(lv_style_t * style, lv_text_decor_t value);
void lv_style_set_text_align(lv_style_t * style, lv_text_align_t value);
void lv_style_set_img_opa(lv_style_t * style, lv_opa_t value);
void lv_style_set_img_recolor(lv_style_t * style, lv_color_t value);
void lv_style_set_img_recolor_filtered(lv_style_t * style, lv_color_t value);
void lv_style_set_img_recolor_opa(lv_style_t * style, lv_opa_t value);
void lv_style_set_outline_width(lv_style_t * style, lv_coord_t value);
void lv_style_set_outline_color(lv_style_t * style, lv_color_t value);
void lv_style_set_outline_color_filtered(lv_style_t * style, lv_color_t value);
void lv_style_set_outline_opa(lv_style_t * style, lv_opa_t value);
void lv_style_set_outline_pad(lv_style_t * style, lv_coord_t value);
void lv_style_set_shadow_width(lv_style_t * style, lv_coord_t value);
void lv_style_set_shadow_ofs_x(lv_style_t * style, lv_coord_t value);
void lv_style_set_shadow_ofs_y(lv_style_t * style, lv_coord_t value);
void lv_style_set_shadow_spread(lv_style_t * style, lv_coord_t value);
void lv_style_set_shadow_color(lv_style_t * style, lv_color_t value);
void lv_style_set_shadow_color_filtered(lv_style_t * style, lv_color_t value);
void lv_style_set_shadow_opa(lv_style_t * style, lv_opa_t value);
void lv_style_set_line_width(lv_style_t * style, lv_coord_t value);
void lv_style_set_line_dash_width(lv_style_t * style, lv_coord_t value);
void lv_style_set_line_dash_gap(lv_style_t * style, lv_coord_t value);
void lv_style_set_line_rounded(lv_style_t * style, bool value);
void lv_style_set_line_color(lv_style_t * style, lv_color_t value);
void lv_style_set_line_color_filtered(lv_style_t * style, lv_color_t value);
void lv_style_set_line_opa(lv_style_t * style, lv_opa_t value);
void lv_style_set_arc_width(lv_style_t * style, lv_coord_t value);
void lv_style_set_arc_rounded(lv_style_t * style, bool value);
void lv_style_set_arc_color(lv_style_t * style, lv_color_t value);
void lv_style_set_arc_color_filtered(lv_style_t * style, lv_color_t value);
void lv_style_set_arc_opa(lv_style_t * style, lv_opa_t value);
void lv_style_set_arc_img_src(lv_style_t * style, const void * value);
常用的api 以本地为例
lv_obj_set_style_border_color(obj1,lv_color_hex(0x56c94c),LV_STATE_DEFAULT); /*边框颜色修改*/
lv_obj_set_style_border_width(obj1,10,LV_STATE_DEFAULT); /*边框宽度*/
lv_obj_set_style_border_opa(obj1,40,LV_STATE_DEFAULT); /*边框透明度 0-255 255不透明*/
轮廓的,跟边框完全相同,区别为位置在边框外面。
lv_obj_set_style_outline_color(obj1,lv_color_hex(0x0000ac),LV_STATE_DEFAULT);
lv_obj_set_style_outline_width(obj1,10,LV_STATE_DEFAULT);
lv_obj_set_style_outline_opa(obj1,40,LV_STATE_DEFAULT);
如何单独设置部件中某个部分的样式?
例如 滑块滚动条枚举
enum {
LV_PART_MAIN = 0x000000, /* 主体,像矩形一样的背景 */
LV_PART_SCROLLBAR = 0x010000, /* 滚动条 */
LV_PART_INDICATOR = 0x020000, /* 指示器,指示当前值 */
LV_PART_KNOB = 0x030000, /* 手柄或旋钮,用于调整参数值 */
LV_PART_SELECTED = 0x040000, /* 选项框,指示当前选择的选项 */
LV_PART_ITEMS = 0x050000, /* 相似的元素,例如单元格 */
LV_PART_TICKS = 0x060000, /* 刻度 */
LV_PART_CURSOR = 0x070000, /* 光标 */
};
在官网的arc里面查找
例子 只有LV_STATE_DEFAULT可以按位或,且只能或一次,其他可以多次使用lv_obj_set_style_bg_color函数
lv_obj_t *slier = lv_slider_create(lv_scr_act());
lv_obj_set_align(slier,LV_ALIGN_CENTER);
lv_obj_set_style_bg_color(slier,lv_color_hex(0x49bc03),LV_STATE_DEFAULT|LV_PART_INDICATOR);
3.5 事件events
类似qt中的信号和槽
LVGL中,当发生用户感兴趣的事情时,可以触发回调事件,以执行相关的操作。
相关api函数
添加事件:lv_obj_add_event_cb(obj, event_cb, event_code, user_data);
入口参数 obj,事件回调函数,事件类型,用户数据
删除事件:lv_obj_remove_event_cb(obj, event_cb);
让我们看看官方文档中的描述:
当发生某些对用户可能感兴趣的事情时,LVGL中的事件将被触发,例如:
被点击
被滚动
值发生改变
重新绘制等。
除了部件,事件还可以从显示和输入设备进行注册。
事件代码可以分为以下类别:- 输入设备事件 - 绘图事件 - 其他事件 - 特殊事件 - 自定义事件
所有对象(如按钮/标签/滑块等)无论其类型,都会接收 输入设备、 绘图 和 其他 事件。
Input device events(输入设备事件)
LV_EVENT_PRESSED: 对象已被按下
LV_EVENT_PRESSING: 对象正在被按下(在持续按压时被调用)
LV_EVENT_PRESS_LOST: 对象仍在被按下,但滑动光标/手指离开对象
LV_EVENT_SHORT_CLICKED: 对象被按下一小段时间,然后释放。如果被滚动,则不会被调用。
LV_EVENT_LONG_PRESSED: 对象至少被按下`long_press_time`。如果被滚动,则不会被调用。
LV_EVENT_LONG_PRESSED_REPEAT: 在每`long_press_repeat_time`毫秒后,调用一次。如果被滚动,则不会被调用。
LV_EVENT_CLICKED: 如果没有被滚动,在释放时被调用(不管长按)
LV_EVENT_RELEASED: 在所有对象释放时被调用
LV_EVENT_SCROLL_BEGIN: 滚动开始。事件参数是滚动动画的指针。可以被修改
LV_EVENT_SCROLL_THROW_BEGIN:
LV_EVENT_SCROLL_END: 滚动结束
LV_EVENT_SCROLL: 滚动
LV_EVENT_GESTURE: 检测到手势。使用 lv_indev_get_gesture_dir(lv_indev_active()); 获取手势
LV_EVENT_KEY: 将键发送给对象。使用 lv_indev_get_key(lv_indev_active()); 获取键
LV_EVENT_FOCUSED: 对象被聚焦
LV_EVENT_DEFOCUSED: 对象失去焦点
LV_EVENT_LEAVE: 对象失去焦点但仍然被选中
LV_EVENT_HIT_TEST: 执行高级点击测试
LV_EVENT_INDEV_RESET: 输入设备已重置
Drawing events(绘图事件)
LV_EVENT_COVER_CHECK: 检查对象是否完全覆盖了一个区域。事件参数是 lv_cover_check_info_t *。
LV_EVENT_REFR_EXT_DRAW_SIZE: 获取对象周围所需的额外绘制区域(例如用于阴影)。事件参数是 int32_t * 来存储大小。
LV_EVENT_DRAW_MAIN_BEGIN: 开始主绘制阶段
LV_EVENT_DRAW_MAIN: 执行主绘制
LV_EVENT_DRAW_MAIN_END: 结束主绘制阶段
LV_EVENT_DRAW_POST_BEGIN: 开始后绘制阶段(当所有子对象都绘制完成时)
LV_EVENT_DRAW_POST: 执行后绘制阶段(当所有子对象都绘制完成时)
LV_EVENT_DRAW_POST_END: 结束后绘制阶段(当所有子对象都绘制完成时)
LV_EVENT_DRAW_TASK_ADDED: 添加绘制任务
Special events(特殊事件)
LV_EVENT_VALUE_CHANGED: 对象的值已更改(例如,滑块移动)
LV_EVENT_INSERT: 文本已插入到对象中。事件数据是被插入的 char *。
LV_EVENT_REFRESH: 通知对象刷新其上的某些内容(用户用)
LV_EVENT_READY: 进程已结束
LV_EVENT_CANCEL: 进程已取消
Other events(其他事件)
LV_EVENT_CREATE: 对象正在被创建
LV_EVENT_DELETE: 对象正在被删除
LV_EVENT_CHILD_CHANGED: 子对象已被移除、添加,或其大小、位置已被修改
LV_EVENT_CHILD_CREATED: 子对象已被创建,总是向上冒泡到所有父对象
LV_EVENT_CHILD_DELETED: 子对象已被删除,总是向上冒泡到所有父对象
LV_EVENT_SCREEN_UNLOAD_START: 屏幕卸载已开始,在调用scr_load时立即触发
LV_EVENT_SCREEN_LOAD_START: 屏幕加载已开始,在屏幕切换延迟过后触发
LV_EVENT_SCREEN_LOADED: 屏幕已加载
LV_EVENT_SCREEN_UNLOADED: 屏幕已卸载
LV_EVENT_SIZE_CHANGED: 对象坐标/大小已更改
LV_EVENT_STYLE_CHANGED: 对象的样式已更改
LV_EVENT_LAYOUT_CHANGED: 由于布局重新计算,子对象位置已更改
LV_EVENT_GET_SELF_SIZE: 获取部件的内部大小
example:
static void my_event_cb(lv_event_t *e){
printf("LV_EVENT_CLICKED\n");
}
void MY_GUI(void){
lv_obj_t *obj1 = lv_obj_create(lv_scr_act());
lv_obj_add_event_cb(obj1,my_event_cb,LV_EVENT_CLICKED,NULL);
}
不同的事件类型共用一个事件回调函数怎么处理?
这样:
static void event_cb( lv_event_t *e )
{
lv_event_code_t code = lv_event_get_code(e); /* 第一步:获取事件类型 */
if ( code == LV_EVENT_CLICKED ) /* 第二步:判断事件类型 */
{
printf(“事件类型: 按下后释放\r\n”); /* 第三步:执行相应操作 */
}
else if ( code == LV_EVENT_LONG_PRESSED)
{
printf(“事件类型:按下(长按)\r\n”);
}
}
static void my_event_cb(lv_event_t *e){ lv_event_code_t code = lv_event_get_code(e); if ( code == LV_EVENT_CLICKED ) { printf("事件类型: 按下后释放\r\n"); } else if ( code == LV_EVENT_LONG_PRESSED) { printf("事件类型:按下(长按)\r\n"); } } void MY_GUI(void){ lv_obj_t *obj1 = lv_obj_create(lv_scr_act()); lv_obj_add_event_cb(obj1,my_event_cb,LV_EVENT_CLICKED,NULL); lv_obj_add_event_cb(obj1,my_event_cb,LV_EVENT_LONG_PRESSED,NULL); }
不同的部件共用同一个回调函数的处理
static void event_cb( lv_event_t *e )
{
lv_obj_t *target = lv_event_get_target(e); /* 第一步:获取触发事件的部件 */
if ( target == parent_obj ) /* 第二步:判断触发事件的部件 */
{
printf(“父对象触发事件 \r\n”); /* 第三步:执行相应操作 */
}
else if ( target == child_obj )
{
printf(“子对象触发事件 \r\n”);
}
}
例子 /*对象定义块*/ lv_obj_t *obj1; lv_obj_t *obj2; /*回调函数定义块*/ static void my_event_cb(lv_event_t *e){ lv_obj_t *target=lv_event_get_target(e) ; if(target==obj1){ printf("obj1\n"); } if(target==obj2){ printf("obj2\n"); } } /*gui函数定义块*/ void MY_GUI(void){ obj1 = lv_obj_create(lv_scr_act()); lv_obj_add_event_cb(obj1,my_event_cb,LV_EVENT_CLICKED,NULL); lv_obj_set_size(obj1,300,300); obj2 = lv_obj_create(lv_scr_act()); lv_obj_add_event_cb(obj2,my_event_cb,LV_EVENT_LONG_PRESSED,NULL); }
小结
本部分介绍了基础对象,熟悉掌握会查找即可。下一节内容是实例化到freertos工程中的一些使用,并介绍lvgl部件的使用。