4、LVGL控件-环形加载器、LED、列表、下拉列表

本篇文章目录导航

♠♠ LVGL控件-环形加载器、LED、列表、下拉列表 ♣♣♣♣ 一、LVGL 环形加载器部件 ♦♦♦♦♦♦♦♦ 1.1 环形加载器部件组成部分 ♦♦♦♦♦♦♦♦ 1.2 环形加载器部件基本API ♦♦♦♦♦♦♦♦ 1.3 实验小演示（提示当前任务正在加载） ♣♣♣♣ 二、LVGL LED部件 ♦♦♦♦♦♦♦♦ 2.1 LED部件组成部分 ♦♦♦♦♦♦♦♦ 2.2 LED部件基本API ♦♦♦♦♦♦♦♦ 2.3 实验小演示(心跳灯) ♣♣♣♣ 三、LVGL 列表部件 ♦♦♦♦♦♦♦♦ 3.1 列表部件组成部分 ♦♦♦♦♦♦♦♦ 3.2 列表部件基本API ♦♦♦♦♦♦♦♦ 3.3 实验小演示 ♣♣♣♣ 四、LVGL 下拉列表部件 ♦♦♦♦♦♦♦♦ 4.1 下拉列表部件组成部分 ♦♦♦♦♦♦♦♦ 4.2 下拉列表部件基本API ♦♦♦♦♦♦♦♦ 4.3 实验小演示 

 #LVGL控件-环形加载器、LED、列表、下拉列表 ##一、LVGL 环形加载器部件 >加载器部件常用于提示当前任务正在加载。

效果图：

 ###1.1 环形加载器部件组成部分 主体（LV_PART_MAIN） 手柄（LV_PART_KNOB） 指示器（LV_PART_INDICATOR） 

 ###1.2 环形加载器部件基本API 创建加载器部件：

/* spin_time为指示器旋转一周所需要的时间（ms），arc_length为指示器长度 */
lv_obj_t * spinner = lv_spinner_create(parent, spin_time, arc_length);
 
/* V9版本 */
lv_obj_t * spinner = lv_spinner_create(parent);

设置圆弧颜色：

lv_obj_set_style_arc_color(spinner, lv_color_hex(0x4a9f00), LV_PART_MAIN);        /* 设置主体圆弧颜色 */
lv_obj_set_style_arc_color(spinner, lv_color_hex(0x83bd55), LV_PART_INDICATOR);   /* 设置指示器圆弧颜色 */

设置圆弧宽度：

lv_obj_set_style_arc_width(spinner, 30, LV_PART_MAIN);        /* 设置主体圆弧宽度 */
lv_obj_set_style_arc_width(spinner, 30, LV_PART_INDICATOR);   /* 设置指示器圆弧宽度 */

 ###1.3 实验小演示（提示当前任务正在加载）

void my_gui(void)
{
    lv_obj_t *spinner = lv_spinner_create(lv_scr_act());   /* 环形加载器 */
    lv_obj_center(spinner);                                /* 居中环形加载器部件 */

    lv_obj_set_style_arc_color(spinner, lv_color_hex(0xffff00), LV_PART_MAIN);        /* 设置主体圆弧颜色，黄色  */
    lv_obj_set_style_arc_color(spinner, lv_color_hex(0x00ff00), LV_PART_INDICATOR);   /* 设置指示器圆弧颜色，绿色 */

    lv_obj_set_style_arc_width(spinner, 30, LV_PART_MAIN);        /* 设置主体圆弧宽度 */
    lv_obj_set_style_arc_width(spinner, 30, LV_PART_INDICATOR);   /* 设置指示器圆弧宽度 */
}

演示视频：提示当前任务正在加载 

 ##二、LVGL LED部件 >LED部件常用于指示控制对象的状态。

效果图：

 ###2.1 LED部件组成部分 主体（LV_PART_MAIN） 

 ###2.2 LED部件基本API 创建LED部件：

lv_obj_t *led = lv_led_create(parent);    /* 默认是打开状态 */

设置LED颜色、亮度：

lv_led_set_color(led, lv_color_hex(0xff0000));    /* 设置LED颜色 */
lv_led_set_brightness(led, 0);                    /* 设置LED亮度，范围0~255 */

设置LED状态：

lv_led_on(led);        /* 打开LED(设置亮度为255) */
lv_led_off(led);       /* 关闭LED(设置亮度为0) */
lv_led_toggle(led);    /* 翻转LED状态 */
Tips：打开、关闭LED时，亮度不绝对是255、0，具体要看相关的宏定义（可修改）。

点击4、LVGL控件-环形加载器、LED、列表、下拉列表——古月居可查看全文