目录
下拉列表由lv_dropdown_create创建。
dropdown = lv_dropdown_create(lv_scr_act());
lv_obj_align(dropdown, LV_ALIGN_CENTER, 0, 0);
1. Parts
下拉列表分为2个状态:按钮状态和列表状态。上图中就是列表时的状态,下图是按钮时的状态。
1.1 按钮状态
按钮状态下有2个Parts:
LV_PART_MAIN - 按钮的背景。 对其上面的文本使用典型的背景属性和文本属性。
LV_PART_INDICATOR - 对应上图中的箭头符号,可以是图像或文本。
1.2 列表状态
列表状态下有3个Parts:
LV_PART_MAIN - 列表本身。
LV_PART_SCROLLBAR - 列表滚动条的背景、边框、阴影属性和宽度以及右侧间距的右侧填充。
LV_PART_SELECTED - 当前按下、选中或按下+选中的选项。
下拉列表默认是按钮状态,所以不能用之前简单的方式修改列表状态下的样式。
可以通过下面的方法实现:
a. 添加LV_EVENT_PRESSED事件回调函数
lv_obj_add_event_cb(dropdown, dropdown_event_pressed_cb, LV_EVENT_PRESSED, NULL);
b. 在事件处理回调函数中获取到列表的指针
lv_obj_t* list = lv_dropdown_get_list(dropdown);
c. 判断list是否为NULL表明是否在列表状态
if (list != NULL)
{
lv_obj_set_style_text_color(list, lv_color_hex(0xFF0000), LV_PART_MAIN);
}
注意,这里的对象是list,不是dropdown。
2. 设置
2.1 设置选项
下拉列表默认的选项是Option1、Option2、Option3,可以通过函数lv_dropdown_set_options设置选项。
void lv_dropdown_set_options(lv_obj_t * obj, const char * options)
参数options设置的选项之间需要使用 \n
分隔开来,这部分参数会保存在下拉列表对象的空间中。
lv_dropdown_set_options(dropdown, "First\nSecond\nThird");
可以通过函数lv_dropdown_add_option添加选项。
void lv_dropdown_add_option(lv_obj_t * obj, const char * option, uint32_t pos)
pos表示索引值,注意option最好不要有\n,否则会插入多个option,但是总数只是会加1。
lv_dropdown_add_option(dropdown, "Insert1", 1);
为了节省RAM,可以使用函数lv_dropdown_set_static_options通过静态字符串设置选项,注意才采用这种方式,不能使用lv_dropdown_add_option添加选项。
可以使用 lv_dropdown_set_selected
手动选择一个选项
void lv_dropdown_set_selected(lv_obj_t * obj, uint16_t sel_opt)
其中 sel_opt
是要选择的选项的索引。
通过lv_dropdown_get_selected获取选中选项的索引值,通过lv_dropdown_get_selected_str获取选中选项的字符串值。
可以通过lv_dropdown_clear_options清楚所有选项。
void lv_dropdown_clear_options(lv_obj_t * obj)
函数lv_dropdown_get_options获取选项的字符串,和lv_dropdown_set_options的设置对应。
函数lv_dropdown_get_option_cnt则可以获取选项的数量。
函数lv_dropdown_get_option_index获取对应选项对应的索引值。
2.2 设置方向
下拉列表的默认方向是向下展开列表,可以通过函数lv_dropdown_set_dir更改方向。
void lv_dropdown_set_dir(lv_obj_t * obj, lv_dir_t dir)
参数dir的设置值有
LV_DIR_LEFT:
LV_DIR_RIGHT:
LV_DIR_TOP:
LV_DIR_BOTTOM:
可以通过函数lv_dropdown_get_dir获取当前设置的方向。
2.3 设置符号
默认的符号是LV_SYMBOL_DOWN,可以通过lv_dropdown_set_symbol改变符号。
void lv_dropdown_set_symbol(lv_obj_t * obj, const void * symbol)
例如:
lv_dropdown_set_dir(dropdown, LV_DIR_LEFT);
lv_dropdown_set_symbol(dropdown, LV_SYMBOL_LEFT);
可以通过函数lv_dropdown_get_symbol获取设置的符号。
2.4 设置字符串
通过lv_dropdown_set_text设置按钮状态时显示的内容。
void lv_dropdown_set_text(lv_obj_t * obj, const char * txt)
注意,这个字符串内容不需要是列表状态中的字符串( 如果文本为“NULL”,则当前选项显示在按钮上)。
lv_dropdown_set_text(dropdown, "test");
2.5 手动打开或关闭列表
使用 lv_dropdown_open或lv_dropdown_close
手动打开或关闭列表。
2.6 设置高亮效果
列表状态时选中时是默认打开高亮的,可以 通过函数lv_dropdown_set_selected_highlight关闭高亮。
void lv_dropdown_set_selected_highlight(lv_obj_t * obj, bool en)
下图是关闭高亮的效果:
可以通过函数lv_dropdown_get_selected_highlight获取是否高亮。
3. 样式
3.1 设置列表高度
通过函数lv_obj_set_style_max_height设置,例如:
lv_obj_set_style_max_height(list, 50, LV_PART_MAIN);
3.2 改变按钮状态时圆角弧度
lv_obj_set_style_radius(dropdown, LV_PCT(20), LV_PART_MAIN);
3.3 修改字符串颜色
lv_obj_set_style_text_color(dropdown, lv_color_hex(0xFF0000), LV_PART_MAIN);
注意这里改变的颜色包括符号,应该是bug。下面的代码是只改符号的颜色:
lv_obj_set_style_text_color(dropdown, lv_color_hex(0xFF0000), LV_PART_INDICATOR);
3.4 修改字符串对齐方式
注意按钮状态下修改无效,只能改列表状态下的字符串。
lv_obj_set_style_text_align(list, LV_TEXT_ALIGN_CENTER, LV_PART_MAIN);
3.5 修改列表中的滚动条颜色
lv_obj_set_style_bg_color(list, lv_color_hex(0xFF0000), LV_PART_SCROLLBAR);
3.6 修改列表的选中颜色
lv_obj_set_style_bg_color(list, lv_color_hex(0xFF0000), LV_PART_SELECTED);
可以看到只是选中的时候颜色变成了红色。蓝色部分没研究到哪里可以改动,可能只能通过主题的 方式修改。