#pragma once #include #include "app_icon_8.c" #include "ch1116.c" #include "driver/i2c.h" #include "esp_err.h" #include "esp_log.h" #include "esp_timer.h" #include "freertos/FreeRTOS.h" #include "freertos/task.h" #include "lvgl.h" static const char *GUI_TAG = "LVGL_GUI"; #define I2C_HOST 0 #define EXAMPLE_LCD_PIXEL_CLOCK_HZ (400 * 1000) #define EXAMPLE_LCD_H_RES CH1116_WIDTH #define EXAMPLE_LCD_V_RES CH1116_HEIGHT #define EXAMPLE_LVGL_TICK_PERIOD_MS 2 // EF 9A AA #define APP_WIFI_WEAK_SYMBOL "\xEF\x9A\xAA" // EF 9A AB #define APP_WIFI_FAIR_SYMBOL "\xEF\x9A\xAB" // EF 87 AB #define APP_WIFI_GOOD_SYMBOL "\xEF\x87\xAB" // EE 87 8B #define APP_CONNECTED_SYMBOL "\xEE\x87\x8B" // EE 87 8C #define APP_DISCONNECTED_SYMBOL "\xEE\x87\x8C" // EE 8A 9E #define APP_TIMER_SYMBOL "\xEE\x8A\x9E" 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, lv_color_t *color_map) { int offsetx1 = area->x1; int offsetx2 = area->x2; int offsety1 = area->y1; int offsety2 = area->y2; // copy a buffer's content to a specific area of the display ch1116_draw_bitmap(offsetx1, offsety1, offsetx2, offsety2, color_map); lv_disp_flush_ready(drv); } static void example_lvgl_set_px_cb(lv_disp_drv_t *disp_drv, uint8_t *buf, lv_coord_t buf_w, lv_coord_t x, lv_coord_t y, lv_color_t color, lv_opa_t opa) { uint16_t byte_index = x + ((y >> 3) * buf_w); uint8_t bit_index = y & 0x7; if ((color.full == 0) && (LV_OPA_TRANSP != opa)) { buf[byte_index] |= (1 << bit_index); } else { buf[byte_index] &= ~(1 << bit_index); } } static lv_obj_t *wifi_label; static lv_anim_t wifi_animate; static lv_obj_t *timer_label; 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; static lv_obj_t *scr; static void example_lvgl_rounder(lv_disp_drv_t *disp_drv, lv_area_t *area) { area->y1 = area->y1 & (~0x7); area->y2 = area->y2 | 0x7; } static void example_increase_lvgl_tick(void *arg) { /* Tell LVGL how many milliseconds has elapsed */ lv_tick_inc(EXAMPLE_LVGL_TICK_PERIOD_MS); } static void set_value(void *bar, int32_t v) { lv_bar_set_value(bar, v, LV_ANIM_OFF); } static void set_visible(void *obj, int32_t v) { if (v) { lv_obj_clear_flag(obj, LV_OBJ_FLAG_HIDDEN); } else { lv_obj_add_flag(obj, LV_OBJ_FLAG_HIDDEN); } } static void set_obj_blink_animate(lv_obj_t *obj, lv_anim_t *a) { lv_anim_init(a); lv_anim_set_exec_cb(a, set_visible); lv_anim_set_time(a, 100); lv_anim_set_playback_time(a, 100); lv_anim_set_playback_delay(a, 200); lv_anim_set_repeat_delay(a, 200); lv_anim_set_values(a, 0, 1); lv_anim_set_var(a, obj); lv_anim_set_repeat_count(a, LV_ANIM_REPEAT_INFINITE); lv_anim_start(a); } static void change_wifi_icon(void *obj, int32_t v) { switch (v) { case 0: lv_label_set_text(obj, APP_WIFI_WEAK_SYMBOL); break; case 1: lv_label_set_text(obj, APP_WIFI_FAIR_SYMBOL); break; case 2: lv_label_set_text(obj, APP_WIFI_GOOD_SYMBOL); break; default: ESP_LOGW(GUI_TAG, "Unknown wifi strength: %ld", v); break; } } static void gui_set_wifi_connecting() { lv_obj_clear_flag(wifi_label, LV_OBJ_FLAG_HIDDEN); lv_anim_init(&wifi_animate); lv_anim_set_exec_cb(&wifi_animate, change_wifi_icon); lv_anim_set_time(&wifi_animate, 300); lv_anim_set_repeat_delay(&wifi_animate, 300); lv_anim_set_values(&wifi_animate, 0, 2); lv_anim_set_var(&wifi_animate, wifi_label); lv_anim_set_repeat_count(&wifi_animate, LV_ANIM_REPEAT_INFINITE); lv_anim_start(&wifi_animate); } static void gui_set_wifi_connected() { lv_anim_del(wifi_label, NULL); vTaskDelay(300 / portTICK_PERIOD_MS); lv_obj_clear_flag(wifi_label, LV_OBJ_FLAG_HIDDEN); lv_label_set_text(wifi_label, APP_WIFI_GOOD_SYMBOL); } static void gui_set_wifi_disconnected() { lv_anim_del(&wifi_label, NULL); vTaskDelay(300 / portTICK_PERIOD_MS); lv_obj_clear_flag(wifi_label, LV_OBJ_FLAG_HIDDEN); lv_label_set_text(wifi_label, APP_WIFI_WEAK_SYMBOL); } static void gui_set_server_connecting() { set_obj_blink_animate(desktop_label, &desktop_animate); } static void gui_set_server_connected() { lv_anim_del(desktop_label, NULL); vTaskDelay(300 / portTICK_PERIOD_MS); lv_obj_clear_flag(desktop_label, LV_OBJ_FLAG_HIDDEN); lv_label_set_text(desktop_label, APP_CONNECTED_SYMBOL); } static void gui_set_server_disconnected() { lv_anim_del(desktop_label, NULL); vTaskDelay(300 / portTICK_PERIOD_MS); lv_obj_clear_flag(desktop_label, LV_OBJ_FLAG_HIDDEN); lv_label_set_text(desktop_label, APP_DISCONNECTED_SYMBOL); } static void gui_bar_value_update_cb(lv_event_t *e) { lv_obj_draw_part_dsc_t *dsc = lv_event_get_param(e); if (dsc->part != LV_PART_INDICATOR) return; lv_obj_t *obj = lv_event_get_target(e); lv_draw_label_dsc_t label_dsc; lv_draw_label_dsc_init(&label_dsc); label_dsc.font = &lv_font_montserrat_10; char buf[8]; lv_snprintf(buf, sizeof(buf), "%ld", lv_bar_get_value(obj)); lv_point_t txt_size; lv_txt_get_size(&txt_size, buf, label_dsc.font, label_dsc.letter_space, label_dsc.line_space, LV_COORD_MAX, label_dsc.flag); lv_coord_t txt_x; /*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); 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_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); } static void gui_create_value_setting_panel() { if (value_setting_panel != NULL) { return; } 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(), 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); value_setting_label = lv_label_create(value_setting_panel); lv_obj_align(value_setting_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(), 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_PART_INDICATOR); lv_obj_add_event_cb(value_setting_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); } 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); } 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", display_index); lv_bar_set_range(value_setting_bar, 0, 100); lv_bar_set_value(value_setting_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); } void gui_status_bar_create(lv_obj_t *scr) { // wifi icon wifi_label = lv_label_create(scr); lv_label_set_long_mode(wifi_label, LV_LABEL_LONG_SCROLL_CIRCULAR); lv_label_set_text(wifi_label, APP_WIFI_GOOD_SYMBOL); lv_obj_set_width(wifi_label, 10); lv_obj_align(wifi_label, LV_ALIGN_OUT_TOP_LEFT, 0, 0); lv_obj_set_style_text_color(wifi_label, lv_color_black(), LV_PART_MAIN); lv_obj_set_style_text_font(wifi_label, &app_icon_8, LV_PART_MAIN); lv_obj_add_flag(wifi_label, LV_OBJ_FLAG_HIDDEN); // timer icon timer_label = lv_label_create(scr); lv_label_set_long_mode(timer_label, LV_LABEL_LONG_SCROLL_CIRCULAR); lv_label_set_text(timer_label, APP_TIMER_SYMBOL); lv_obj_set_width(timer_label, 10); lv_obj_align(timer_label, LV_ALIGN_OUT_TOP_LEFT, 12, 0); lv_obj_set_style_text_color(timer_label, lv_color_black(), LV_PART_MAIN); lv_obj_set_style_text_font(timer_label, &app_icon_8, LV_PART_MAIN); lv_obj_add_flag(timer_label, LV_OBJ_FLAG_HIDDEN); // desktop icon desktop_label = lv_label_create(scr); lv_label_set_long_mode(desktop_label, LV_LABEL_LONG_SCROLL_CIRCULAR); lv_label_set_text(desktop_label, APP_CONNECTED_SYMBOL); lv_obj_set_width(desktop_label, 10); lv_obj_align(desktop_label, LV_ALIGN_OUT_TOP_LEFT, 24, 0); lv_obj_set_style_text_color(desktop_label, lv_color_black(), LV_PART_MAIN); lv_obj_set_style_text_font(desktop_label, &app_icon_8, LV_PART_MAIN); lv_obj_add_flag(desktop_label, LV_OBJ_FLAG_HIDDEN); } void example_lvgl_demo_ui(lv_disp_t *disp) { scr = lv_disp_get_scr_act(disp); lv_obj_t *label = lv_label_create(scr); lv_label_set_long_mode(label, LV_LABEL_LONG_SCROLL_CIRCULAR); /* Circular scroll */ lv_label_set_text(label, "Hello Espressif, Hello LVGL."); 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) { while (1) { // raise the task priority of LVGL and/or reduce the handler period can // improve the performance vTaskDelay(pdMS_TO_TICKS(10)); // The task running lv_timer_handler should have lower priority than that // running `lv_tick_inc` lv_timer_handler(); } } void gui_main(void) { static lv_disp_draw_buf_t disp_buf; // contains internal graphic buffer(s) called draw buffer(s) static lv_disp_drv_t disp_drv; // contains callback functions ESP_LOGI(GUI_TAG, "Initialize LVGL library"); lv_init(); // alloc draw buffers used by LVGL // it's recommended to choose the size of the draw buffer(s) to be at least // 1/10 screen sized lv_color_t *buf1 = malloc(EXAMPLE_LCD_H_RES * 20 * sizeof(lv_color_t)); assert(buf1); lv_color_t *buf2 = malloc(EXAMPLE_LCD_H_RES * 20 * sizeof(lv_color_t)); assert(buf2); // initialize LVGL draw buffers lv_disp_draw_buf_init(&disp_buf, buf1, buf2, EXAMPLE_LCD_H_RES * 20); ESP_LOGI(GUI_TAG, "Register display driver to LVGL"); lv_disp_drv_init(&disp_drv); disp_drv.hor_res = EXAMPLE_LCD_H_RES; disp_drv.ver_res = EXAMPLE_LCD_V_RES; disp_drv.flush_cb = example_lvgl_flush_cb; disp_drv.draw_buf = &disp_buf; disp_drv.rounder_cb = example_lvgl_rounder; disp_drv.set_px_cb = example_lvgl_set_px_cb; lv_disp_t *disp = lv_disp_drv_register(&disp_drv); ESP_LOGI(GUI_TAG, "Install LVGL tick timer"); // Tick interface for LVGL (using esp_timer to generate 2ms periodic event) const esp_timer_create_args_t lvgl_tick_timer_args = { .callback = &example_increase_lvgl_tick, .name = "lvgl_tick"}; esp_timer_handle_t lvgl_tick_timer = NULL; ESP_ERROR_CHECK(esp_timer_create(&lvgl_tick_timer_args, &lvgl_tick_timer)); ESP_ERROR_CHECK(esp_timer_start_periodic(lvgl_tick_timer, EXAMPLE_LVGL_TICK_PERIOD_MS * 1000)); ESP_LOGI(GUI_TAG, "Display LVGL Scroll Text"); example_lvgl_demo_ui(disp); xTaskCreate(gui_tick, "gui_tick", 4096, (void *)NULL, 5, NULL); }