LVGL 控件之复选框（lv_checkbox）和下拉列表（lv_dropdown）

news2024/12/26 11:09:13

目录

  • 一、复选框
    • 1、组成
    • 2、设置复选框文本
    • 3、复选框部件的状态
    • 4、复选框事件
    • 5、API 函数
  • 二、下拉列表
    • 1、组成
    • 2、选项
      • 2.1 添加选项
      • 2.2 获取当前选中的选项
    • 3、设置
      • 3.1 设置列表展开方向
      • 3.2 设置下拉列表图标
      • 3.3 设置列表常显文本
    • 4、事件
    • 5、API 函数

一、复选框

1、组成

复选框部件由两个部分组成：主体和勾选框，示意图如下：

  • LV_PART_MAIN 这是复选框的背景，它使用文本和所有典型的背景样式属性。 pad_column 调整复选框和标签之间的间距
  • LV_PART_INDICATOR “勾选框”是一个使用所有典型背景样式属性的正方形。 默认情况下，它的大小等于主要部分字体的高度。 填充属性使复选框在相应方向上变大。

void my_gui(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);
}

2、设置复选框文本

复选框部件的文本设置函数有两个：lv_checkbox_set_text 和 lv_checkbox_set_text_static，前者设置的文本是保存在动态分配的内存中的，而后者设置的是静态的文本。

在这里插入图片描述

void my_gui(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);
}

3、复选框部件的状态

复选框的状态有三种：选中、未选中以及禁用，用户需要为其添加、清除状态，可以调用 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); /* 清除禁用状态 */

在这里插入图片描述

void my_gui(void)
{
    lv_obj_t *cb1 = lv_checkbox_create(lv_scr_act());
    lv_checkbox_set_text(cb1, "CheckBox1");
    lv_obj_add_state(cb1, LV_STATE_CHECKED);  // 设置选中状态
    lv_obj_align(cb1, LV_ALIGN_CENTER, 0,0);

    lv_obj_t *cb2 = lv_checkbox_create(lv_scr_act());
    lv_checkbox_set_text(cb2, "CheckBox2");
    lv_obj_add_state(cb2, LV_STATE_DISABLED);
    lv_obj_add_state(cb2, LV_STATE_CHECKED);  // 设置选中并禁用状态

    lv_obj_align(cb2, LV_ALIGN_CENTER, 0, 50);

    lv_obj_t *cb3 = lv_checkbox_create(lv_scr_act());
    lv_checkbox_set_text(cb3, "CheckBox3");
    lv_obj_add_state(cb3, LV_STATE_DISABLED);  // 设置禁用状态
    lv_obj_align(cb3, LV_ALIGN_CENTER, 0, 100);
}

4、复选框事件

  1. LV_EVENT_VALUE_CHANGED：当复选框被切换时发送；
  2. LV_EVENT_DRAW_PART_BEGIN：绘制开始；
  3. LV_EVENT_DRAW_PART_END：绘制结束。

例：通过点击复选框触发事件，并打印记录下事件：

static lv_obj_t* cb1;
static lv_obj_t* cb2;
static lv_obj_t* cb3;

static void checkbox_event_cb(lv_event_t *e) {
    lv_obj_t *target = lv_event_get_target(e);

    if(target == cb1) {
        printf("cb1 clicked!\r\n");
    } else if (target == cb2) {
        printf("cb2 clicked!\r\n");
    } else if (target == cb3) {
        printf("cb3 clicked!\r\n");
    }
}

void my_gui(void) {
    cb1 = lv_checkbox_create(lv_scr_act());    /* 创建复选框 */
    lv_checkbox_set_text(cb1, "CheckBox1");    /* 动态设置复选框的文本 */
    lv_obj_align(cb1, LV_ALIGN_CENTER, 0, 0);

    cb2 = lv_checkbox_create(lv_scr_act());    /* 创建复选框 */
    lv_checkbox_set_text(cb2, "CheckBox2");    /* 动态设置复选框的文本 */
    lv_obj_align(cb2, LV_ALIGN_CENTER, 0, 50);

    cb3 = lv_checkbox_create(lv_scr_act());    /* 创建复选框 */
    lv_checkbox_set_text(cb3, "CheckBox3");    /* 动态设置复选框的文本 */
    lv_obj_align(cb3, LV_ALIGN_CENTER, 0, 100);


    lv_obj_add_event_cb(cb1, checkbox_event_cb, LV_EVENT_VALUE_CHANGED, NULL);
    lv_obj_add_event_cb(cb2, checkbox_event_cb, LV_EVENT_VALUE_CHANGED, NULL);
    lv_obj_add_event_cb(cb3, checkbox_event_cb, LV_EVENT_VALUE_CHANGED, NULL);
}

5、API 函数

函数含义
lv_checkbox_create()创建复选框
lv_checkbox_set_text()设置复选框的文本。文本的内存可能会被释放
lv_checkbox_set_text_static()设置复选框的文本。文本将在静态区中
lv_checkbox_get_text()获取复选框的文本

二、下拉列表

1、组成

下拉列表部件由五个部分组成，示意图如下：

按钮部分：

  1. LV_PART_MAIN：按钮的主体背景；
  2. LV_PART_INDICATOR：指示器，例如上图向下的箭头。

列表部分：

  1. LV_PART_SELECTED：当前选中的选项；
  2. LV_PART_SCROLLBAR：滚动条；
  3. LV_PART_MAIN：列表主体背景。

下拉列表允许用户从选项列表中选择一个值。

下拉列表的选项表默认是关闭的，其中的选项可以是单个值或预定义文本。 当单击下拉列表后，其将创建一个列表，用户可以从中选择一个选项。 当用户选择了一个值后，该列表将被删除，下次点击会再重新生成。

下拉列表已经添加到默认组。此外，下拉列表是一个可编辑的对象，允许通过编码器导航选项。

lv_obj_t *dd = lv_dropdown_create(lv_scr_act());
lv_obj_center(dd);

2、选项

2.1 添加选项

用户需要在下拉列表中添加选项，可以使用以下三种方法：

  1. 调用 lv_dropdown_set_options 函数添加选项，该函数如下所示：
lv_dropdown_set_options(dropdown，"First \n Second \n Third");

在上述的函数中，我们通过字符串传递下拉列表选项，这些选项字符串之间通过‘\n’ 进行分隔。

  1. 调用 lv_dropdown_add_option 函数添加选项，该函数如下所示：
lv_dropdown_add_option(dropdown，"New option"，pos);

上述的函数只会添加一个选项，其形参 pos 表示添加的位置，注意：0 表示列表最上面的位置，以此向下类推。

  1. 调用 lv_dropdown_set_static_options 函数添加选项，该函数如下所示：
lv_dropdown_set_options_static (dropdown，options);

上述函数所添加的是静态选项，在这种情况下，用户不能再使用 lv_dropdown_add_option 函数添加选项，否则有可能会出现问题。

例：

void my_gui(void)
{
    // 方案一
    lv_obj_t *dd1 = lv_dropdown_create(lv_scr_act());
    lv_dropdown_set_options(dd1, "a\nb\nc\nd");
    lv_dropdown_set_selected(dd1, 0);  // 默认显示的选项
    lv_obj_set_pos(dd1, 100, 100);

    // 方案二
    lv_obj_t *dd2 = lv_dropdown_create(lv_scr_act());
    lv_dropdown_add_option(dd2, "0", 0);
    lv_dropdown_add_option(dd2, "1", 1);
    lv_dropdown_add_option(dd2, "2", 2);
    lv_dropdown_add_option(dd2, "3", 3);
    lv_dropdown_set_selected(dd2, 1);  // 默认显示的选项
    lv_obj_set_pos(dd2, 300, 100);

    // 方案三
    lv_obj_t *dd3 = lv_dropdown_create(lv_scr_act());
    lv_dropdown_set_options_static (dd3, "1");
    lv_obj_set_pos(dd3, 500, 100);
}

2.2 获取当前选中的选项

当用户选中所需的选项之后，如果没有任何反馈，这将无法和其他板块进行交互，因此，我们需要在触发的事件回调中获取当前选中的选项索引和文本，相关函数如下：

lv_dropdown_get_selected(dropdown)  /* 获取选中的选项索引 */

lv_dropdown_get_selected_str(dropdown，buf, buf_size)  /* 获取选项字符串，保存到buf */

上述源码中，第一个函数用于获取选中的选项索引，第二个函数用于获取选中的选项文本，并将其保存到指定的 buf 中。

3、设置

3.1 设置列表展开方向

在默认的情况下，当用户点击下拉列表后，其都是往下展开的，如果用户想修改列表展开的方向，可以调用以下函数：

lv_dropdown_set_dir(dropdown，LV_DIR_LEFT/RIGHT/UP/BOTTOM)  /* 设置展开方向 */

在上述函数中，第二个形参代表列表的展开方向，用户可以选择上、下、左、右四个方向。

lv_dropdown_set_dir(dd1, LV_DIR_LEFT); /* 设置为左侧展开 */

其它几种情况就不一一展示。

3.2 设置下拉列表图标

下拉列表的图标箭头默认是向下的，如果用户修改了列表的展开方向，此时的箭头方向和展开方向就对应不上了。为了解决上述的问题，LVGL 提供了相关的图标设置函数：

lv_dropdown_set_symbol(dropdown，LV_SYMBOL_…)  /* 设置图标 */

在上述函数中，第二个形参代表的是图标，一般情况下，我们调用内部的字体图标即可满足需求，修改后的图标如下图所示：

3.3 设置列表常显文本

在默认情况下，当用户选中某个选项后，该选项的文本会更新到列表的头部，示意图如下：

在上图中， 当用户选中第一个选项，其文本内容（a）将更新到列表头部，如果用户需要设置列表头部的文本为固定内容，可以调用lv_dropdown_set_text 函数。

4、事件

除了 通用事件 ，下拉列表还可以发送以下 特殊事件 ：

  • LV_EVENT_VALUE_CHANGED 在选择新选项或打开/关闭列表时发送。
  • LV_EVENT_CANCEL 列表关闭时发送
  • LV_EVENT_READY 打开列表时发送

5、API 函数

函数描述
lv_dropdown_create()创建下拉列表
lv_dropdown_set_text()设置下拉列表按钮的文本（常显文本）
lv_dropdown_set_options()添加选项（动态）
lv_dropdown_set_options_static()添加选项（静态）
lv_dropdown_add_option()添加单个选项
lv_dropdown_clear_options()清除所有选项
lv_dropdown_set_selected()设置当前所选项
lv_dropdown_set_dir()设置展开方向
lv_dropdown_set_symbol()设置图标
lv_dropdown_set_selected_highlight()设置当前选中的选项是否高亮
lv_dropdown_get_list()获取下拉列表，以设置样式或进行其他修改
lv_dropdown_get_text()获取下拉列表按钮的文本
lv_dropdown_get_options()获取下拉列表的选项
lv_dropdown_get_selected()获取所选选项的索引
lv_dropdown_get_option_cnt()获取选项的总数
lv_dropdown_get_selected_str()获取当前选中的选项文本
lv_dropdown_get_symbol()获取图标
lv_dropdown_get_selected_highlight()判断当前选中的选项是否高亮
lv_dropdown_get_dir()获取展开方向
lv_dropdown_open()打开下拉列表
lv_dropdown_close()关闭下拉列表

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.coloradmin.cn/o/2106165.html

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈，一经查实，立即删除！

相关文章

Android studio 导出 release 版本的 .aar 文件

Android studio 导出 release 版本的 .aar 文件

不同的android studio 版本可能会有不同的方案，我针对的是： 首先打开settings: Setting —> Experimental 界面 将选项：【configure all gradle tasks】勾上： 接着点击 File —> Sync Project with Gradle Files 然后&…
阅读更多...
【js逆向专题】8.webpack打包

【js逆向专题】8.webpack打包

本教程仅供学习交流使用，严禁用于商业用途和非法用途，否则由此产生的一切后果均与作者无关，请各学员自觉遵守相关法律法规。小节目标: 熟悉 webpack打包原理熟悉 webpack打包方式了解 webpack多模块打包 一. webpack打包 概念: webpack 是…
阅读更多...
【颤抖不再怕，帕金森患者的活力锻炼秘籍！】

【颤抖不再怕，帕金森患者的活力锻炼秘籍！】

Hey小伙伴们~👋 今天我们来聊聊一个温暖而重要的话题——如何帮助我们的亲人或自己，在帕金森病的挑战下，依然保持生活的活力与光彩！🌈 帕金森病，这个名字听起来或许让人心生畏惧，但它绝不是生活…
阅读更多...
地产行业如何利用Java实现精准营销

地产行业如何利用Java实现精准营销

在当今竞争激烈的地产市场中，如何有效触达潜在客户并促进销售转化，成为众多房企关注的焦点。106短信平台作为一种精准的营销工具，在地产行业中发挥着越来越重要的作用。 支持免费对接试用：乐讯通PaaS平台 找好用的短信平台,选择乐…
阅读更多...
AUTO TECH 2025 华南展 第十二届广州国际汽车零部件加工技术及汽车模具展览会——探索未来出行的创新动力

AUTO TECH 2025 华南展 第十二届广州国际汽车零部件加工技术及汽车模具展览会——探索未来出行的创新动力

AUTO TECH 2025 华南展 第十二届广州国际汽车零部件加工技术及汽车模具展览会——探索未来出行的创新动力 随着全球汽车工业的不断进步和新能源汽车技术的迅猛发展，2025年11月20-22日在广州保利世贸博览馆将迎来一场行业瞩目的盛会——2025 第十二届广州国际汽车零部…
阅读更多...
外接串口板，通过串口打开adb模式

外接串口板，通过串口打开adb模式

一、依赖库 import subprocess import serial from serial.tools import list_ports import logging import time 二、代码 import subprocessimport serial from serial.tools import list_ports import logging import timedef openAdb(com):# com []# for i in list_por…
阅读更多...
无人机之地面站篇

无人机之地面站篇

无人机的地面站，又称无人机控制站，是整个无人机系统的重要组成部分，扮演着作战指挥中心的角色。以下是对无人机地面站的详细阐述： 一、定义与功能 无人机地面站是指具有对无人机飞行平台和任务载荷进行监控和操纵能力的一组设备&…
阅读更多...
[数据集][目标检测]翻越栏杆行为检测数据集VOC+YOLO格式512张1类别

[数据集][目标检测]翻越栏杆行为检测数据集VOC+YOLO格式512张1类别

数据集格式：Pascal VOC格式YOLO格式(不包含分割路径的txt文件，仅仅包含jpg图片以及对应的VOC格式xml文件和yolo格式txt文件) 图片数量(jpg文件个数)：512 标注数量(xml文件个数)：512 标注数量(txt文件个数)：512 标注类别…
阅读更多...
通过卷积神经网络（CNN）识别和预测手写数字

通过卷积神经网络（CNN）识别和预测手写数字

一：卷积神经网络（CNN）和手写数字识别MNIST数据集的介绍 卷积神经网络（Convolutional Neural Networks，简称CNN）是一种深度学习模型，它在图像和视频识别、分类和分割任务中表现出色。CNN通过模仿…
阅读更多...
快排的深入学习

快排的深入学习

目录 交换类排序 一、冒泡排序 1. 算法介绍 2.算法流程 3. 算法性能分析 （1）时间复杂度分析 （2） 空间复杂度分析 冒泡排序的特性总结： 二、快速排序 1.算法介绍 2. 执行流程 1). hoare版本 2). 挖坑法 3)…
阅读更多...
5.9灰度直方图

5.9灰度直方图

目录 实验原理 实验代码 运行结果 实验原理 calcHist 函数通常是指在计算机视觉和图像处理中用于计算图像直方图的一个函数。 cv:calcHist () 用于计算一个或多个数组的直方图。它可以处理图像数据并返回一个表示像素强度分布的向量（对于灰度图像）或…
阅读更多...
Java：集合的相关汇总介绍

Java：集合的相关汇总介绍

主要包含Set(集）、 List(列表包含 Queue）和 Map(映射)。 1、Collection： Collection 是集合 List、 Set、 Queue 的最基本的接口。 2、Iterator：迭代器，可以通过迭代器遍历集合中的数据。 3、Map：是映射表的…
阅读更多...
VTK随笔十三：QT与VTK的交互

VTK随笔十三：QT与VTK的交互

一、基于 Ot的 VTK 应用程序 以 VTK 读入一幅 JPG 图像，然后在 Qt 界面上使用 VTK 显示该图像为例，演示QT与VTK的交互。 1、创建QT项目QT_VTK_Demo 2、配置VTK库 在CMakeLists.txt中添加如下代码： 配置完成后重新打开工程加载VTK库。 3、编…
阅读更多...
制裁下的转型：俄罗斯加密货币战略布局与人民币挂钩BRICS稳定币的崛起

制裁下的转型：俄罗斯加密货币战略布局与人民币挂钩BRICS稳定币的崛起

在国际制裁重压下，俄罗斯正在积极推进加密货币政策改革，通过设立加密货币交易所和推动与人民币挂钩的BRICS稳定币，试图在全球金融体系中谋求新的生存与发展路径。这一系列举措标志着俄罗斯在数字经济领域的重大转向，既是对当前经济…
阅读更多...
Linux【5】远程管理

Linux【5】远程管理

目录 shutdown关机 ifconfig输出网卡信息 ping ip地址——检测连接正常 ssh 【-p port】 userip scp不同主机之间的文件copy 当前文件复制到远程 远程文件复制到本地 复制文件夹 -r shutdown关机 shutdown -r 重启 ifconfig输出网卡信息 ping ip地址——检测连接正常…
阅读更多...
集成电路学习：什么是PCB印刷电路板

集成电路学习：什么是PCB印刷电路板

一、PCB：印刷电路板 PCB，全称为Printed Circuit Board，即印刷电路板，是现代电子设备中不可或缺的基础构件。它作为电子元器件的载体和连接体，在电子设备中发挥着至关重要的作用。以下是对PCB的详细解析： 二…
阅读更多...
【C++初阶】一、C++入门（万字总结）

【C++初阶】一、C++入门（万字总结）

「前言」 「专栏」C详细版专栏 🌈个人主页： 代码探秘者 🌈C语言专栏：C语言 🌈C专栏： C 🌈喜欢的诗句:无人扶我青云志 我自踏雪至山巅 目录 一、关于C 1.1 什么是C 1.2 C 发展史 二、C关键字(C…
阅读更多...
5.8幂律变换

5.8幂律变换

目录 示例代码1 运行结果1 示例代码2 运行结果2 补充示例原理 示例：使用cv::pow进行图像处理 代码 运行结果 ​编辑 补充 实验代码3 运行结果3​编辑 在OpenCV中，幂律变换（Power Law Transformations）是一种常用的图像…
阅读更多...
集成电路学习：什么是MOSFET（MOS管）

集成电路学习：什么是MOSFET（MOS管）

一、MOSFET：MOS管 MOSFET，全称Metal-Oxide-Semiconductor Field-Effect Transistor，即金属-氧化物半导体场效应晶体管，也常被称为MOS管或金氧半场效晶体管。它是一种可以广泛使用在模拟电路与数字电路的场效应晶体管（f…
阅读更多...
【游戏安全】CheatEngine基础使用——如何对不同类型的数值进行搜索？如何破解数值加密找到想修改的数值？

【游戏安全】CheatEngine基础使用——如何对不同类型的数值进行搜索？如何破解数值加密找到想修改的数值？

游戏安全 不同数值类型的搜索破解简单数值加密 不同数值类型的搜索 可以在游戏中看到很精确的物品数量，但是在CE中却什么都扫不到。 这是因为他的数值类型可能并不是四字节的，在游戏中这个数值的机制是一个慢慢增长的数值，所以他很有可能是…
阅读更多...
推荐文章
最新文章

Copyright @ 2022~2023