GUI < IoT_Course_English

Tags: view all tags
---+ Graphical User Interface on the !IoT node
---++ Introduction

The 2.4 " display has a pixel resolution of 320x240 pixels. It is controlled by an ili9431 display driver and provides a touch screen based on the xpt2046 controller. Information about the display and its pin-outs can be found at https://docs.wemos.cc/en/latest/d1_mini_shield/tft_2_4.html.

With a high resolution screen and a touch screen the display can be used to provide a local <b>G</b>raphical <b>U</b>ser <b>I</b>nterface (!GUI) for your !IoT project.
---++ Hardware preparation

The Lolin 2.4" display uses the following pinout:
| TFT board function | CPU Pin | |
| TFT_LED | NC* (D1,D2,D3,D4) | (GPIO 22, GPIO 21, GPIO 17(WROOM) or GPIO 25 (WROVER), GPIO 16 (WROOM) or GPIO 4 (WROVER)) |
| TFT_RST | RST* (D1,D3,D4) | (GPIO 22, GPIO 17(WROOM) or GPIO 25 (WROVER), GPIO 16 (WROOM) or GPIO 4 (WROVER)) |
| TFT_DC | D8 | GPIO 5 |
| MOSI | D7 | GPIO 23 |
| MISO | D6 | GPIO 19 |
| SCK | D5 | GPIO 18 |
| TFT_CS | D0 | GPIO 26 |
| TS_CS | (D1,D2,D3*,D4) | (GPIO 22, GPIO 21, GPIO 17(WROOM) or GPIO 25 (WROVER), GPIO 16 (WROOM) or GPIO 4 (WROVER)) |
The pins in brackets can be jumpered with solder jumpers and the "*" shows the default jumper settings. As GPIO 16 and GPIO 17 cannot be used on the WROVER and are in fact not connected to the D3 and D4 pins we must short-circuit GPIO 25 with GPIO 17 and in case GPIO 16 is used we short-circuit GPIO 4 with GPIO 16. In order to drive the pins GPIO 4 and 25 will then be used in the program.
---++ New pin defaults

I modified the ili9431 driver for lvgl (lib/lv_bindings/drivers/esp32/ili9XXX) to reflect the above pin-outs:

=miso=19, mosi=23, clk=18, cs=26, dc=5, rst=-1, power=-1, backlight=-1, spihost=esp.VSPI_HOST, mhz=40, factor=4, hybrid=True=

A graphical user interface library [[lvgl]] has been developed in C and is now available with a !MicroPython binding, such that the library structs and functions are available in !MicroPython. In order for this to work we need a modified [[https://github.com/lvgl/lv_micropython][!MicroPython binary]] with [[https://github.com/lvgl/lvgl][lvgl]] and the [[https://github.com/lvgl/lv_binding_micropython][lv_bindings]] included in the code. The original lvgl documentation is available at [[https://docs.lvgl.io/v7/en/html/intro/index.html][https://docs.lvgl.io/v7/en/html/intro/index.html.]]

The same text but adapted to the !MicroPython binding will be available on this TWiki (currently under development)

-- %USERSIG{UliRaich - 2020-10-23}%

---++ Comments

%COMMENT%
Topic revision: r3 - 2021-02-06 - UliRaich