ESP32/ESP32-S3 + ESP-IDF + LVGL8.X + LOVYANGFX

Design adapts to all 3 screen resolution without any code changes.

3 sample configuration included already with just a header file to show how its done easily.

1. Unexpected Maker FeatherS3 (ESP32-S3) + Adafruit 2.4" TFT Featherwing
2. Unexpected Maker TinyS3 (ESP32-S3) + 1.3" TFT - ST7789 240x240
3. Wireless Tag WT32-SC01 (3.5" TFT Touch Display)

Some features included

• Support for updating UI from different tasks lvgl_acquire/lvgl_release
• UI code separation into gui.hpp
• Same UI code which adapts to different resolutions - here
• Supports shared SPI bus for SD Card - here
• This Readme below explains how to have same project target different ESP32 controller.
• Switch between devices using just a header file inclusion - here
• Add your own controller/display with just a header change - here
• Shows battery meter animation using timer - here
• Shows SD card status change with icon
• Switch theme between Light & Dark - here
• Scrolling long message in footer - here
• Rotate screen 180deg here

Demo of LVGL Widgets + SD SPI working together

1. Unexpected Maker FeatherS3
2. Adafruit 2.4" TFT Featherwing
3. LovyanGFX Display & Touch Driver
4. LVGL 8.3.0 UI Widgets
   

Demo of LVGL Widgets

1. Unexpected Maker TinyS3
2. 1.3" TFT - ST7789 240x240
3. LovyanGFX Display & Touch Driver
4. LVGL 8.3.0 UI Widgets
   

Demo of LVGL Widgets using Wireless Tag WT32-SC01 with Capacitive Touch

1. Wireless Tag WT32-SC01 (3.5" TFT Touch Display)
2. LovyanGFX Display & Touch Driver
3. LVGL 8.3.0 UI Widgets
   

Get Started

Git clone and recursively update submodule

# Clone repo and update submodules (LovyanGFX + LVGL)
git clone https://github.com/sukesh-ak/LVGL8x-SDSPI.git
cd LVGL8x-SDSPI-Template
git submodule update --init --recursive

# Update submodules (LovyanGFX + LVGL)
git submodule foreach git pull

Separate build folder for ESP32 & ESP32-S3

Check settings in CMakeLists.txt here

WT32-SC01 - ESP32

# set target and build,flash,monitor
idf.py -B build-esp32 set-target esp32 build
idf.py -B build-esp32 -p COM6 flash monitor

FeatherS3 - ESP32-S3

# set target and build,flash,monitor
idf.py -B build-esp32s3 set-target esp32s3 build
idf.py -B build-esp32s3 -p COM3 app-flash monitor

Setup custom lvgl config - ESP-IDF

Check settings in CMakeLists.txt here

#LVGL custom config file setup
idf_build_set_property(COMPILE_OPTIONS "-DLV_CONF_INCLUDE_SIMPLE=1" APPEND)
idf_build_set_property(COMPILE_OPTIONS "-I../main" APPEND)

Display Compile Time Information

Check settings in CMakeLists.txt here

# Display Compile Time Information
message(STATUS "--------------Compile Info------------")
message(STATUS "IDF_PATH = ${IDF_PATH}")
message(STATUS "IDF_TARGET = ${IDF_TARGET}")
message(STATUS "PROJECT_NAME = ${PROJECT_NAME}")
message(STATUS "PROJECT_DIR = ${PROJECT_DIR}")
message(STATUS "BUILD_DIR = ${BUILD_DIR}")
message(STATUS "SDKCONFIG = ${SDKCONFIG}")
message(STATUS "SDKCONFIG_DEFAULTS = ${SDKCONFIG_DEFAULTS}")
message(STATUS "CONFIG_LV_CONF_SKIP = ${CONFIG_LV_CONF_SKIP}")
message(STATUS "COMPILE_OPTIONS = ${COMPILE_OPTIONS}")
message(STATUS "---------------------------------------")
message(STATUS "CMAKE_SOURCE_DIR = ${CMAKE_SOURCE_DIR}")
message(STATUS "CMAKE_BINARY_DIR = ${CMAKE_BINARY_DIR}")
message(STATUS "---------------------------------------")