LVGL中的复选框（lv_checkbox）是一个基础但非常实用的控件，它允许用户从多个选项中选择一个或多个。下面将详细介绍其创建、样式设置、状态控制、事件处理等方面的使用。

LVGL 的复选框控件主要由两部分组成：
主体 (LV_PART_MAIN)：这是复选框的背景部分，包含了文本标签（Label）和所有的典型背景样式属性。你可以通过 pad_column 属性来调整文本和勾选框之间的间距。
指示器 (LV_PART_INDICATOR)：这是复选框的实际“勾选框”部分，默认是一个正方形，其大小通常等于主体部分字体的高度。它同样可以使用所有的背景样式属性。

以下是GUI_guider平台的复选框控件：

以下是复选框常用的信号以及回调函数：

Custom_code是用来自定义的函数。

以下是实现的具体代码：
//Write codes screen_1_cb_1
ui->screen_1_cb_1 = lv_checkbox_create(ui->screen_1);
lv_checkbox_set_text(ui->screen_1_cb_1, “复选框”);
lv_obj_set_pos(ui->screen_1_cb_1, 192, 174);

//Write style for screen_1_cb_1, Part: LV_PART_MAIN, State: LV_STATE_DEFAULT.
//设置复选框的样式（主部分 LV_PART_MAIN 和默认状态 LV_STATE_DEFAULT）
//设置复选框周围的内边距为 0，分别为上、左、右、下内边距
lv_obj_set_style_pad_top(ui->screen_1_cb_1, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_pad_left(ui->screen_1_cb_1, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_pad_right(ui->screen_1_cb_1, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
lv_obj_set_style_pad_bottom(ui->screen_1_cb_1, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
//设置文本的颜色为十六进制的 0x0D3055，这是一种深紫色。
lv_obj_set_style_text_color(ui->screen_1_cb_1, lv_color_hex(0x0D3055), LV_PART_MAIN|LV_STATE_DEFAULT);
//设置文本的字体为 lv_font_montserratMedium_16，这是一种中等大小的字体
lv_obj_set_style_text_font(ui->screen_1_cb_1, &lv_font_montserratMedium_16, LV_PART_MAIN|LV_STATE_DEFAULT);
//设置文本的透明度为 255（完全不透明）。
lv_obj_set_style_text_opa(ui->screen_1_cb_1, 255, LV_PART_MAIN|LV_STATE_DEFAULT);
//设置文本字母之间的间距为 2 像素。
lv_obj_set_style_text_letter_space(ui->screen_1_cb_1, 2, LV_PART_MAIN|LV_STATE_DEFAULT);
//设置边框宽度为 0，即不显示边框。
lv_obj_set_style_border_width(ui->screen_1_cb_1, 0, LV_PART_MAIN|LV_STATE_DEFAULT);
//设置复选框的圆角半径为 6 像素。
lv_obj_set_style_radius(ui->screen_1_cb_1, 6, LV_PART_MAIN|LV_STATE_DEFAULT);
//设置背景透明度为 255（完全不透明）。
lv_obj_set_style_bg_opa(ui->screen_1_cb_1, 255, LV_PART_MAIN|LV_STATE_DEFAULT);
//设置背景颜色为 0xffffff（白色）。
lv_obj_set_style_bg_color(ui->screen_1_cb_1, lv_color_hex(0xffffff), LV_PART_MAIN|LV_STATE_DEFAULT);
//设置背景颜色的渐变方向为 LV_GRAD_DIR_NONE，即没有渐变。
lv_obj_set_style_bg_grad_dir(ui->screen_1_cb_1, LV_GRAD_DIR_NONE, LV_PART_MAIN|LV_STATE_DEFAULT);
//设置阴影宽度为 0，即不显示阴影。
lv_obj_set_style_shadow_width(ui->screen_1_cb_1, 0, LV_PART_MAIN|LV_STATE_DEFAULT);

//Write style for screen_1_cb_1, Part: LV_PART_INDICATOR, State: LV_STATE_DEFAULT.
//设置复选框的指示器部分样式（LV_PART_INDICATOR 和默认状态 LV_STATE_DEFAULT）
//设置复选框指示器的内边距为 3 像素。
lv_obj_set_style_pad_all(ui->screen_1_cb_1, 3, LV_PART_INDICATOR|LV_STATE_DEFAULT);
//设置复选框指示器的边框宽度为 2 像素。
lv_obj_set_style_border_width(ui->screen_1_cb_1, 2, LV_PART_INDICATOR|LV_STATE_DEFAULT);
//设置边框透明度为 255（完全不透明）。
lv_obj_set_style_border_opa(ui->screen_1_cb_1, 255, LV_PART_INDICATOR|LV_STATE_DEFAULT);
//设置边框颜色为 0x2195f6（蓝色）。
lv_obj_set_style_border_color(ui->screen_1_cb_1, lv_color_hex(0x2195f6), LV_PART_INDICATOR|LV_STATE_DEFAULT);
//设置复选框指示器的边框显示全部（四个边）。
lv_obj_set_style_border_side(ui->screen_1_cb_1, LV_BORDER_SIDE_FULL, LV_PART_INDICATOR|LV_STATE_DEFAULT);
//设置复选框指示器的圆角半径为 6 像素。
lv_obj_set_style_radius(ui->screen_1_cb_1, 6, LV_PART_INDICATOR|LV_STATE_DEFAULT);
//设置复选框指示器的背景透明度为 255（完全不透明）。
lv_obj_set_style_bg_opa(ui->screen_1_cb_1, 255, LV_PART_INDICATOR|LV_STATE_DEFAULT);
//设置复选框指示器的背景颜色为 0xffffff（白色）。
lv_obj_set_style_bg_color(ui->screen_1_cb_1, lv_color_hex(0xffffff), LV_PART_INDICATOR|LV_STATE_DEFAULT);
//设置复选框指示器背景的渐变方向为 LV_GRAD_DIR_NONE，即没有渐变。
lv_obj_set_style_bg_grad_dir(ui->screen_1_cb_1, LV_GRAD_DIR_NONE, LV_PART_INDICATOR|LV_STATE_DEFAULT);

本文章由威三学社出品
对课程感兴趣可以私信联系