LVGL 学习笔记(一)

从今天开始我将开始记录我的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部件的使用。

  • 19
    点赞
  • 23
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值