在实际的 LVGL项目工程中，按钮部件的使用频率是非常高的，它常用于控制设备的启停。
在 LVGL中，当按钮部件被创建出来之后，其默认是一个圆角矩形，较为遗憾的是，按钮部件
并不能直接设置文本。
本章节将分为以下几个小节：
12.1 按钮部件的组成
12.2 按钮部件的相关知识
12.3 按钮部件的 API 函数
12.4 按钮部件的实验
12.1****按钮部件的组成
按钮部件(lv_btn)仅有一个组成部分：主体背景，示意图如下：
12.2****按钮部件的相关知识
按钮部件和基础对象非常类似，它们的绝大部分知识都是通用的，这里我们只介绍它们之
间的区别：
① 默认情况下，按钮部件不可滚动。
② 默认情况下，按钮部件已经添加到默认组中。
③ 按钮部件的默认宽高为 LV_SIZE_CONTENT（自适应）。
12.3按钮部件的API****函数
lv_btn_create****函数
创建按钮对象，其函数原型如下所示：
lv_obj_t * lv_btn_create ( lv_obj_t *parent);
parent 部件的父类
**返回值：**返回对象控制块。
设置按钮大小
我们可以通过屏幕的大小来进行按钮大小的设计
获取当前屏幕大小
/* 获取当前活动屏幕的宽高 */
#define scr_act_width() lv_obj_get_width(lv_scr_act())
#define scr_act_height() lv_obj_get_height(lv_scr_act())
创建一个按钮
btn_next = lv_btn_create(lv_scr_act()); /* 创建加速按钮 */
lv_obj_set_size(btn_next, scr_act_width() / 4, scr_act_height() / 6); /* 设置按钮大小 */
lv_obj_align(btn_next, LV_ALIGN_CENTER, -scr_act_width() / 3, 0); /* 设置按钮位置 */
lv_obj_add_event_cb(btn_next, btn_event_cb, LV_EVENT_CLICKED, NULL); /* 设置按钮事件 */
设置按钮背景颜色
/* 设置按钮背景颜色（默认） */
lv_obj_set_style_bg_color(btn_stop_run, lv_color_hex(0xef5f60),
LV_STATE_DEFAULT);
/* 设置按钮背景颜色（按下） */
lv_obj_set_style_bg_color(btn_stop_run, lv_color_hex(0xff0000),
LV_STATE_PRESSED);
设置按钮事件
lv_obj_add_event_cb(btn_stop_run, btn_event_cb, LV_EVENT_CLICKED, NULL);
设置按钮标签
设置标签需要开启LVGL字库，并且进行设置，具体实现看总代码。
lv_obj_t* label = lv_label_create(btn_stop_run); /* 创建急停按钮标签 */
lv_obj_set_style_text_font(label, font, LV_PART_MAIN); /* 设置字体 */
lv_label_set_text(label, "Stop"); /* 设置标签文本 */
lv_obj_set_align(label,LV_ALIGN_CENTER); /* 设置标签位置 */
总代码
/**
* @brief LVGL 演示
* @param 无
* @return 无
*/
void lv_mainstart(void)
{
lv_example_label(); /* 速度提示标签 */
lv_example_btn_up(); /* 加速按钮 */
lv_example_btn_down(); /* 减速按钮 */
lv_example_btn_stop(); /* 急停按钮 */
}
/**************************** 第一部分 结束 ****************************/
/**************************** 第二部分 开始 ****************************/
/**
* @brief 速度值提示标签
* @param 无
* @return 无
*/
static void lv_example_label(void)
{
/* 根据活动屏幕宽度选择字体 */
if (scr_act_width() <= 320)
{
font = &lv_font_montserrat_10;
}
else if (scr_act_width() <= 480)
{
font = &lv_font_montserrat_14;
}
else
{
font = &lv_font_montserrat_20;
}
label_speed = lv_label_create(lv_scr_act()); /* 创建速度显示标签 */
lv_obj_set_style_text_font(label_speed, font, LV_PART_MAIN); /* 设置字体 */
lv_label_set_text(label_speed, "Speed : 0 RPM"); /* 设置文本 */
/* 设置标签位置 */
lv_obj_align(label_speed, LV_ALIGN_CENTER, 0, -scr_act_height() / 3);
}
/**************************** 第二部分 结束 ****************************/
/**************************** 第三部分 开始 ****************************/
/**
* @brief 按钮回调
* @param *e ：事件相关参数的集合，它包含了该事件的所有数据
* @return 无
*/
static void btn_event_cb(lv_event_t * e)
{
lv_obj_t *target = lv_event_get_target(e); /* 获取触发源 */
if(target == btn_speed_up) /* 加速按钮 */
{
speed_val += 30;
}
else if(target == btn_speed_down) /* 减速按钮 */
{
speed_val -= 30;
}
else if(target == btn_stop) /* 急停按钮 */
{
speed_val = 0;
}
/* 更新速度值 */
lv_label_set_text_fmt(label_speed, "Speed : %d RPM", speed_val);
}
/**
* @brief 加速按钮
* @param 无
* @return 无
*/
static void lv_example_btn_up(void)
{
/* 创建加速按钮 */
btn_speed_up = lv_btn_create(lv_scr_act());
/* 设置按钮大小 */
lv_obj_set_size(btn_speed_up, scr_act_width() / 4, scr_act_height() / 6);
/* 设置按钮位置 */
lv_obj_align(btn_speed_up, LV_ALIGN_CENTER, -scr_act_width() / 3, 0);
/* 设置按钮事件 */
lv_obj_add_event_cb(btn_speed_up, btn_event_cb, LV_EVENT_CLICKED, NULL);
lv_obj_t* label = lv_label_create(btn_speed_up); /* 创建加速按钮标签 */
lv_obj_set_style_text_font(label, font, LV_PART_MAIN); /* 设置字体 */
lv_label_set_text(label, "Speed +"); /* 设置标签文本 */
lv_obj_set_align(label,LV_ALIGN_CENTER); /* 设置标签位置 */
}
/**
* @brief 减速按钮
* @param 无
* @return 无
*/
static void lv_example_btn_down(void)
{
/* 创建加速按钮 */
btn_speed_down = lv_btn_create(lv_scr_act());
/* 设置按钮大小 */
lv_obj_set_size(btn_speed_down, scr_act_width() / 4, scr_act_height() / 6);
/* 设置按钮位置 */
lv_obj_align(btn_speed_down, LV_ALIGN_CENTER, 0, 0);
/* 设置按钮事件 */
lv_obj_add_event_cb(btn_speed_down, btn_event_cb, LV_EVENT_CLICKED, NULL);
lv_obj_t* label = lv_label_create(btn_speed_down); /* 创建减速按钮标签 */
lv_obj_set_style_text_font(label, font, LV_PART_MAIN); /* 设置字体 */
lv_label_set_text(label, "Speed -"); /* 设置标签文本 */
lv_obj_set_align(label,LV_ALIGN_CENTER); /* 设置标签位置 */
}
/**
* @brief 急停按钮
* @param 无
* @return 无
*/
static void lv_example_btn_stop(void)
{
/* 创建急停按钮 */
btn_stop = lv_btn_create(lv_scr_act());
/* 设置按钮大小 */
lv_obj_set_size(btn_stop, scr_act_width() / 4, scr_act_height() / 6);
/* 设置按钮位置 */
lv_obj_align(btn_stop, LV_ALIGN_CENTER, scr_act_width() / 3, 0);
/* 设置按钮背景颜色（默认） */
lv_obj_set_style_bg_color(btn_stop, lv_color_hex(0xef5f60),
LV_STATE_DEFAULT);
/* 设置按钮背景颜色（按下） */
lv_obj_set_style_bg_color(btn_stop, lv_color_hex(0xff0000),
LV_STATE_PRESSED);
/* 设置按钮事件 */
lv_obj_add_event_cb(btn_stop, btn_event_cb, LV_EVENT_CLICKED, NULL);
lv_obj_t* label = lv_label_create(btn_stop); /* 创建急停按钮标签 */
lv_obj_set_style_text_font(label, font, LV_PART_MAIN); /* 设置字体 */
lv_label_set_text(label, "Stop"); /* 设置标签文本 */
lv_obj_set_align(label,LV_ALIGN_CENTER); /* 设置标签位置 */
}
/**************************** 第三部分 结束 ****************************/