跳至内容
用户工具
登录
站点工具
搜索
工具
显示页面
修订记录
反向链接
最近更改
媒体管理器
网站地图
登录
>
最近更改
媒体管理器
网站地图
您的足迹:
•
icore4tx
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)** ,当前值只能在范围值之间变化。 {{ :icore4t:icore4t_rtt_lvgl_15_1.png?direct |}} <code c> 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); /* 设置位置 */ } </code> ==== 三、类型 ==== 函数 **lv_arc_set_type(arc, type)** 可以将弧形指示器设置为不同的“类型”。样式有以下几种类型: * **LV_ARC_TYPE_NORMAL** 指示器前景弧沿顺时针绘制。 * **LV_ARC_TYPE_REVERSE** 指示器前景弧沿逆时针方向绘制。 * **LV_ARC_TYPE_SYMMETRIC** 从中间点到当前值的指示弧线。 {{ :icore4t:icore4t_rtt_lvgl_15_2.png?direct |}} <code c> 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); /* 设置类型 */ } </code> ==== 四、事件 ==== 除了通用事件外,弧形指示器还发送以下特殊事件: * **LV_EVENT_VALUE_CHANGED** 当按下/拖动弧以设置新值时发送。 若只想把弧形指示器作为数值显示器的话,可以使用 **lv_obj_set_click(arc, false)** 禁用对象单击,然后使用 **lv_arc_set_value(arc, new_value)** 来设置角度值。 {{ :icore4t:icore4t_rtt_lvgl_15_3.gif?direct |}} <code c> 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"); /* 设置初始内容 */ } </code>
icore4tlvgl_15.txt
· 最后更改: 2022/04/01 11:13 由
sean
页面工具
显示页面
修订记录
反向链接
回到顶部