用户工具

站点工具


icore4tlvgl_15
银杏科技有限公司旗下技术文档发布平台
技术支持电话0379-69926675-801
技术支持邮件Gingko@vip.163.com
版本 日期 作者 修改内容
V1.0 2020-12-5 yang 初次建立

实验十五:lv_arc弧形指示器

一、弧形指示器

弧形指示器由背景弧和前景弧组成。两者都具有起始角度和终止角度以及厚度。

弧的主要部分称为 LV_ARC_PART_MAIN 。它使用典型的背景样式属性绘制背景,并使用线型样式绘制圆弧。圆弧的大小和位置将遵守填充样式的属性。

LV_ARC_PART_INDIC 是虚拟小部件,它使用线型样式绘制了另一个弧,是与背景弧线区域重叠的。指示器圆弧的半径将根据最大填充值进行修改。

LV_ARC_PART_KNOB 是虚拟小部件,它是绘制在弧形指示器末端的旋钮。设置其为零填充时,旋钮的大小与指示器的宽度相同。较大的填充使其尺寸变大,较小的填充使其尺寸变小。

二、角度范围与值

要设置弧形指示器的背景圆弧角度,使用 lv_arc_set_bg_angles(arc, start_angle, end_angle)lv_arc_set_bg_start/end_angle(arc, start_angle) 功能。零度位于弧形指示器的右中间(3点钟)位置,并且度数沿顺时针方向增加。角度应在 [0,360] 范围内。

同样,设置指示器前景圆弧的角度可以使用 lv_arc_set_angles(arc, start_angle, end_angle) 或者 lv_arc_set_start/end_angle(arc, start_angle) 。 使用函数 lv_arc_set_rotation(arc, deg) 可以将弧形指示器整体顺时针偏转 deg 度。

除了手动设置角度外,弧还可以设置范围值和当前值。要设置范围请使用 lv_arc_set_range(arc, min, max) ,设置当前值请使用 lv_arc_set_value(arc, value) ,当前值只能在范围值之间变化。

void lv_gui_run(void){
	lvgl2rtt_init("lcd");                                   /* 初始化lvgl2rtt */
 
	lv_obj_t * arc1 = lv_arc_create(lv_scr_act(), NULL);    /* 创建arc1 */
	lv_obj_set_size(arc1, 150, 150);                        /* 设置尺寸 */
	lv_arc_set_bg_angles(arc1, 0, 360);                     /* 设置背景弧角度范围 */
	lv_arc_set_angles(arc1, 90, 200);                       /* 设置前景弧角度 */
	lv_obj_align(arc1, NULL, LV_ALIGN_CENTER, -100, 0);     /* 设置位置 */
 
	lv_obj_t * arc2 = lv_arc_create(lv_scr_act(), NULL);    /* 创建arc2 */
	lv_obj_set_size(arc2, 150, 150);                        /* 设置尺寸 */
	lv_arc_set_bg_angles(arc2, 135, 45);                    /* 设置背景弧角度范围 */
	lv_arc_set_angles(arc2, 135, 180);                      /* 设置前景弧角度 */
	lv_obj_align(arc2, NULL, LV_ALIGN_CENTER, 100, 0);      /* 设置位置 */
}

三、类型

函数 lv_arc_set_type(arc, type) 可以将弧形指示器设置为不同的“类型”。样式有以下几种类型:

  • LV_ARC_TYPE_NORMAL 指示器前景弧沿顺时针绘制。
  • LV_ARC_TYPE_REVERSE 指示器前景弧沿逆时针方向绘制。
  • LV_ARC_TYPE_SYMMETRIC 从中间点到当前值的指示弧线。

void lv_gui_run(void){
	lvgl2rtt_init("lcd");                                       /* 初始化lvgl2rtt */
 
	lv_obj_t * arc1 = lv_arc_create(lv_scr_act(), NULL);        /* 创建arc */
	lv_obj_set_size(arc1, 150, 150);                            /* 设置尺寸 */
	lv_arc_set_bg_angles(arc1, 0, 360);                         /* 设置背景弧范围 */
	lv_obj_align(arc1, NULL, LV_ALIGN_CENTER, -100, 0);         /* 设置位置 */
	lv_arc_set_type(arc1, LV_ARC_TYPE_NORMAL);                  /* 设置类型 */
 
	lv_obj_t * arc2 = lv_arc_create(lv_scr_act(), NULL);        /* 创建arc */
	lv_obj_set_size(arc2, 150, 150);                            /* 设置尺寸 */
	lv_arc_set_bg_angles(arc2, 0, 360);                         /* 设置背景弧范围 */
	lv_obj_align(arc2, NULL, LV_ALIGN_CENTER, 100, 0);          /* 设置位置 */
	lv_arc_set_type(arc2, LV_ARC_TYPE_REVERSE);                 /* 设置类型 */
}

四、事件

除了通用事件外,弧形指示器还发送以下特殊事件:

  • LV_EVENT_VALUE_CHANGED 当按下/拖动弧以设置新值时发送。

若只想把弧形指示器作为数值显示器的话,可以使用 lv_obj_set_click(arc, false) 禁用对象单击,然后使用 lv_arc_set_value(arc, new_value) 来设置角度值。

lv_obj_t * arc;                                                    /* 先定义弧形指示器 */
lv_obj_t * label;                                                  /* 先定义标签label */
static void event_handler(lv_obj_t * obj, lv_event_t event)        /* 回调函数 */
{
	if(event == LV_EVENT_VALUE_CHANGED) {                      /* 指示器值改变的话 */
		lv_label_set_text_fmt(label, "%d",lv_arc_get_value(arc));
	}                                                          /* 更新标签文本 */
}
void lv_gui_run(void){
	lvgl2rtt_init("lcd");                                      /* 初始化lvgl2rtt */
 
        arc = lv_arc_create(lv_scr_act(), NULL);                           /* 创建arc */
	lv_obj_set_size(arc, 150, 150);                            /* 设置尺寸 */
	lv_obj_align(arc, NULL, LV_ALIGN_CENTER, 0, 0);            /* 设置位置 */
	lv_obj_set_event_cb(arc, event_handler);                   /* 设置回调函数 */
 
	label = lv_label_create(arc, NULL);                        /* 为指示器创建标签 */
	lv_obj_align(label, arc, LV_ALIGN_CENTER, 0, 0);           /* 设置位置 */
	lv_label_set_text(label, "0");                             /* 设置初始内容 */
}
icore4tlvgl_15.txt · 最后更改: 2022/04/01 11:13 由 sean