feat(gui): 自动隐藏配置面板。
This commit is contained in:
parent
04a36d14a1
commit
3bdd8d70c3
169
main/gui.c
169
main/gui.c
@ -38,6 +38,8 @@ static const char *GUI_TAG = "LVGL_GUI";
|
||||
// EE 8A 9E
|
||||
#define APP_TIMER_SYMBOL "\xEE\x8A\x9E"
|
||||
|
||||
#define GUI_PANEL_TIMEOUT_US 3000000 // 3s
|
||||
|
||||
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,
|
||||
@ -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_anim_t wifi_animate;
|
||||
|
||||
@ -73,10 +83,7 @@ static lv_anim_t timer_animate;
|
||||
static lv_obj_t *desktop_label;
|
||||
static lv_anim_t desktop_animate;
|
||||
|
||||
static lv_obj_t *value_setting_panel;
|
||||
static lv_obj_t *value_setting_bar;
|
||||
static lv_obj_t *value_setting_label;
|
||||
static lv_obj_t *value_setting_value_label;
|
||||
value_setting_panel_t *value_setting_panel = NULL;
|
||||
|
||||
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) {
|
||||
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);
|
||||
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 (lv_area_get_width(dsc->draw_area) > txt_size.x + 20) {
|
||||
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_PART_MAIN);
|
||||
lv_obj_set_style_text_color(value_label, lv_color_white(), LV_PART_MAIN);
|
||||
label_dsc.color = lv_color_white();
|
||||
}
|
||||
/*If the indicator is still short put the text out of it on the right*/
|
||||
else {
|
||||
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_PART_MAIN);
|
||||
lv_obj_set_style_text_color(value_label, lv_color_black(), LV_PART_MAIN);
|
||||
}
|
||||
|
||||
lv_obj_align(value_setting_value_label, LV_ALIGN_LEFT_MID, txt_x, 0);
|
||||
lv_label_set_text(value_setting_value_label, buf);
|
||||
lv_obj_set_width(value_setting_value_label, txt_size.x);
|
||||
lv_obj_align(value_label, LV_ALIGN_LEFT_MID, txt_x, 0);
|
||||
lv_label_set_text(value_label, buf);
|
||||
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() {
|
||||
if (value_setting_panel != NULL) {
|
||||
value_setting_panel->last_updated_at = esp_timer_get_time();
|
||||
return;
|
||||
}
|
||||
value_setting_panel =
|
||||
(value_setting_panel_t *)malloc(sizeof(value_setting_panel_t));
|
||||
|
||||
value_setting_panel = lv_obj_create(scr);
|
||||
lv_obj_set_size(value_setting_panel, 128, 40);
|
||||
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);
|
||||
lv_obj_set_style_border_color(value_setting_panel, lv_color_black(),
|
||||
xTaskCreate(gui_check_value_setting_panel_task, "G_CHK_VAL_SET", 1024, NULL,
|
||||
configMAX_PRIORITIES - 1, NULL);
|
||||
|
||||
value_setting_panel->panel = lv_obj_create(scr);
|
||||
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_obj_set_style_radius(value_setting_panel, 5, LV_PART_MAIN);
|
||||
lv_obj_set_style_pad_all(value_setting_panel, 2, 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->panel, 2, LV_PART_MAIN);
|
||||
|
||||
value_setting_label = lv_label_create(value_setting_panel);
|
||||
lv_obj_align(value_setting_label, LV_ALIGN_BOTTOM_LEFT, 0, 0);
|
||||
value_setting_panel->label = lv_label_create(value_setting_panel->panel);
|
||||
lv_obj_align(value_setting_panel->label, LV_ALIGN_BOTTOM_LEFT, 0, 0);
|
||||
|
||||
value_setting_bar = lv_bar_create(value_setting_panel);
|
||||
lv_obj_set_size(value_setting_bar, 120, 12);
|
||||
lv_obj_align(value_setting_bar, LV_ALIGN_TOP_MID, 0, 0);
|
||||
lv_bar_set_range(value_setting_bar, 0, 100);
|
||||
lv_bar_set_value(value_setting_bar, 50, LV_ANIM_ON);
|
||||
lv_obj_set_style_bg_color(value_setting_bar, lv_color_white(), LV_PART_MAIN);
|
||||
lv_obj_set_style_border_color(value_setting_bar, lv_color_black(),
|
||||
value_setting_panel->bar = lv_bar_create(value_setting_panel->panel);
|
||||
lv_obj_set_size(value_setting_panel->bar, 120, 12);
|
||||
lv_obj_align(value_setting_panel->bar, LV_ALIGN_TOP_MID, 0, 0);
|
||||
lv_bar_set_range(value_setting_panel->bar, 0, 100);
|
||||
lv_bar_set_value(value_setting_panel->bar, 50, LV_ANIM_ON);
|
||||
lv_obj_set_style_bg_color(value_setting_panel->bar, lv_color_white(),
|
||||
LV_PART_MAIN);
|
||||
lv_obj_set_style_border_width(value_setting_bar, 1, LV_PART_MAIN);
|
||||
lv_obj_set_style_radius(value_setting_bar, 5, LV_PART_MAIN);
|
||||
lv_obj_set_style_pad_hor(value_setting_bar, 0, LV_PART_MAIN);
|
||||
lv_obj_set_style_pad_ver(value_setting_bar, 2, LV_PART_MAIN);
|
||||
lv_obj_set_style_bg_color(value_setting_bar, lv_color_black(),
|
||||
lv_obj_set_style_border_color(value_setting_panel->bar, lv_color_black(),
|
||||
LV_PART_MAIN);
|
||||
lv_obj_set_style_border_width(value_setting_panel->bar, 1, LV_PART_MAIN);
|
||||
lv_obj_set_style_radius(value_setting_panel->bar, 5, LV_PART_MAIN);
|
||||
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_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);
|
||||
|
||||
value_setting_value_label = lv_label_create(value_setting_bar);
|
||||
lv_obj_align(value_setting_value_label, LV_ALIGN_CENTER, 0, 0);
|
||||
lv_obj_set_style_text_font(value_setting_value_label, &lv_font_montserrat_10,
|
||||
LV_PART_MAIN);
|
||||
value_setting_panel->value_label = lv_label_create(value_setting_panel->bar);
|
||||
lv_obj_align(value_setting_panel->value_label, LV_ALIGN_CENTER, 0, 0);
|
||||
lv_obj_set_style_text_font(value_setting_panel->value_label,
|
||||
&lv_font_montserrat_10, LV_PART_MAIN);
|
||||
}
|
||||
|
||||
static void gui_change_strip_level(int32_t target_value) {
|
||||
gui_create_value_setting_panel();
|
||||
lv_label_set_text(value_setting_label, "Strip Level");
|
||||
lv_bar_set_range(value_setting_bar, 0, 255);
|
||||
lv_bar_set_value(value_setting_bar, target_value, LV_ANIM_ON);
|
||||
lv_label_set_text(value_setting_panel->label, "Strip Level");
|
||||
lv_bar_set_range(value_setting_panel->bar, 0, 255);
|
||||
lv_bar_set_value(value_setting_panel->bar, target_value, LV_ANIM_ON);
|
||||
}
|
||||
|
||||
static void gui_change_display_brightness(int8_t display_index,
|
||||
int32_t target_value) {
|
||||
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);
|
||||
lv_bar_set_range(value_setting_bar, 0, 100);
|
||||
lv_bar_set_value(value_setting_bar, target_value, LV_ANIM_ON);
|
||||
lv_bar_set_range(value_setting_panel->bar, 0, 100);
|
||||
lv_bar_set_value(value_setting_panel->bar, target_value, LV_ANIM_ON);
|
||||
}
|
||||
|
||||
static void gui_change_volume_level(int32_t target_value) {
|
||||
gui_create_value_setting_panel();
|
||||
lv_label_set_text(value_setting_label, "Volume Level");
|
||||
lv_bar_set_range(value_setting_bar, 0, 100);
|
||||
lv_bar_set_value(value_setting_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);
|
||||
lv_label_set_text(value_setting_panel->label, "Volume Level");
|
||||
lv_bar_set_range(value_setting_panel->bar, 0, 100);
|
||||
lv_bar_set_value(value_setting_panel->bar, target_value, LV_ANIM_ON);
|
||||
}
|
||||
|
||||
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_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_align(label, LV_ALIGN_BOTTOM_RIGHT, 0, 0);
|
||||
|
||||
// lv_example_bar_6(scr);
|
||||
|
||||
gui_status_bar_create(scr);
|
||||
|
||||
gui_create_value_setting_panel();
|
||||
}
|
||||
|
||||
static void gui_tick(void *pvParameters) {
|
||||
|
||||
Loading…
Reference in New Issue
Block a user