使用ZYNQ芯片和LVGL框架实现用户高刷新UI设计系列教程(第十三讲)
这一期我们讲解lvgl中滑动条控件的基础使用,滑动条像是进度条(bar)与按键旋钮的结合体,拖动旋钮可以设置滑块的值,其中滑块与进度条一样可以设置垂直与水平的方向。
滑块的部件由三个模块组成,分别是背景(main)、指示器(indicator)、旋钮(knob),具体如下图所示:
【1】LV_PART_MAIN :使用典型的背景样式属性,设padding属性会使指示器在相应方向上变小。
【2】LV_PART_INDICATOR :使用典型的背景样式属性。
【3】LV_PART_KNOB :使用典型的背景属性。默认情况下,旋钮是圆形的(半径样式可对此进行修改),其边长等于滑块较小的那个尺寸。可以通过 padding值使旋钮变大。内边距的值也可以是非对称的。
(1) 设置滑块的当前值与范围
一旦创建了一个滑块(Slider),它具有以下属性:
• 值(value)等于 0;
• 默认范围是 [0…100];
• 水平方向,且
• 默认宽度大约为 2 英寸(依据 LV_DPI_DEF(C 语言宏)配置的值而定),
• 默认高度大约为 1/10 英寸(依据 LV_DPI_DEF(C 语言宏)配置的值而定)。
若要设置不同的值,可使用以下方法:
• lv_slider_set_value(slider, new_value, LV_ANIM_ON/OFF)(动画时间由样式的 ``anim_time
属性设置);
• lv_slider_set_range(slider, min, max);以及
对于方向、宽度和高度,只需设置宽度和高度样式属性即可; - lv_bar_set_orientation(slider, orientation)可覆盖由 ``width
和 height 所决定的方向。
orientation 的有效值如下:
• LV_BAR_ORIENTATION_AUTO,
• LV_BAR_ORIENTATION_HORIZONTAL,
• LV_BAR_ORIENTATION_VERTICAL.
默认的绘制方向在水平方向上是从左到右,在垂直方向上是从下到上。如果最小值被设置得大于最大值(例如 [100…0]),那么绘制方向将会反转。
(2) 滑块模式
滑动条可以是以下模式之一:
[1] LV_SLIDER_MODE_NORMAL :像上面说的普通情况
[2] LV_SLIDER_SYMMETRICAL :这个模式下可以指定负的最小范围。但是只能从零值到当前值绘制指示器。
[3] LV_SLIDER_RANGE: 在这个模式下也可以指定负的最小范围。这样滑动条的起始值可以不是0,使用 lv_bar_set_start_value(bar, new_value, LV_ANIM_ON / OFF) 设置起始值。要注意设置的起始值必须小于结束值。
可以使用 lv_slider_set_mode(slider, LV_SLIDER_MODE_…) 更改模式。
还有一种拓展模式,在某些情况下,需要将滑动条设置为仅对拖动旋钮做出反应,可以通过添加 LV_OBJ_FLAG_ADV_HITTEST lv_obj_add_flag(slider, LV_OBJ_FLAG_ADV_HITTEST) 来启用此功能。
扩展的单击区域(由 lv_obj_set_ext_click_area(slider, value) 设置)增加到旋钮的单击区域。
下一期将讲解滑动条的事件以及具体的使用代码。
本文章由威三学社出品
对课程感兴趣可以私信联系