用户工具

站点工具


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

实验七:lv_btn按钮

按钮是简单的矩形对象。它们源自容器Container (lv_cont),因此也可以提供布局layout和配合fit。此外,可以使能它在单击时自动检测状态。

通常使用lv_btn_create(lv_scr_act(), NULL)可以在当前屏幕上创建一个按钮,使用lv_label_create(btn, NULL)为按钮创建一个标签子对象,显示文本信息。函数lv_obj_set_event_cb(btn, event_handler) 为按钮绑定回调函数。

一、状态

为了简化按钮的使用,可以使用lv_btn_get_state(btn) 来获取按钮的状态。它返回以下值之一:

  • LV_BTN_STATE_RELEASED
  • LV_BTN_STATE_PRESSED
  • LV_BTN_STATE_CHECKED_RELEASED
  • LV_BTN_STATE_CHECKED_PRESSED
  • LV_BTN_STATE_DISABLED
  • LV_BTN_STATE_CHECKED_DISABLED

使用lv_btn_set_state(btn, LV_BTN_STATE_…)可以手动更改按钮状态。 如果需要状态的更精确描述(例如,聚焦),可以使用lv_obj_get_state(btn)

二、选中使能

用户可以使用lv_btn_set_checkable(btn, true) 配置按钮为切换按钮。在这种情况下,单击时,按钮将自动进入 LV_STATE_CHECKED 状态(选中状态),再次单击时将退出选中状态。使用 lv_btn_toggle(btn) 可以切换按钮的选中状态。

lvgl2rtt_init("lcd");                                     /* 初始化lvgl2rtt */
 
lv_obj_t * btn1 = lv_btn_create(lv_scr_act(), NULL);      /* 创建按钮 */
lv_obj_set_size(btn1, 80,35);                             /* 设置尺寸 */
lv_btn_set_checkable(btn1, true);                         /* 选中使能 */
lv_obj_align(btn1, NULL, LV_ALIGN_CENTER, 0, 0);          /* 中心对齐 */
 
lv_obj_t * label = lv_label_create(btn1, NULL);           /* 为按钮创建标签 */
lv_label_set_text(label, "Button");                       /* 设置标签文本 */

三、 事件

使用lv_obj_set_event_cb(btn, event_handler)可以设置按钮对象的通用事件,以下特殊事件还通过按钮发送:

  • LV_EVENT_VALUE_CHANGED 切换按钮时发送。

以下键值由按钮处理:

  • LV_KEY_RIGHT / UP 如果启用了切换,则进入切换状态。
  • LV_KEY_LEFT / DOWN 如果启用了切换,则进入非切换状态。

请注意,状态 LV_KEY_ENTER 意味着按钮已转换为 LV_EVENT_PRESSED/PRESSING/RELEASED 模式。关于键值的详细介绍请看Input devices(Overview)章节。

下面的例子使用了按键切换事件,并在回调函数中操作iCore4T板载LED。初始化时,按钮未选中,LED灭,标签内容变为“LED off”。当单击按钮变为选中选中状态时,LED灯亮,标签内容变为“LED on”。

#include <board.h>                                                /* 操作GPIO加载头文件 */
 
#define LED0_PIN    GET_PIN(A, 10)                                /* iCore4T LED引脚为PA10 */
lv_obj_t * label;                                                 /* 先定义标签label */
 
static void event_handler(lv_obj_t * obj, lv_event_t event)       /* 按钮回调函数 */
{
	if(event == LV_EVENT_VALUE_CHANGED) {                     /* 按键状态切换的话 */
		if(rt_pin_read(LED0_PIN) == PIN_LOW ){            /* 切换LED状态 */
			rt_pin_write(LED0_PIN, PIN_HIGH);
			lv_label_set_text(label, "LED off");      /* 更新标签内容 */
		}else{
			rt_pin_write(LED0_PIN, PIN_LOW);
			lv_label_set_text(label, "LED on");
		}
	} 
}
void lv_gui_run(void)
{
	lvgl2rtt_init("lcd");                                     /* 初始化lvgl2rtt */
rt_pin_mode(LED0_PIN, PIN_MODE_OUTPUT);                           /* 设置LED为推挽输出 */
	rt_pin_write(LED0_PIN, PIN_HIGH);                         /* LED默认关闭 */
 
lv_obj_t * btn1 = lv_btn_create(lv_scr_act(), NULL);             /* 创建按钮 */
lv_obj_set_size(btn1, 80,35);                                    /* 设置尺寸 */
lv_btn_set_checkable(btn1, true);                                /* 选中使能 */
lv_obj_set_event_cb(btn1, event_handler);                        /* 回调函数 */
lv_obj_align(btn1, NULL, LV_ALIGN_CENTER, 0, 0);                 /* 居中对齐 */
 
label = lv_label_create(btn1, NULL);                             /* 为按钮创建标签 */
lv_label_set_text(label, "LED off");                             /* 设置标签默认文字 */
}

四、布局和配合

与容器相似,按钮也具有 layout 和 fit 属性。

  • 使用lv_btn_set_layout(btn, LV_LAYOUT_…) 来设置按钮的布局。布局默认值为 LV_LAYOUT_CENTER 。因此,如果为按钮添加一个标签子对象,则标签将自动与中间对齐,不能使用 lv_obj_set_pos() 设置位置。可以使用 lv_btn_set_layout(btn, LV_LAYOUT_OFF) 禁用布局。
  • lv_btn_set_fit/fit2/fit4(btn, LV_FIT_…)可以根据子代,父代和适合类型自动设置按钮的宽度和/或高度。

五、小部件和样式

这些按钮只有一个主要样式LV_BTN_PART_MAIN,可以使用以下组中的所有属性:

  • 背景
  • 边境
  • 大纲
  • 阴影
  • 模式
  • 过渡

启用布局或配合时,它还将使用 padding 属性。关于按钮的样式使用,我们放在下一章lv_style中。

icore4tlvgl_7.txt · 最后更改: 2022/04/01 11:12 由 sean