feat(gui): 自动隐藏配置面板。

This commit is contained in:
Ivan Li 2023-05-07 23:39:52 +08:00
parent 04a36d14a1
commit 3bdd8d70c3

View File

@ -38,6 +38,8 @@ static const char *GUI_TAG = "LVGL_GUI";
// EE 8A 9E // EE 8A 9E
#define APP_TIMER_SYMBOL "\xEE\x8A\x9E" #define APP_TIMER_SYMBOL "\xEE\x8A\x9E"
#define GUI_PANEL_TIMEOUT_US 3000000 // 3s
extern void example_lvgl_demo_ui(lv_disp_t *disp); extern void example_lvgl_demo_ui(lv_disp_t *disp);
static void example_lvgl_flush_cb(lv_disp_drv_t *drv, const lv_area_t *area, static void example_lvgl_flush_cb(lv_disp_drv_t *drv, const lv_area_t *area,
@ -64,6 +66,14 @@ static void example_lvgl_set_px_cb(lv_disp_drv_t *disp_drv, uint8_t *buf,
} }
} }
typedef struct value_setting_panel {
lv_obj_t *panel;
lv_obj_t *bar;
lv_obj_t *label;
lv_obj_t *value_label;
int64_t last_updated_at;
} value_setting_panel_t;
static lv_obj_t *wifi_label; static lv_obj_t *wifi_label;
static lv_anim_t wifi_animate; static lv_anim_t wifi_animate;
@ -73,10 +83,7 @@ static lv_anim_t timer_animate;
static lv_obj_t *desktop_label; static lv_obj_t *desktop_label;
static lv_anim_t desktop_animate; static lv_anim_t desktop_animate;
static lv_obj_t *value_setting_panel; value_setting_panel_t *value_setting_panel = NULL;
static lv_obj_t *value_setting_bar;
static lv_obj_t *value_setting_label;
static lv_obj_t *value_setting_value_label;
static lv_obj_t *scr; static lv_obj_t *scr;
@ -182,6 +189,12 @@ static void gui_set_server_disconnected() {
} }
static void gui_bar_value_update_cb(lv_event_t *e) { static void gui_bar_value_update_cb(lv_event_t *e) {
if (value_setting_panel == NULL) {
ESP_LOGW(GUI_TAG, "value_setting_panel is NULL");
return;
}
lv_obj_t *value_label = value_setting_panel->value_label;
lv_obj_draw_part_dsc_t *dsc = lv_event_get_param(e); lv_obj_draw_part_dsc_t *dsc = lv_event_get_param(e);
if (dsc->part != LV_PART_INDICATOR) return; if (dsc->part != LV_PART_INDICATOR) return;
@ -202,117 +215,107 @@ static void gui_bar_value_update_cb(lv_event_t *e) {
/*If the indicator is long enough put the text inside on the right*/ /*If the indicator is long enough put the text inside on the right*/
if (lv_area_get_width(dsc->draw_area) > txt_size.x + 20) { if (lv_area_get_width(dsc->draw_area) > txt_size.x + 20) {
txt_x = dsc->draw_area->x2 - 8 - txt_size.x + 1; txt_x = dsc->draw_area->x2 - 8 - txt_size.x + 1;
lv_obj_set_style_text_color(value_setting_value_label, lv_color_white(), lv_obj_set_style_text_color(value_label, lv_color_white(), LV_PART_MAIN);
LV_PART_MAIN);
label_dsc.color = lv_color_white(); label_dsc.color = lv_color_white();
} }
/*If the indicator is still short put the text out of it on the right*/ /*If the indicator is still short put the text out of it on the right*/
else { else {
txt_x = dsc->draw_area->x2 - 8 + txt_size.x - 1; txt_x = dsc->draw_area->x2 - 8 + txt_size.x - 1;
lv_obj_set_style_text_color(value_setting_value_label, lv_color_black(), lv_obj_set_style_text_color(value_label, lv_color_black(), LV_PART_MAIN);
LV_PART_MAIN);
} }
lv_obj_align(value_setting_value_label, LV_ALIGN_LEFT_MID, txt_x, 0); lv_obj_align(value_label, LV_ALIGN_LEFT_MID, txt_x, 0);
lv_label_set_text(value_setting_value_label, buf); lv_label_set_text(value_label, buf);
lv_obj_set_width(value_setting_value_label, txt_size.x); lv_obj_set_width(value_label, txt_size.x);
}
static void gui_close_value_setting_panel() {
if (value_setting_panel == NULL) return;
lv_obj_del(value_setting_panel->panel);
free(value_setting_panel);
value_setting_panel = NULL;
}
static void gui_check_value_setting_panel_task(void *pvParameters) {
vTaskDelay(5000 / portTICK_PERIOD_MS);
for (;;) {
if (esp_timer_get_time() - value_setting_panel->last_updated_at >
GUI_PANEL_TIMEOUT_US) {
gui_close_value_setting_panel();
vTaskDelete(NULL);
}
vTaskDelay(1000 / portTICK_PERIOD_MS);
}
} }
static void gui_create_value_setting_panel() { static void gui_create_value_setting_panel() {
if (value_setting_panel != NULL) { if (value_setting_panel != NULL) {
value_setting_panel->last_updated_at = esp_timer_get_time();
return; return;
} }
value_setting_panel =
(value_setting_panel_t *)malloc(sizeof(value_setting_panel_t));
value_setting_panel = lv_obj_create(scr); xTaskCreate(gui_check_value_setting_panel_task, "G_CHK_VAL_SET", 1024, NULL,
lv_obj_set_size(value_setting_panel, 128, 40); configMAX_PRIORITIES - 1, NULL);
lv_obj_align(value_setting_panel, LV_ALIGN_BOTTOM_MID, 0, 0);
lv_obj_set_style_border_width(value_setting_panel, 1, LV_PART_MAIN); value_setting_panel->panel = lv_obj_create(scr);
lv_obj_set_style_border_color(value_setting_panel, lv_color_black(), lv_obj_set_size(value_setting_panel->panel, 128, 40);
lv_obj_align(value_setting_panel->panel, LV_ALIGN_BOTTOM_MID, 0, 0);
lv_obj_set_style_border_width(value_setting_panel->panel, 1, LV_PART_MAIN);
lv_obj_set_style_border_color(value_setting_panel->panel, lv_color_black(),
LV_PART_MAIN); LV_PART_MAIN);
lv_obj_set_style_radius(value_setting_panel, 5, LV_PART_MAIN); lv_obj_set_style_radius(value_setting_panel->panel, 5, LV_PART_MAIN);
lv_obj_set_style_pad_all(value_setting_panel, 2, LV_PART_MAIN); lv_obj_set_style_pad_all(value_setting_panel->panel, 2, LV_PART_MAIN);
value_setting_label = lv_label_create(value_setting_panel); value_setting_panel->label = lv_label_create(value_setting_panel->panel);
lv_obj_align(value_setting_label, LV_ALIGN_BOTTOM_LEFT, 0, 0); lv_obj_align(value_setting_panel->label, LV_ALIGN_BOTTOM_LEFT, 0, 0);
value_setting_bar = lv_bar_create(value_setting_panel); value_setting_panel->bar = lv_bar_create(value_setting_panel->panel);
lv_obj_set_size(value_setting_bar, 120, 12); lv_obj_set_size(value_setting_panel->bar, 120, 12);
lv_obj_align(value_setting_bar, LV_ALIGN_TOP_MID, 0, 0); lv_obj_align(value_setting_panel->bar, LV_ALIGN_TOP_MID, 0, 0);
lv_bar_set_range(value_setting_bar, 0, 100); lv_bar_set_range(value_setting_panel->bar, 0, 100);
lv_bar_set_value(value_setting_bar, 50, LV_ANIM_ON); lv_bar_set_value(value_setting_panel->bar, 50, LV_ANIM_ON);
lv_obj_set_style_bg_color(value_setting_bar, lv_color_white(), LV_PART_MAIN); lv_obj_set_style_bg_color(value_setting_panel->bar, lv_color_white(),
lv_obj_set_style_border_color(value_setting_bar, lv_color_black(),
LV_PART_MAIN); LV_PART_MAIN);
lv_obj_set_style_border_width(value_setting_bar, 1, LV_PART_MAIN); lv_obj_set_style_border_color(value_setting_panel->bar, lv_color_black(),
lv_obj_set_style_radius(value_setting_bar, 5, LV_PART_MAIN); LV_PART_MAIN);
lv_obj_set_style_pad_hor(value_setting_bar, 0, LV_PART_MAIN); lv_obj_set_style_border_width(value_setting_panel->bar, 1, LV_PART_MAIN);
lv_obj_set_style_pad_ver(value_setting_bar, 2, LV_PART_MAIN); lv_obj_set_style_radius(value_setting_panel->bar, 5, LV_PART_MAIN);
lv_obj_set_style_bg_color(value_setting_bar, lv_color_black(), lv_obj_set_style_pad_hor(value_setting_panel->bar, 0, LV_PART_MAIN);
lv_obj_set_style_pad_ver(value_setting_panel->bar, 2, LV_PART_MAIN);
lv_obj_set_style_bg_color(value_setting_panel->bar, lv_color_black(),
LV_PART_INDICATOR); LV_PART_INDICATOR);
lv_obj_add_event_cb(value_setting_bar, gui_bar_value_update_cb, lv_obj_add_event_cb(value_setting_panel->bar, gui_bar_value_update_cb,
LV_EVENT_DRAW_PART_END, NULL); LV_EVENT_DRAW_PART_END, NULL);
value_setting_value_label = lv_label_create(value_setting_bar); value_setting_panel->value_label = lv_label_create(value_setting_panel->bar);
lv_obj_align(value_setting_value_label, LV_ALIGN_CENTER, 0, 0); lv_obj_align(value_setting_panel->value_label, LV_ALIGN_CENTER, 0, 0);
lv_obj_set_style_text_font(value_setting_value_label, &lv_font_montserrat_10, lv_obj_set_style_text_font(value_setting_panel->value_label,
LV_PART_MAIN); &lv_font_montserrat_10, LV_PART_MAIN);
} }
static void gui_change_strip_level(int32_t target_value) { static void gui_change_strip_level(int32_t target_value) {
gui_create_value_setting_panel(); gui_create_value_setting_panel();
lv_label_set_text(value_setting_label, "Strip Level"); lv_label_set_text(value_setting_panel->label, "Strip Level");
lv_bar_set_range(value_setting_bar, 0, 255); lv_bar_set_range(value_setting_panel->bar, 0, 255);
lv_bar_set_value(value_setting_bar, target_value, LV_ANIM_ON); lv_bar_set_value(value_setting_panel->bar, target_value, LV_ANIM_ON);
} }
static void gui_change_display_brightness(int8_t display_index, static void gui_change_display_brightness(int8_t display_index,
int32_t target_value) { int32_t target_value) {
gui_create_value_setting_panel(); gui_create_value_setting_panel();
lv_label_set_text_fmt(value_setting_label, "Display#%d Brightness", lv_label_set_text_fmt(value_setting_panel->label, "Display#%d Brightness",
display_index); display_index);
lv_bar_set_range(value_setting_bar, 0, 100); lv_bar_set_range(value_setting_panel->bar, 0, 100);
lv_bar_set_value(value_setting_bar, target_value, LV_ANIM_ON); lv_bar_set_value(value_setting_panel->bar, target_value, LV_ANIM_ON);
} }
static void gui_change_volume_level(int32_t target_value) { static void gui_change_volume_level(int32_t target_value) {
gui_create_value_setting_panel(); gui_create_value_setting_panel();
lv_label_set_text(value_setting_label, "Volume Level"); lv_label_set_text(value_setting_panel->label, "Volume Level");
lv_bar_set_range(value_setting_bar, 0, 100); lv_bar_set_range(value_setting_panel->bar, 0, 100);
lv_bar_set_value(value_setting_bar, target_value, LV_ANIM_ON); lv_bar_set_value(value_setting_panel->bar, target_value, LV_ANIM_ON);
}
void lv_example_bar_6(lv_obj_t *src) {
static lv_style_t style_bar;
lv_style_init(&style_bar);
lv_style_set_bg_color(&style_bar, lv_color_white());
lv_style_set_border_width(&style_bar, 1);
lv_style_set_border_color(&style_bar, lv_color_black());
lv_style_set_pad_hor(&style_bar, 4);
lv_style_set_pad_ver(&style_bar, 2);
static lv_style_t style_indic;
lv_style_init(&style_indic);
lv_style_set_bg_color(&style_indic, lv_color_black());
lv_obj_t *bar = lv_bar_create(src);
lv_obj_set_size(bar, 100, 10);
lv_obj_center(bar);
lv_obj_add_style(bar, &style_bar, LV_PART_MAIN);
lv_obj_add_style(bar, &style_indic, LV_PART_INDICATOR);
lv_bar_set_range(bar, 0, 100);
lv_bar_set_value(bar, 0, LV_ANIM_ON);
lv_anim_t a;
lv_anim_init(&a);
lv_anim_set_exec_cb(&a, set_value);
lv_anim_set_time(&a, 3000);
lv_anim_set_playback_time(&a, 3000);
lv_anim_set_var(&a, bar);
lv_anim_set_values(&a, 0, 50);
lv_anim_set_repeat_count(&a, LV_ANIM_REPEAT_INFINITE);
lv_anim_start(&a);
} }
void gui_status_bar_create(lv_obj_t *scr) { void gui_status_bar_create(lv_obj_t *scr) {
@ -354,15 +357,11 @@ void example_lvgl_demo_ui(lv_disp_t *disp) {
lv_label_set_long_mode(label, lv_label_set_long_mode(label,
LV_LABEL_LONG_SCROLL_CIRCULAR); /* Circular scroll LV_LABEL_LONG_SCROLL_CIRCULAR); /* Circular scroll
*/ */
lv_label_set_text(label, "Hello Espressif, Hello LVGL."); lv_label_set_text(label, "Hello Ivan Li!");
lv_obj_set_width(label, 120); lv_obj_set_width(label, 120);
lv_obj_align(label, LV_ALIGN_BOTTOM_RIGHT, 0, 0); lv_obj_align(label, LV_ALIGN_BOTTOM_RIGHT, 0, 0);
// lv_example_bar_6(scr);
gui_status_bar_create(scr); gui_status_bar_create(scr);
gui_create_value_setting_panel();
} }
static void gui_tick(void *pvParameters) { static void gui_tick(void *pvParameters) {