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

目录

[1. 添加文本](#1. 添加文本)

[2. 添加按钮](#2. 添加按钮)

[3. 事件](#3. 事件)

[4. 修改样式](#4. 修改样式)

[4.1 背景色](#4.1 背景色)

[4.2 改变项的颜色](#4.2 改变项的颜色)


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

cpp 复制代码
    lv_obj_t* list1 = lv_list_create(lv_scr_act());
    lv_obj_set_size(list1, 180, 220);
    lv_obj_center(list1);

部件包含:

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

LV_PART_SCROLLBAR - 滚动条的属性。

1. 添加文本

cpp 复制代码
lv_obj_t * lv_list_add_text(lv_obj_t * list, const char * txt)

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

cpp 复制代码
lv_list_add_text(list1, "item1");
lv_list_add_text(list1, "item2");
lv_list_add_text(list1, "item3");
lv_list_add_text(list1, "item4");

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

2. 添加按钮

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

cpp 复制代码
lv_obj_t * lv_list_add_btn(lv_obj_t * list, const void * icon, const char * txt)

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

cpp 复制代码
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");

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

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

cpp 复制代码
lv_list_add_btn(list1, NULL, "New");
lv_list_add_btn(list1, LV_SYMBOL_FILE, NULL);
lv_list_add_btn(list1, NULL, NULL);

3. 事件

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

cpp 复制代码
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 背景色

cpp 复制代码
lv_obj_set_style_bg_color(list1, lv_color_hex(0xff0000), LV_PART_MAIN);

4.2 改变项的颜色

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

cpp 复制代码
item = lv_obj_get_child(list1, 0);
lv_obj_set_style_bg_color(item, lv_color_hex(0xff0000), LV_PART_MAIN);

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

cpp 复制代码
item = lv_obj_get_child(list1, 5);
lv_obj_set_style_bg_color(item, lv_color_hex(0xff0000), LV_PART_MAIN);
相关推荐
不太可爱的叶某人5 小时前
【学习笔记】MySQL技术内幕InnoDB存储引擎——第5章 索引与算法
笔记·学习·mysql
岁岁岁平安5 小时前
Redis基础学习(五大值数据类型的常用操作命令)
数据库·redis·学习·redis list·redis hash·redis set·redis string
知识分享小能手7 小时前
Vue3 学习教程,从入门到精通,使用 VSCode 开发 Vue3 的详细指南(3)
前端·javascript·vue.js·学习·前端框架·vue·vue3
pay4fun7 小时前
2048-控制台版本
c++·学习
知识分享小能手9 小时前
Bootstrap 5学习教程,从入门到精通,Bootstrap 5 表单验证语法知识点及案例代码(34)
前端·javascript·学习·typescript·bootstrap·html·css3
巴伦是只猫9 小时前
【机器学习笔记 Ⅲ】4 特征选择
人工智能·笔记·机器学习
不爱说话的采儿9 小时前
UE5详细保姆教程(第四章)
笔记·ue5·游戏引擎·课程设计
weixin_4188138710 小时前
Python-可视化学习笔记
笔记·python·学习
Haoea!10 小时前
Flink-05学习 接上节,将FlinkJedisPoolConfig 从Kafka写入Redis
学习·flink·kafka
Vic1010110 小时前
Java 开发笔记:多线程查询逻辑的抽象与优化
java·服务器·笔记