list 列表控件

list 控件简单分解就是一个背景页面加上顺序排列的按钮组成,按钮里面 可以包含一个图标和文本,当然,按钮的布局并不是固定的,库也允许用户重 新定义按钮的布局。按钮在添加后如果总大小超过 list 控件大小,可以上下滚 动。list 控件的应用非常广泛 ,最常见的就是微信界面,可以把页面当成是一 个背景,每一个联系人就是一个按钮控件内包含了头像以及用户名。 基于 list 控件模拟微信界面:
在这里插入图片描述

list 控件基础知识

添加按钮

在创建控件后,是一个空的 list,我们需要往 list 添加 btn 才是一个完整 的 list,函数 lv_list_add_btn(list, img_src, txt) 该函数会返回所添加的 btn 的指针,方便我们对 btn 控件进行其他操作。 在添加按钮的时候,我们可以指定按钮所使用的图像和文本,也可以使用 内置的符号字体作为图像,例如:

lv_list_add_btn(list, LV_SYMBOL_FILE, "file"); /* 添加按钮到 list,符号字体作为图标 */ 
lv_list_add_btn(list, &close_img, "close"); /* 添加按钮到 list,图像源作为图标 */

如果我们不想添加文本,直接输入 NULL 即可。 按钮的宽度会根据 list 的宽度设置为最大,按钮的高度会根据图标和文本, 以及按钮样式的填充部分进行自动调整。 添加 btn 会指定图标和文本,本质上是一个 img 控件和 label 控件,我们 可以获取这个 img 控件和 label 控件。函数 lv_list_get_btn_label(list_btn) 可以获取按钮的 label 控件指针,函数 lv_list_get_btn_img(list_btn) 可以 获取按钮的 img 控件指针。也可以单独获取按钮的文本,函数 lv_list_get_bt n_text(list_btn) 获取按钮的 label 和 img 的作用很大,在很多时候,我们往往需要修改 la bel 的一些参数,比如中文字体的显示,我们就需要获取 label 控件的指针,然 后修改其样式和尺寸。

删除按钮

可以使用函数 lv_list_remove(list, index) 根据索引来删除按钮,删除 成功返回 true,index 的值必须大于等于 0,且必须小于按钮的数量,按钮的数 量可以通过函数 lv_list_get_size(list) 获取。也可以清除 list 控件上的所 有按钮,函数 lv_list_clean(list)

获取按钮

在创建按钮的时候会返回按钮控件的指针,那么在创建多个按钮以后,我们一样可以获取每个按钮的指针。 函数 lv_list_get_prev_btn(list, prev_btn) 和函数 lv_list_get_nex t_btn(list, prev_btn) 可以依次获取按钮控件的指针,如果将第二个参数设 置为 NULL,则将从顶部或者底部开始获取按钮。

手动导航

可以使用函数 lv_list_up(list) 和 lv_list_down(list) 手动移动按 钮,也可以直接将焦点放在按钮上,函数 lv_list_focus(btn, LV_ANIM_ON/O FF) 可以选择是否打开动画。上下移动焦点时的动画时间也可以进行修改,函 数 lv_list_set_anim_time(list, anim_time) 动画时间设置为 0 表示没有动 画。

边缘闪烁

当 list 滑动到最顶部或者最底部的时候,可以显示一个类似圆圈的动态效 果,跟智能手机的效果类似,通过函数 lv_list_set_edge_flash(list, en) 启用或者关闭该功能。
在这里插入图片描述

滚动传播

list 控件内的按钮是可以滑动的,如果 list 是创建在 page 上面,当我们 滑动 list 到顶部或者底部的时候,就可以将滑动传播到父窗口,这样就可以带 动父窗口进行滚动。我们需要使用函数 lv_list_set_scroll_propagation(lis t, true) 来使能该功能。

单选模式

如果按钮使能了 toggle,可以使用函数 lv_list_set_single_mode(lis t, true) 来确保只有一个按钮处于 toggle 状态。
在这里插入图片描述

选中按钮

可以使用函数 lv_list_set_btn_selected(list, btn) 选中某个按钮, 选中后的按钮处于 LV_BTN_STATE_PR/TG_PR 状态。

滚动条

当添加的按钮超过 list 的尺寸后,就会启用滚动条,可以利用函数 lv_li st_set_sb_mode(list,mode) 来设置滚动条的模式

样式

list 控件的样式使用以下函数进行修改: lv_list_set_style(list, LV_LIST_STYLE_…, &style) 可用的样式类型:
在这里插入图片描述
在这里插入图片描述

  • 1
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 2
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

不脱发的码农~~~~

感谢各位老板的支持!

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值