ESP32 LVGL btn事件、label赋值、ddlist选项读取

我这里ESP32 LVGL使用Gui Guider图形化工具进行代码生产

1、 btn

需要在Gui Guider中启用事件，在btn上点击右键，选择事件添加

选中custom code(自定义代码)，同时在通用中选中自定义

编辑，events_init.c文件中就会自动添加事件

登录后复制

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

	switch (code) {
	case LV_EVENT_CLICKED:
	{
		
		break;
	}
	default:
		break;
	}
}

• 1.
• 2.
• 3.
• 4.
• 5.
• 6.
• 7.
• 8.
• 9.
• 10.
• 11.
• 12.
• 13.
• 14.

 通过界面进行代码配置，点击按钮设置label的内容

2、label 

使用下面代码就可以设置label 的text为1

登录后复制

lv_label_set_text(guider_ui.main_screen_label_1, "1");

• 1.

3、 ddlist

添加一个ddlist，增加3个选项

 需要在Gui Guider中启用事件，在ddlist上点击右键，选择事件添加

依次添加index:0,设置label_1的文本为1， index:1,设置label_1的文本为2，index:2,设置label_1的文本为3后运行

默认

选择3

生成代码如下

登录后复制

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

	switch (code) {
	case LV_EVENT_CLICKED:
	{
		uint16_t id = lv_dropdown_get_selected(guider_ui.main_screen_ddlist_1);
		switch(id) {
		case 0:
		{
			lv_obj_set_style_text_font(guider_ui.main_screen_label_1, &lv_font_montserratMedium_12, 0);
			lv_label_set_text(guider_ui.main_screen_label_1, "1");
			break;
		}
		case 1:
		{
			lv_obj_set_style_text_font(guider_ui.main_screen_label_1, &lv_font_montserratMedium_12, 0);
			lv_label_set_text(guider_ui.main_screen_label_1, "2");
			break;
		}
		case 2:
		{
			lv_obj_set_style_text_font(guider_ui.main_screen_label_1, &lv_font_montserratMedium_12, 0);
			lv_label_set_text(guider_ui.main_screen_label_1, "3");
			break;
		}
		default:
			break;
		}
		break;
	}
	default:
		break;
	}
}

• 1.
• 2.
• 3.
• 4.
• 5.
• 6.
• 7.
• 8.
• 9.
• 10.
• 11.
• 12.
• 13.
• 14.
• 15.
• 16.
• 17.
• 18.
• 19.
• 20.
• 21.
• 22.
• 23.
• 24.
• 25.
• 26.
• 27.
• 28.
• 29.
• 30.
• 31.
• 32.
• 33.
• 34.
• 35.
• 36.

通过界面进行代码配置

登录后复制

int number = 1234;
char buffer[20]; // 确保有足够的空间存储转换后的字符串
snprintf(buffer, sizeof(buffer), "%d", number);
// 现在你可以使用buffer中的字符串来显示数字
lv_label_set_text(guider_ui.main_screen_label_1, buffer);

• 1.
• 2.
• 3.
• 4.
• 5.

4、roller

roller非常适合作为时间选择

登录后复制

// 获取选择项的索引
int selected_index = lv_roller_get_selected(roller);
    
// 获取选择项的字符串
char selected_str[32];
lv_roller_get_selected_str(roller, selected_str, sizeof(selected_str));

• 1.
• 2.
• 3.
• 4.
• 5.
• 6.

放到事件里

登录后复制

static void roller_event_cb(lv_obj_t *roller, lv_event_t event) {
    if (event == LV_EVENT_VALUE_CHANGED) {
        char buf[32];
        lv_roller_get_selected_str(roller, buf, sizeof(buf));
        ESP_LOGI("LVGL", "选中的选项: %s", buf);
    }
}

• 1.
• 2.
• 3.
• 4.
• 5.
• 6.
• 7.

通过界面进行代码配置，这里写一个全局变量int data_number=10;其他函数里也可用

 生成代码包含全局变量

代码内容

登录后复制

int data_number=10;

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

	switch (code) {
	case LV_EVENT_CLICKED:
	{
		char buffer[32];
	data_number = 20;
	lv_roller_get_selected_str(guider_ui.main_screen_roller_1, buffer, sizeof(buffer));
	// 现在你可以使用buffer中的字符串来显示数字
	lv_label_set_text(guider_ui.main_screen_label_1, buffer);
		break;
	}
	default:
		break;
	}
}

• 1.
• 2.
• 3.
• 4.
• 5.
• 6.
• 7.
• 8.
• 9.
• 10.
• 11.
• 12.
• 13.
• 14.
• 15.
• 16.
• 17.
• 18.
• 19.
• 20.

效果