mmuyu 发表于 2023-9-29 22:00:29

lvgl控件的使用-按钮

   在触摸屏上按键是我们使用最多的控件之一,控件的设计和功能对用户体验至关重要。因此一个易用的按钮有助于提升用户的舒适度,接下来我们就使用lvgl创建一个按钮。

按钮作为 LVGL(LittlevGL)图形用户界面库中的重要控件,用于触发操作、触发事件或执行特定任务,lvgl的按钮可以包含文本、图标或两者的组合,用户通过触摸、点击或使用外部设备(如鼠标)与按钮进行交互。

在lvgl中,最简单的按钮需要包含创建按钮,按钮的位置,按钮所属的父对象,按钮大小

转化为代码如下:

lv_obj_t* btn = lv_btn_create(boot_screen);
    lv_obj_set_pos(btn, 50, 50);
    lv_obj_set_size(btn, 100, 40);

效果如图所示:



可以看见,最简单的按钮连描述文字都没有,因此是不利于用户使用的。

为了更直观展示按钮的作用,我们可以为按钮加上文字描述,使用的代码如下:

lv_obj_t *label = lv_label_create(btn);
lv_label_set_text(label, "button");

再看一下效果:


相比上一个效果,这个就直观很多了。

单纯只有按钮是不够的,为了发挥按钮的作用,我们需要使用lvgl提供的事件把按钮触发事件绑定到我们需要执行的任务上,代码如下:

首先定义按钮回调函数:
lv_obj_add_event(btn, event_handler, LV_EVENT_ALL, NULL);

接下来,编写对应的函数功能:

static void event_handler(lv_event_t* e)
{
    lv_event_code_t code = lv_event_get_code(e);

    if (code == LV_EVENT_CLICKED) {
      LV_LOG_USER("Clicked");
    }
}

我们再看一下效果:



成功触发了回调函数,这样我们就简单实现了一个按钮的功能,接下来就可以用按钮实现对应数据点上传或者事件执行了。
页: [1]
查看完整版本: lvgl控件的使用-按钮