board/main/gui.c

#pragma once

#include <stdio.h>

#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);
  lv_obj_clear_flag(wifi_label, LV_OBJ_FLAG_HIDDEN);
  lv_label_set_text(wifi_label, APP_WIFI_GOOD_SYMBOL);
  vTaskDelay(100 / 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);
  lv_obj_clear_flag(desktop_label, LV_OBJ_FLAG_HIDDEN);
  lv_label_set_text(desktop_label, APP_CONNECTED_SYMBOL);
  vTaskDelay(100 / 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);
}