银杏科技有限公司旗下技术文档发布平台 | |||
技术支持电话 | 0379-69926675-801 | ||
技术支持邮件 | Gingko@vip.163.com | ||
版本 | 日期 | 作者 | 修改内容 |
---|---|---|---|
V1.0 | 2020-12-12 | yang | 初次建立 |
顾名思义,颜色选择器可以通过点击来选择颜色。可以依次选择颜色的色调、饱和度和值。
颜色选择器具有两种形式:圆环(圆盘)和矩形。在这两种形式中,长按对象,颜色选择器将更改为颜色的下一个参数(色调,饱和度或值)。双击将重置当前参数(默认为红色)。
颜色选择器的主要部分称为 LV_CPICKER_PART_BG 。它使用 scale_width 设置圆环的宽度,并使用 pad_inner 设置圆环和内部预览圆之间的填充距离。在矩形模式下,radius(半径)可以用于在矩形上应用半径。
该对象具有称为的虚拟部分 LV_CPICKER_PART_KNOB ,它是在当前值上绘制的矩形(或圆形)。它使用所有矩形(如样式属性和填充)使其大于圆环或矩形背景的宽度。
void lv_gui_run(void){ lvgl2rtt_init("lcd"); /* 初始化lvgl2rtt */ lv_obj_t * cpicker = lv_cpicker_create(lv_scr_act(), NULL);/* 创建颜色选择器 */ lv_obj_set_size(cpicker, 200, 200); /* 设置尺寸 */ lv_obj_align(cpicker, NULL, LV_ALIGN_CENTER, 0, 0); /* 设置位置 */ }
可以通过 lv_cpicker_set_type(cpicker, LV_CPICKER_TYPE_RECT/DISC) 更改颜色选择器的类型,默认类型为圆环 LV_CPICKER_TYPE_DISC 。
void lv_gui_run(void){ lvgl2rtt_init("lcd"); /* 初始化lvgl2rtt */ lv_obj_t * cpicker = lv_cpicker_create(lv_scr_act(), NULL);/* 创建颜色选择器 */ lv_cpicker_set_type(cpicker, LV_CPICKER_TYPE_RECT); /* 设置类型为矩形 */ lv_obj_set_size(cpicker, 200, 50); /* 设置尺寸 */ lv_obj_align(cpicker, NULL, LV_ALIGN_CENTER, 0, 0); /* 设置位置 */ }
使用一下方法,用户可以手动设置颜色选择器的色调、饱和度、值。
默认情况下长按控件可以更改当前颜色模式,不过,用户也可以使用函数 lv_cpicker_set_color_mode(cpicker,,LV_CPICKER_COLOR_MODE_HUE/ SATURATION/ VALUE) 选择当前的色彩模式。
若不想改变颜色模式,可以使用方法 lv_cpicker_set_color_mode_fixed(cpicker, true) 来固定颜色模式。
若使能 lv_cpicker_set_knob_colored(cpicker, true) ,则旋钮背景色将自动更新为颜色选择器所选颜色。
颜色选择器仅支持通用事件,键值如下:
通过双击可以重置当前参数。
lv_obj_t * labelr; /* 定义标签 */ lv_obj_t * labelg; lv_obj_t * labelb; lv_obj_t * labeltxt; lv_obj_t * cpicker; /* 定义颜色选择器 */ unsigned char r,g,b,temp; /* 定义变量 */ static void event_handler(lv_obj_t * obj, lv_event_t event) { /* 回调函数 */ if(event == LV_EVENT_VALUE_CHANGED) { /* 按键状态切换的话 */ lv_color_t color = lv_cpicker_get_color(cpicker);/* 获取当前选择的颜色 */ temp = color.ch.red & 0x07; /* RGB565转RGB888 */ r = color.ch.red << 3 | temp; temp = color.ch.green & 0x03; g = color.ch.green << 2 | temp; temp = color.ch.blue & 0x07; b = color.ch.blue << 3 | temp; lv_label_set_text_fmt(labelr, "red: %d",r); /* 更新标签内容 */ lv_label_set_text_fmt(labelg, "green: %d",g); lv_label_set_text_fmt(labelb, "blue: %d",b); /* 更新labeltxt标签字体颜色 */ if(r == 0)lv_label_set_text_fmt(labeltxt, "#0%x%x%x color#",r,g,b); else if(g == 0)lv_label_set_text_fmt(labeltxt, "#%x0%x%x color#",r,g,b); else lv_label_set_text_fmt(labeltxt, "#%x%x%x0 color#",r,g,b); } } void lv_gui_run(void){ lvgl2rtt_init("lcd"); /* 初始化lvgl2rtt */ cpicker = lv_cpicker_create(lv_scr_act(), NULL); /* 创建颜色选择器 */ lv_obj_set_size(cpicker, 100, 100); /* 设置尺寸 */ lv_obj_align(cpicker, NULL, LV_ALIGN_CENTER, 0, 0); /* 设置位置 */ lv_cpicker_set_type(cpicker, LV_CPICKER_TYPE_DISC); /* 设为圆形 */ lv_obj_set_event_cb(cpicker, event_handler); /* 绑定回调函数 */ labelr = lv_label_create(lv_scr_act(), NULL); /* 创建标签 */ lv_label_set_text(labelr, "red: 255"); /* 设置标签默认内容 */ lv_obj_align(labelr, NULL, LV_ALIGN_IN_RIGHT_MID, -70, -30); /* 设置位置 */ labelg = lv_label_create(lv_scr_act(), NULL); /* 创建标签 */ lv_label_set_text(labelg, "green: 0"); /* 设置标签默认内容 */ lv_obj_align(labelg, NULL, LV_ALIGN_IN_RIGHT_MID, -70, 0); /* 设置位置 */ labelb = lv_label_create(lv_scr_act(), NULL); /* 创建标签 */ lv_label_set_text(labelb, "blue: 0"); /* 设置标签默认内容 */ lv_obj_align(labelb, NULL, LV_ALIGN_IN_RIGHT_MID, -70, 30); /* 设置位置 */ labeltxt = lv_label_create(lv_scr_act(), NULL); /* 创建标签 */ lv_label_set_recolor(labeltxt, true); /* 重着色使能 */ lv_label_set_text(labeltxt, "#ff0000 color#"); /* 设置标签默认内容 */ lv_obj_align(labeltxt, cpicker, LV_ALIGN_OUT_BOTTOM_MID, 0, 20); /* 设置位置 */ }