12. 滚轮部件
一、滚轮部件
滚轮部件常用于多选一的场景,它以 滚轮 的形式来展开多个选项。滚轮部件由两个部分组成:① 主体背景(LV_PART_MAIN
)和 ② 所选文本(LV_PART_SELECTED
),示意图如下:
LVGL 官方提供了一些与滚轮部件相关 API。
lv_obj_t * lv_roller_create(lv_obj_t * parent); // 创建滚轮部件
void lv_roller_set_options(lv_obj_t * obj, const char * options, lv_roller_mode_t mode); // 设置滚轮部件选项
const char * lv_roller_get_options(const lv_obj_t * obj); // 获取滚轮的选项
void lv_roller_set_selected(lv_obj_t * obj, uint32_t sel_opt, lv_anim_enable_t anim); // 设置所选选项
uint32_t lv_roller_get_selected(const lv_obj_t * obj); // 获取所选选项索引
void lv_roller_get_selected_str(const lv_obj_t * obj, char * buf, uint32_t buf_size); // 获取所选选项文本
void lv_roller_set_visible_row_count(lv_obj_t * obj, uint32_t row_cnt); // 设置可见选项数量
#define lv_roller_get_option_cnt lv_roller_get_option_count
uint32_t lv_roller_get_option_count(const lv_obj_t * obj); // 获取选项的总数
我们可以通过 lv_roller_create()
函数 创建滚轮部件。
/**
* @brief 创建滚轮部件
*
* @param parent 指向父部件的指针
* @return lv_obj_t* 指向滚轮部件的指针
*/
lv_obj_t * lv_roller_create(lv_obj_t * parent);
默认情况下,滚轮部件创建出来后,其并不具备任何选项,用户需要 添加选项,可调用 lv_roller_set_options()
函数。
/**
* @brief 设置滚轮部件选项
*
* @param obj 指向滚轮的指针
* @param options 添加的选项
* @param mode 滚轮滚动的模式
*/
void lv_roller_set_options(lv_obj_t * obj, const char * options, lv_roller_mode_t mode);
滚轮部件具有两种滚动模式,如下所示:
enum _lv_roller_mode_t {
LV_ROLLER_MODE_NORMAL, // 正常模式
LV_ROLLER_MODE_INFINITE, // 循环滚动模式
};
如果滚轮部件为 LV_ROLLER_MODE_INFINITE
模式,此时,用户滚动选项,当选项滚动到最后一个,若继续滚动,其将回到第一个选项(循环滚动);如果滚轮部件为 LV_ROLLER_MODE_NORMAL
模式,则滚轮部件的最后一个和第一个选项不能循环切换,这两种模式的示意图如下:
我们可以使用 lv_roller_set_visible_row_count()
函数 设置可见选项数量。
/**
* @brief 设置可见选项数量
*
* @param obj 指向滚轮部件的指针
* @param row_cnt 可见选项数量
*/
void lv_roller_set_visible_row_count(lv_obj_t * obj, uint32_t row_cnt);
默认情况下,滚轮部件的所选项为第一个添加的选项,如果用户想 改变所选项,可调用 lv_roller_set_selected()
函数进行设置。
/**
* @brief 设置所选选项
*
* @param obj 指向滚轮部件的指针
* @param sel_opt 所选项的索引
* @param anim LV_ANIM_ON: 开启动画; LV_ANOM_OFF: 无动画
*/
void lv_roller_set_selected(lv_obj_t * obj, uint32_t sel_opt, lv_anim_enable_t anim);
如果,我们要 获取所选选项的索引,可以通过 lv_roller_get_selected()
函数获取。
/**
* @brief 获取所选选项索引
*
* @param obj 指向滚轮部件的指针
* @return uint32_t 选中项的索引
*/
uint32_t lv_roller_get_selected(const lv_obj_t * obj);
如果,我们要获取选中项的文本,可以通过 lv_roller_get_selected_str()
函数获取。
/**
* @brief 获取所选选项文本
*
* @param obj 指向滚轮部件的指针
* @param buf 存放选项文本的缓冲区
* @param buf_size 缓冲区的大小
*/
void lv_roller_get_selected_str(const lv_obj_t * obj, char * buf, uint32_t buf_size);
二、实验例程
#include "lvgl.h"
#include "lv_port_disp_template.h"
#include "lv_port_indev_template.h"
lv_obj_t *label;
int main(void)
{
HAL_Init();
System_Clock_Init(8, 336, 2, 7);
Delay_Init(168);
SPI_Simulate_Init();
// SRAM_Init();
TIM_Base_Init(&g_tim6_handle, TIM6, 83, 999);
__HAL_TIM_CLEAR_IT(&g_tim6_handle, TIM_IT_UPDATE); // 清除更新中断标志位
HAL_TIM_Base_Start_IT(&g_tim6_handle); // 使能更新中断,并启动计数器
lv_init();
lv_port_disp_init();
lv_port_indev_init();
// 测试代码
label = lv_label_create(lv_scr_act()); // 创建标签部件
lv_obj_set_align(label, LV_ALIGN_TOP_MID); // 设置标签部件靠上居中对齐
lv_obj_set_style_text_font(label, &lv_font_montserrat_30, LV_PART_MAIN); // 设置标签部件的字体样式
lv_label_set_text(label, "roller test"); // 设置标签部件的文本
lv_obj_t *roller = lv_roller_create(lv_scr_act()); // 创建滚轮部件
lv_obj_center(roller); // 滚轮部件居中显示
lv_obj_set_style_text_line_space(roller, 30, LV_STATE_DEFAULT); // 设置滚轮部件行间距
lv_roller_set_options(roller, "Sakura\nMikoto\nShana\nRimuru", LV_ROLLER_MODE_NORMAL); // 设置滚轮部件的选项
lv_roller_set_visible_row_count(roller, 3); // 设置滚轮部件可见行数
lv_roller_set_selected(roller, 2, LV_ANIM_ON); // 设置滚轮部件当前选中项
lv_obj_add_event_cb(roller, roller_event_cb, LV_EVENT_VALUE_CHANGED, NULL); // 添加滚轮部件的事件回调函数
while (1)
{
lv_timer_handler();
Delay_ms(5);
}
return 0;
}
void roller_event_cb(lv_event_t *e)
{
lv_event_code_t code = lv_event_get_code(e); // 获取事件的触发类型
lv_obj_t *target = lv_event_get_target(e); // 获取事件的触发源
uint32_t index = 0;
char str[32] = {0};
if(code == LV_EVENT_VALUE_CHANGED)
{
index = lv_roller_get_selected(target);
lv_roller_get_selected_str(target, str, sizeof(str));
lv_label_set_text_fmt(label, "selected %s, index %ld", str, index);
}
}