LVGL学习笔记 30 - List(列表)

这篇具有很好参考价值的文章主要介绍了LVGL学习笔记 30 - List(列表)。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

目录

1. 添加文本

2. 添加按钮

3. 事件

4. 修改样式

4.1 背景色

4.2 改变项的颜色


列表是一个垂直布局的矩形,可以向其中添加按钮和文本。

    lv_obj_t* list1 = lv_list_create(lv_scr_act());
    lv_obj_set_size(list1, 180, 220);
    lv_obj_center(list1);

LVGL学习笔记 30 - List(列表),UI,学习,笔记,LVGL

部件包含:

LV_PART_MAIN - 主要的属性,大部分是这个部件。

LV_PART_SCROLLBAR - 滚动条的属性。

1. 添加文本

lv_obj_t * lv_list_add_text(lv_obj_t * list, const char * txt)

添加一行文本,当字符串长度超过显示时,会自动滚动显示。

lv_list_add_text(list1, "item1");
lv_list_add_text(list1, "item2");
lv_list_add_text(list1, "item3");
lv_list_add_text(list1, "item4");

LVGL学习笔记 30 - List(列表),UI,学习,笔记,LVGL

注意返回值,函数返回这一行的对象,可以用于设置事件响应点击行为。

2. 添加按钮

功能和添加文本类似,只是多了一个icon的显示。

lv_obj_t * lv_list_add_btn(lv_obj_t * list, const void * icon, const char * txt)

 icon可以是系统符号,也可以是图片(如下面的代码,imgFan是之前学习image时的图片句柄),而字符串部分如果超出显示会滚动。

lv_list_add_text(list1, "item4 - try to scroll");

lv_list_add_btn(list1, LV_SYMBOL_FILE, "New");
lv_list_add_btn(list1, &imgFan, "Fan, try to scroll");

LVGL学习笔记 30 - List(列表),UI,学习,笔记,LVGL

同文本,返回值是这一行的对象。

另外,当参数icon为NULL时,不会添加icon,只添加txt;当txt为NULL时,则只添加icon;如果2个都是NULL时,只添加一个无显示的btn。

lv_list_add_btn(list1, NULL, "New");
lv_list_add_btn(list1, LV_SYMBOL_FILE, NULL);
lv_list_add_btn(list1, NULL, NULL);

LVGL学习笔记 30 - List(列表),UI,学习,笔记,LVGL

3. 事件

利用返回的对象值设置每行的事件。

lv_obj_t* item;
item = lv_list_add_btn(list1, &imgFan, "Fan, try to scroll");
lv_obj_add_event_cb(item, listBtnFan_cb, LV_EVENT_CLICKED, NULL);

static void listBtnFan_cb(lv_event_t* event)
{
    lv_event_code_t code = lv_event_get_code(event);
    lv_obj_t* obj = lv_event_get_target(event);
    lv_obj_t* list = lv_event_get_current_target(event);
    if (code == LV_EVENT_CLICKED)
    {
        LV_LOG_USER("Clicked: %s", lv_list_get_btn_text(list, obj));
    }
}

4. 修改样式

4.1 背景色

lv_obj_set_style_bg_color(list1, lv_color_hex(0xff0000), LV_PART_MAIN);

LVGL学习笔记 30 - List(列表),UI,学习,笔记,LVGL

4.2 改变项的颜色

直接改是改不了的,一种方案是通过修改整体的样式实现,另外一种是获得对应控件的句柄来修改。看list代码可以看出,实际btn和label是list的子对象,可以通过函数lv_obj_get_child获得句柄。

item = lv_obj_get_child(list1, 0);
lv_obj_set_style_bg_color(item, lv_color_hex(0xff0000), LV_PART_MAIN);

LVGL学习笔记 30 - List(列表),UI,学习,笔记,LVGL

参数id = 0是因为item1是第一个添加的对象,注意,对于btn,虽然可能添加了2个对象,但是2个是属于一个id。

item = lv_obj_get_child(list1, 5);
lv_obj_set_style_bg_color(item, lv_color_hex(0xff0000), LV_PART_MAIN);

LVGL学习笔记 30 - List(列表),UI,学习,笔记,LVGL文章来源地址https://www.toymoban.com/news/detail-649273.html

到了这里,关于LVGL学习笔记 30 - List(列表)的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • dart 学习列表 List

    在 Dart 编程语言中,List 是一种有序的集合数据类型,用于存储一系列项目。它允许您在单个变量中存储多个项目,并提供了许多操作来管理列表中的数据。以下是关于 Dart 中的 List 的一些重要信息: 创建 List: 您可以使用以下方法之一来创建一个 List: 基本操作: List 提供

    2024年02月11日
    浏览(42)
  • LVGL8.2学习笔记

    笔记主要记录LVGL控件基本的编程使用和相关的程序,并且在程序中对使用到的API函数进行简要注解(有些是个人的理解),以便后续根据实际项目所需直接套用对应的控件代码修改使用;本文主要参考的是正点原子的LVGL相关教程。 LVGL控件的基础知识 (1) C语言编写的LVGL以结

    2024年02月16日
    浏览(45)
  • 【LVGL学习笔记】(二) 基础概念

    LVGL全程LittleVGL,是一个轻量化的,开源的,用于嵌入式GUI设计的图形库。并且配合LVGL模拟器,可以在电脑对界面进行编辑显示,测试通过后再移植进嵌入式设备中,实现高效的项目开发。 LVGL中文教程手册:百问网LVGL中文教程手册文档 以下的内容均是以VS环境下的LVGL模拟器

    2024年02月01日
    浏览(48)
  • 【LVGL学习笔记】(三)控件使用

    LVGL全程LittleVGL,是一个轻量化的,开源的,用于嵌入式GUI设计的图形库。并且配合LVGL模拟器,可以在电脑对界面进行编辑显示,测试通过后再移植进嵌入式设备中,实现高效的项目开发。 LVGL中文教程手册:极客笔记之LVGL教程 特点 弧的0度在右边,90度在下边 效果图 源码

    2024年02月03日
    浏览(45)
  • 【LVGL】学习笔记--(1)Keil中嵌入式系统移植LVGL

    最近emwin用的比较烦躁,同时被LVGL酷炫的界面吸引到了,所以准备换用LVGL试试水。 LVGL(轻量级和通用图形库)是一个免费和开源的图形库,它提供了创建嵌入式GUI所需的一切,具有易于使用的图形元素,美丽的视觉效果和低内存占用。 丰富且强大的模块化图形组件:按钮 (b

    2024年02月02日
    浏览(72)
  • LVGL学习笔记 28 - 键盘keyboard

    目录 1. 设置关联文本框 2. 设置模式 2.1 LV_KEYBOARD_MODE_TEXT_LOWER 2.2 LV_KEYBOARD_MODE_TEXT_UPPER 2.3 LV_KEYBOARD_MODE_SPECIAL 2.4 LV_KEYBOARD_MODE_NUMBER 2.5 LV_KEYBOARD_MODE_USER_1 ~ LV_KEYBOARD_MODE_USER_4 3. 使能弹窗模式 4. 更改按键布局 5. 事件 键盘是一个特殊的按键矩阵,自身实现了按键(map)映射和其他

    2024年02月13日
    浏览(46)
  • html学习3(表格table、列表list)

    1、html表格由table标签来定义。 thead用来定义表格的标题部分,其内部用 th 元素定义列的标题,可以使其在表格中以粗体显示,与普通单元格区分开来。 tbody用来定义表格的主体部分,其内部用tr元素定义行,在行中用td定义单元格数据。 2、如果不定义边框属性border,边框默

    2024年02月14日
    浏览(31)
  • 学习笔记ESP32——lvgl disp移植(1)

    目录 一、简介 二、GitHub上下载lvgl库         1、下载lvgl库 三、准备一个工程  四、修改工程  五、对disp进行修改 ​编辑 六、主函数的修改 七、硬件的修改 八、MUSIC示例演示 一、简介         以esp32 idf导出的hello world例程,移植lvgl disp和indev驱动的学习笔记。 二、Gi

    2024年01月16日
    浏览(41)
  • LVGL学习笔记11 - 按钮矩阵Button Matrix

    目录 1. 构造矩阵 2. Parts 2.1 LV_PART_MAIN 2.2 LV_PART_ITEMS 3. 样式 3.1 按钮大小 3.2 间距 3.3 控制按钮 3.4 控制map  3.5 Check唯一性  4. 事件 4.1 LV_EVENT_VALUE_CHANGED 4.2 LV_EVENT_LONG_PRESSED 4.3 LV_EVENT_DRAW_PART_BEGIN 按钮矩阵是多个按钮的组合,例如直接绘制一个九宫格按键。按钮矩阵的按钮是实

    2023年04月09日
    浏览(37)
  • LVGL学习笔记(二):从0到1移植LVGL8.1到STM32平台上(完结篇)

    目录 一:TFT-LCD屏触摸 二:STM32CubeMX配置 三:FT5206触摸芯片驱动代码移植 四:LVGL 移植 4.1 源码下载 4.2 代码移植  4.3 添加源码至工程 4.4 指定头文件路径 4.5 设置编译参数  4.6 修改LVGL源文件   4.7 修改显示驱动接口    4.8 修改输入设备驱动接口  五:下载验证  六:工

    2024年02月03日
    浏览(49)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包