《LVGL开发指南 V1.0（G4电机开发板专用）》第十一章 复选框部件(lv_checkbox)
第十一章 复选框部件(lv_checkbox)
复选框部件常用于条款、协议的确定，以及一些多选项控制的场景。
本章节将分为以下几个小节：
11.1 复选框部件的组成
11.2 复选框部件的相关知识
11.3 复选框部件API函数
11.4 复选框部件实验
11.1 复选框部件的组成
复选框部件由两个部分组成：主体和勾选框，示意图如下：
图11.1.1 复选框的组成
关于部件样式设置的内容，请大家参考6.4.4章节。
11.2 复选框部件的相关知识
11.2.1 设置复选框文本
复选框部件的文本设置函数有两个：lv_checkbox_set_text和lv_checkbox_set_text_static，前者设置的文本是保存在动态分配的内存中的，而后者设置的是静态的文本。
接下来，我们以简单示例来理解复选框文本的设置，示例代码如下所示：
void lv_mainstart(void)
{
lv_obj_t* cb1 = lv_checkbox_create(lv_scr_act()); /* 创建复选框 */
lv_checkbox_set_text(cb1, "CheckBox1"); /* 动态设置复选框的文本 */
lv_obj_align(cb1, LV_ALIGN_CENTER, 0,0);
lv_obj_t* cb2 = lv_checkbox_create(lv_scr_act()); /* 创建复选框 */
lv_checkbox_set_text_static(cb2, "CheckBox2"); /* 静态设置复选框的文本 */
lv_obj_align_to(cb2, cb1,LV_ALIGN_LEFT_MID, 0, 50);
}
在上述源码中，我们创建了两个复选框部件，并分别设置了动态文本和静态文本，示例代码可以在PC模拟器中运行，效果图如下所示：
图11.2.1.1 设置复选框的文本
11.2.2 复选框部件的状态
复选框的状态有三种：选中、未选中以及禁用，用户需要为其添加、清除状态，可以调用lv_obj_add_state（添加）和lv_obj_clear_state（清除）函数，示例如下：
lv_obj_add_state(cb, LV_STATE_CHECKED); /* 选中复选框 */ lv_obj_clear_state(cb, LV_STATE_CHECKED); /* 清除选中状态（未选中）*/ lv_obj_add_state(cb, LV_STATE_DISABLED); /* 禁用复选框 */ lv_obj_clear_state(cb, LV_STATE_DISABLED); /* 清除禁用状态 */
11.2.3 复选框事件
① LV_EVENT_VALUE_CHANGED：当复选框被切换时发送；
② LV_EVENT_DRAW_PART_BEGIN：绘制开始；
③ LV_EVENT_DRAW_PART_END：绘制结束。
11.3 复选框部件API函数
LVGL官方提供了一些与复选框部件相关API，如下表所示：
表11.3.1 复选框部件相关的API函数
接下来，我们介绍LVGL复选框部件常用的API函数：
1. lv_checkbox_create函数
创建复选框，其函数原型如下所示：
lv_obj_t *lv_checkbox_create(lv_obj_t *parent);
该函数的形参描述如表11.3.2所示：
表11.3.2 lv_checkbox_create函数形参描述
返回值：指向已创建复选框的指针。
2. lv_checkbox_set_text函数
设置复选框的文本（动态），其函数原型如下所示：
void lv_checkbox_set_text(lv_obj_t *obj,const char *txt);
该函数的形参描述如表11.3.3所示：
表11.3.3 lv_checkbox_set_text函数形参描述
返回值：无。
3. lv_checkbox_set_text_static函数
设置复选框的文本（静态），其函数原型如下所示：
void lv_checkbox_set_text_static(lv_obj_t *obj,const char *txt);
该函数的形参描述如表11.3.4所示：
表11.3.4 lv_checkbox_set_text_static函数形参描述
返回值：无。
4. lv_checkbox_get_text函数
获取复选框的文本，其函数原型如下所示：
const char* lv_checkbox_get_text(const lv_obj_t *obj);
该函数的形参描述如表11.3.5所示：
表11.3.5 lv_checkbox_get_text函数形参描述
返回值：指向复选框文本的指针。
11.4 复选框部件实验
11.4.1 硬件设计
1. 例程功能
本实验主要测试复选框部件API函数的使用，实验现象：开机后，屏幕上显示三个复选框、一个主标题（MENU）和一个总价格（Aggregate）。用户通过KEY0、KEY1来切换当前选项，通过KEY2选中选项，勾选不同的项目（菜品），对应的价格会不同，其总价会显示在屏幕下方。与此同时，LED0闪烁，提示系统正在运行。
该实验的完整源码，请参考《LVGL例程8 checkbox(复选框)》例程，路径：A盘→4，程序源码 →3，扩展例程 →3，LVGL例程。
11.4.2 软件设计
11.4.2.1 程序流程图
本实验的程序流程图，如下图11.4.2.1.1所示：
图11.4.2.1.1 复选框部件实验流程图
11.4.2.2 程序解析
关于LVGL的用户代码，我们都是在lv_mainstart.c文件中编写的，本实验的源码如下所示：
/**************************** 第一部分 开始 ****************************/
/**
* @brief LVGL演示
* @param 无
* @return 无
*/
void lv_mainstart(void)
{
g = lv_group_create();
lv_indev_set_group(indev_keypad, g);
lv_example_label(); /* 菜单标题、总价标签 */
lv_example_checkbox(); /* 菜品复选框 */
}
/**************************** 第一部分 结束 ****************************/
/**************************** 第二部分 开始 ****************************/
/**
* @brief 标题、总价格标签
* @param 无
* @return 无
*/
static void lv_example_label(void)
{
/* 菜单标题标签 */
label_menu = lv_label_create(lv_scr_act());
lv_label_set_text(label_menu, "MENU");
lv_obj_set_style_text_font(label_menu, &lv_font_montserrat_22, 0);
lv_obj_align(label_menu, LV_ALIGN_CENTER, 0, -scr_act_height() * 2 / 5 );
/* 总价格标签 */
label_aggregate = lv_label_create(lv_scr_act());
lv_label_set_text(label_aggregate, "Aggregate : $0");
lv_obj_set_style_text_font(label_aggregate, &lv_font_montserrat_22, 0);
lv_obj_align(label_aggregate, LV_ALIGN_CENTER, 0, scr_act_height()*2/5 );
}
/**************************** 第二部分 结束 ****************************/
/**************************** 第三部分 开始 ****************************/
/**
* @brief 回调事件
* @param *e ：事件相关参数的集合，它包含了该事件的所有数据
* @return 无
*/
static void checkbox_event_cb(lv_event_t *e)
{
lv_obj_t *target = lv_event_get_target(e); /* 获取触发源 */
if(target == checkbox1) /* 复选框1触发 */
{
lv_obj_has_state(checkbox1,
LV_STATE_CHECKED) ? (aggregate += 19) : (aggregate -= 19);
}
else if(target == checkbox2) /* 复选框2触发 */
{
lv_obj_has_state(checkbox2,
LV_STATE_CHECKED) ? (aggregate += 29) : (aggregate -= 29);
}
/* 更新总价格标签 */
lv_label_set_text_fmt(label_aggregate, "Aggregate : $%d", aggregate);
}
/**
* @brief 菜品复选框
* @param 无
* @return 无
*/
static void lv_example_checkbox(void)
{
/* 创建基础对象作为背景 */
lv_obj_t *obj = lv_obj_create(lv_scr_act());
lv_obj_set_size(obj, 215 , 140);
lv_obj_align(obj, LV_ALIGN_CENTER, 0 , 0);
/* 菜品1复选框 */
checkbox1 = lv_checkbox_create(obj);
lv_checkbox_set_text(checkbox1, "Roast chicken $19");
lv_obj_set_style_text_font(checkbox1, &lv_font_montserrat_16, 0);
lv_obj_align(checkbox1, LV_ALIGN_LEFT_MID, 0, -scr_act_height() / 5 );
lv_obj_add_event_cb(checkbox1, checkbox_event_cb,
LV_EVENT_VALUE_CHANGED, NULL);
/* 菜品2复选框 */
checkbox2 = lv_checkbox_create(obj);
lv_checkbox_set_text(checkbox2, "Roast duck $29");
lv_obj_set_style_text_font(checkbox2, &lv_font_montserrat_16, 0);
lv_obj_align_to(checkbox2, checkbox1, LV_ALIGN_OUT_BOTTOM_LEFT, 0, scr_act_height() / 16);
lv_obj_add_event_cb(checkbox2, checkbox_event_cb,
LV_EVENT_VALUE_CHANGED, NULL);
/* 菜品3复选框 */
checkbox3 = lv_checkbox_create(obj);
lv_checkbox_set_text(checkbox3, "Roast fish $39");
lv_obj_set_style_text_font(checkbox3, &lv_font_montserrat_16, 0);
lv_obj_align_to(checkbox3, checkbox2, LV_ALIGN_OUT_BOTTOM_LEFT, 0,
scr_act_height() / 16);
lv_obj_add_state(checkbox3, LV_STATE_DISABLED);
lv_group_add_obj(g, checkbox1); /* 加入按键组 */
lv_group_add_obj(g, checkbox2); /* 加入按键组 */
lv_group_add_obj(g, checkbox3); /* 加入按键组 */
}
/**************************** 第三部分 结束 ****************************/
上述源码可分为以下三个部分：
① lv_mainstart接口函数。在该函数中，我们调用了标签和复选框示例函数；
② 我们创建菜单标题标签和总价格标签；
③ 菜品复选框的实现。我们先创建出来一个背景（基础对象），然后在背景中添加菜品复选框并为它们添加事件回调。当用户修改某个复选框的状态时，会触发事件回调，在回调函数中，更新当前的总价格。
11.4.3 下载验证
把工程编译并下载到我们的开发板中， 运行效果如图11.4.3.1所示：
图11.4.3.1复选框部件实验
来自 “ ITPUB博客 ” ，链接：https://blog.itpub.net/70040860/viewspace-3172274/ ，如需转载，请注明出处，否则将追究法律责任。
最新文章
- 【直播预告】直击嵌入式开发瓶颈！
- 《PDxxS1步进电机闭环驱动器用户手册_V1.0》第六章
- 《PDxxS1步进电机闭环驱动器用户手册_V1.0》第五章（5.4-5.5）
- 《PDxxS1步进电机闭环驱动器用户手册_V1.0》第五章（5.1-5.3）
- 《PDxxS1步进电机闭环驱动器用户手册_V1.0》第四章（4.4-4.5）
- 《PDxxS1步进电机闭环驱动器用户手册_V1.0》第四章（4.1-4.3）
- 《PDxxS1步进电机闭环驱动器用户手册_V1.0》第1-3章
- 《PDxxS1_CANopen协议控制教程_V1.0》第11章
- 《PDxxS1_CANopen协议控制教程_V1.0》第9-10章
- 《PDxxS1_CANopen协议控制教程_V1.0》第7-8章
