为列表元素添加事件的原理就是利用返回值的对象值设置每行的事件，以下是我利用列表元素以及按键制作的样式，点击按键删除列表元素：
通过添加按键行为以及回调函数，实现删除文件和列表元素的功能，以下是实现代码：
void create_file_list_with_sizes(lv_obj_t *parent, const char *path)
{
DIR dir;
FILINFO fno;
FRESULT res;
// 创建一个新的局部列表对象
lv_obj_t *list = lv_list_create(parent); // 在父容器中创建列表对象
// 设置列表的宽度和高度，可以根据需要调整
lv_obj_set_size(list, 400, 340); // 宽380，高240
lv_obj_add_flag(list, LV_OBJ_FLAG_SCROLLABLE); // 启用滚动
lv_obj_align(list, LV_ALIGN_CENTER, 0, 0); // 将列表对齐到父容器的中
// 设置列表的背景颜色为黑色
static lv_style_t list_style;
lv_style_init(&list_style);
lv_style_set_bg_color(&list_style, lv_color_hex(0x000000)); // 背景为黑色
lv_style_set_bg_opa(&list_style, LV_OPA_COVER); // 完全覆盖
lv_style_set_border_width(&list_style, 0); // 设置边框宽度为0，隐藏边框
lv_obj_add_style(list, &list_style, 0); // 将样式应用到列表对象
// 使列表项的字体不随列表滚动
lv_obj_add_flag(list, LV_OBJ_FLAG_SCROLLABLE); // 启用滚动，但不影响文本
res = f_opendir(&dir, path); // 打开目录
if (res != FR_OK) {
printf('Failed to open directory\n');
return;
}
//lv_list_clean_custom(list);
while (1)
{
res = f_readdir(&dir, &fno); // 读取目录项
if (res != FR_OK || fno.fname[0] == 0) {
break; // 读取完毕
}
if (fno.fattrib & AM_DIR) {
continue; // 如果是目录，跳过
}
// 获取文件大小
DWORD file_size = fno.fsize;
// 转换文件大小为适当的单位
char size_str[32];
if (file_size < 1024) {
snprintf(size_str, sizeof(size_str), '%lu bytes', file_size);
} else if (file_size < 1024 * 1024) {
snprintf(size_str, sizeof(size_str), '%.2f KB', file_size / 1024.0);
} else if (file_size < 1024 * 1024 * 1024) {
snprintf(size_str, sizeof(size_str), '%.2f MB', file_size / (1024.0 * 1024));
} else {
snprintf(size_str, sizeof(size_str), '%.2f GB', file_size / (1024.0 * 1024 * 1024));
}
// 设置按钮的自定义样式
static lv_style_t btn_style;
lv_style_init(&btn_style);
lv_style_set_bg_color(&btn_style, lv_color_hex(0x000000)); // 背景为黑色
lv_style_set_text_color(&btn_style, lv_color_hex(0xFFFFFF)); // 文字为白色
// 设置按钮的自定义样式
static lv_style_t del_btn_style;
lv_style_init(&del_btn_style);
lv_style_set_bg_color(&del_btn_style, lv_color_hex(0xFF0000)); // 背景为红色
lv_style_set_text_color(&del_btn_style, lv_color_hex(0xFFFFFF)); // 文字为白色
// 创建一个带有文件名和大小的按钮项
char btn_label[64];
snprintf(btn_label, sizeof(btn_label), '%s - %s', fno.fname, size_str);
// 动态添加按钮项到列表
lv_obj_t *btn = lv_list_add_btn(list, LV_SYMBOL_FILE, btn_label);
lv_obj_add_style(btn, &btn_style, 0); // 添加样式
// 禁止按钮文本滚动
lv_obj_clear_flag(btn, LV_OBJ_FLAG_SCROLLABLE); // 清除滚动标志，禁止文本滚动
// 禁止按钮文本横向移动，文本居中
lv_obj_set_style_text_align(btn, LV_ALIGN_CENTER, 0); // 文本水平居中
lv_obj_set_style_text_align(btn, LV_ALIGN_TOP_MID, 0); // 文本垂直居中（可根据需求调整为垂直居上、居下等）
// 创建删除按钮并设置位置
lv_obj_t *del_btn = lv_btn_create(btn); // 在文件按钮旁创建一个删除按钮
lv_obj_set_size(del_btn, 50, 30); // 设置删除按钮大小
lv_obj_align(del_btn, LV_ALIGN_RIGHT_MID, 10, 0); // 将删除按钮对齐到文件按钮右侧
lv_obj_add_style(del_btn, &del_btn_style, 0); // 添加样式
// 删除按钮文本
lv_obj_t *del_label = lv_label_create(del_btn);
lv_label_set_text(del_label, LV_SYMBOL_CLOSE); // 使用系统符号'X'
lv_obj_set_style_text_color(del_label, lv_color_hex(0xFFFFFF), 0); // 设置字体为白色
// 为删除按钮设置事件回调
lv_obj_add_event_cb(del_btn, delete_file_cb, LV_EVENT_CLICKED, (void *)strdup(fno.fname)); // 使用 strdup 来确保文件名在回调中是有效的
}
f_closedir(&dir); // 关闭目录
}
下一期将讲解其他控件的基本使用。
本文章由威三学院出品
对课程感兴趣可以私信联系
京公网安备11022902000513号
