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
|
// 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_obj_set_style_border_color(value_setting_panel->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_width(value_setting_panel->bar, 1, LV_PART_MAIN);
|
||||||
lv_obj_set_style_radius(value_setting_bar, 5, LV_PART_MAIN);
|
lv_obj_set_style_radius(value_setting_panel->bar, 5, LV_PART_MAIN);
|
||||||
lv_obj_set_style_pad_hor(value_setting_bar, 0, 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_bar, 2, 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_bar, lv_color_black(),
|
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) {
|
||||||
|
Loading…
Reference in New Issue
Block a user