README.md
1| Supported Targets | ESP32 | ESP32-S2 | ESP32-S3 |
2| ----------------- | ----- | -------- | -------- |
3# LVGL porting example
4
5LVGL is an open-source graphics library for creating modern GUIs. It has plenty of built-in graphical elements with low memory footprint, which is friendly for embedded GUI applications.
6
7This example can be taken as a skeleton of porting the LVGL library onto the `esp_lcd` driver layer. **Note** that, this example only focuses on the display interface, regardless of the input device driver.
8
9The whole porting code is located in [this main file](main/lvgl_example_main.c), and the UI demo code is located in [another single file](main/lvgl_demo_ui.c).
10
11The UI will display two images (one Espressif logo and another Espressif text), which have been converted into C arrays by the [online converting tool](https://lvgl.io/tools/imageconverter), and will be compiled directly into application binary.
12
13This example is constructed by [IDF component manager](https://docs.espressif.com/projects/esp-idf/en/latest/esp32/api-guides/tools/idf-component-manager.html), all the external dependency will be handled by the CMake build system automatically. In this case, it will help download the lvgl from [registry](https://components.espressif.com/component/lvgl/lvgl), with the version specified in the [manifest file](main/idf_component.yml).
14
15This example uses the [esp_timer](https://docs.espressif.com/projects/esp-idf/en/latest/esp32/api-reference/system/esp_timer.html) to generate the ticks needed by LVGL. For more porting guides, please refer to [LVGL porting doc](https://docs.lvgl.io/master/porting/index.html).
16
17## How to use the example
18
19### Hardware Required
20
21* An ESP development board
22* An Intel 8080 interfaced (so called MCU interface or parallel interface) LCD
23* An USB cable for power supply and programming
24
25### Hardware Connection
26
27The connection between ESP Board and the LCD is as follows:
28
29```
30 ESP Board LCD Screen
31┌─────────────┐ ┌────────────────┐
32│ │ │ │
33│ 3V3 ├─────────────►│ VCC │
34│ │ │ │
35│ GND ├──────────────┤ GND │
36│ │ │ │
37│ DATA[0..7] │◄────────────►│ DATA[0..7] │
38│ │ │ │
39│ PCLK ├─────────────►│ PCLK │
40│ │ │ │
41│ CS ├─────────────►│ CS │
42│ │ │ │
43│ D/C ├─────────────►│ D/C │
44│ │ │ │
45│ RST ├─────────────►│ RST │
46│ │ │ │
47│ BK_LIGHT ├─────────────►│ BCKL │
48│ │ │ │
49└─────────────┘ └────────────────┘
50```
51
52The GPIO number used by this example can be changed in [lvgl_example_main.c](main/lvgl_example_main.c).
53Especially, please pay attention to the level used to turn on the LCD backlight, some LCD module needs a low level to turn it on, while others take a high level. You can change the backlight level macro `EXAMPLE_LCD_BK_LIGHT_ON_LEVEL` in [lvgl_example_main.c](main/lvgl_example_main.c).
54
55### Build and Flash
56
57Run `idf.py -p PORT build flash monitor` to build, flash and monitor the project. A fancy animation will show up on the LCD as expected.
58
59The first time you run `idf.py` for the example will cost extra time as the build system needs to address the component dependencies and downloads the missing components from registry into `managed_components` folder.
60
61(To exit the serial monitor, type ``Ctrl-]``.)
62
63See the [Getting Started Guide](https://docs.espressif.com/projects/esp-idf/en/latest/get-started/index.html) for full steps to configure and use ESP-IDF to build projects.
64
65### Example Output
66
67```bash
68I (0) cpu_start: Starting scheduler on APP CPU.
69I (418) example: Turn off LCD backlight
70I (418) gpio: GPIO[2]| InputEn: 0| OutputEn: 1| OpenDrain: 0| Pullup: 0| Pulldown: 0| Intr:0
71I (428) example: Initialize Intel 8080 bus
72I (438) example: Install LCD driver of st7789
73I (558) example: Turn on LCD backlight
74I (558) example: Initialize LVGL library
75I (558) example: Register display driver to LVGL
76I (558) example: Install LVGL tick timer
77I (558) example: Display LVGL animation
78```
79
80
81## Troubleshooting
82
83For any technical queries, please open an [issue] (https://github.com/espressif/esp-idf/issues) on GitHub. We will get back to you soon.
