ESP32-2432S028 mit 2.8" Touchscreen (Cheap Yellow Display)
Dialoge entwerfen mit der LVGL Library

Bevor ihr mit diesem Artikel startet, solltet ihr euch zuerst ein wenig einlesen und die Hardware und das Pinout des TouchScreen-ESP32 kennenlernen.

Außerdem solltet ihr euch eine Entwicklungsumgebung mit PlatformIO einrichten, wie in diesem Artikel besprochen. Danach solltet ihr noch den Artikel Programmierung des Displays mit der TFT_eSPI-Library lesen, indem wir etwas auf dem Display ausgeben.

Sowie den Artikel über die Programmierung des Touchscreen Digitizer XPT2046, der im Cheap Yellow Display steckt.

Damit haben wir alles, um Text und Grafiken auf dem Touchscreen-ESP32 darzustellen und auf Tipper auf den Touchscreen zu reagieren.

Wir könnten uns damit die Mühe machen, kleine Dialogelemente wie zum Beispiel Buttons mit drawRoundRect() aus der TFT_eSPI-Libary auf den Bildschirm zu zeichnen und dann in einer Schleife abzufragen, ob darauf getippt wurde.

Aber wozu das Rad neu erfinden, wenn es schon etwas fertiges gibt, das einen sehr professionellen Eindruck macht? Als wir das CYD das erste mal eingeschaltet haben, sollte uns die LVGL-Demo begrüßt haben, die viele, gut aussehende Dialogelemente zeigte.

Wie man die LGVL Library einbindet erfahrt ihr in diesem Artikel. Wir bereiten darin alles vor, um eigene Dialoge verwenden zu können. Zum Beweis, dass alles läuft, kompilieren wir die Demo, die wir vom Auslieferungszustand her kennen.

Eigene Dialoge mit der LVGL Library entwerfen und programmieren

Bisher war das ein langer Weg, aber nun haben wir alles, was wir für eigene Dialoge benötigen.

Wir wollen zu Anfang gleich mal ein paar Begriffe definieren, damit es im weiteren Verlauf des Artikels schneller geht, etwas zu erklären:
Wie geht man aber am Besten vor, um einen Dialog zu entwerfen und programmieren? Für mich hat sich die folgende Vorgehensweise bewährt.

1. Entwurf von Dialogen auf dem Papier


Erst einmal mache ich mir Gedanken, was ich alles abfragen will und was damit in den Dialog gehört. Dann schnapp ich mir ein Stück Schmierpapier und zeichne darauf grob den Dialog auf. Das muss nicht schön sein. Das soll schnell gehen und wenn irgendwo was nicht passt, dann nehme ich Entwurf 1 und übertrage die richtig platzierten Dialogelemente auf Entwurf 2 und schmeisse No. 1 dann weg. Oder ich benutze Bleistift und Radiergummi.

Außerdem mache ich mir Gedanken, wo die einzelnen Dialoge hin sollen, ob ich sie zentriert oder linksbündig und untereinander ausrichte.

In dem Beispiel rechts habe ich alles zentriert ausgerichtet. Ganz oben und ganz unten soll ein Text stehen, der vor dem Dialog via TFT_eSPI geschrieben wurde. Ich will schauen, ob man LVGL und TFT_eSPI gleichzeitig benutzen kann und ob etwas überschrieben wird. Darum gibt es auch noch einmal einen Text in der 2. Zeile, der alle 5 ms nach dem LVGL-Handle-Aufruf neu geschrieben wird. Damit will ich sehen, ob es damit möglich ist und ob das flackert.

Daran schließen sich drei Buttons an: einen Block-Button, der ein Label rechts davon hochzählt, ein Toggle-Button, der seien Farbe bei jedem Click ändern sollte und einen Next-Button, mit dem es zum nächsten Screen geht.

Wenn ich will, kann ich zumindestens den Dialogelemente, auf die ich im Code noch einmal zugreifen muss, einen Namen geben und diesen daneben schreiben. Das erleichtert später die Programmierung.

2. Übertragen des Dialogentwurfs in eine Screen-Funktion

An meiner fertigen Zeichnung sehe ich in etwa auch die Positionen der einzelnen Elemente bzw. die Koordinaten.

Je nach Bildschirmorientierung haben wir 320x240 (Querformat) oder 240x320 (Hochkant) Pixel zur Verfügung. Aber die LVGL hat ein besonderes Feature: Die Screen können auch wesentlich breiter oder höher sein. LVGL zeigt dann nur einen Ausschnitt an und lässt den User scrollen, wie das auf dem Smartphone üblich ist. Nur, dass es mit einem resistiven Touchscreen wesentlich weniger Spaß macht. Das erledigt LVGL alles komplett von selbst.

Aber auch, wenn wir die 320x240 bzw. 240x320 nicht überschreiten wollen, macht dieses Feature ein besonderes Koordinatensystem notwendig. Darum gilt: Die Bidschirmmitte ist 0, 0 (x,y). Bei Querformat (320x240) ist also die oberste Zeile 0-240/2, also -120, die Mitte 0 und die unterste Zeile 0+240/2-1, also 119.

Koordinatensystem LVGL bei 320x200:

 ↖ -160, -120 ↖ 0, -120
 ↖-160, 0 ↖ 0, 0
 ↖ -160, 119  ↖ 0, 119  ↖ 159, 119  ↖ 159, 0  ↖ 159, -120


Desweiteren können wir bei Dialogelementen noch wählen, auf welchen Punkt sich unsere Positionierung beziehen soll, auf die Ecke oben links des Widgets, oder doch lieber auf die Mitte. Bei zentrierten Widgets empfiehlt sich natürlich die Mitte, dann ist ein bei den Screenkordinaten 0,0 zentriert ausgerichtetes Widgets genau in der Bildschirmmitte, ohne dass wir groß mit den Koordinaten rumprobieren müssen.

Und dann müssen wir eigentlich nur noch den Abstand zwischen den Elementen festlegen, um diese perfekt zentriert auszurichten.

Bei linksbündig ausgerichteten Element wählen wir natürlich linksbündig und überall den gleichen X-Wert mit sich erhöhendem Y-Wert.

Gießen wir einen unserer Buttons nun in Code:
void show_screen1 () { lv_obj_t *label; lv_obj_t *btn1 = lv_button_create(lv_screen_active()); lv_obj_add_event_cb(btn1, evt_s1_btn1, LV_EVENT_ALL, NULL); lv_obj_align(btn1, LV_ALIGN_CENTER, 0, -40); lv_obj_remove_flag(btn1, LV_OBJ_FLAG_PRESS_LOCK); label = lv_label_create(btn1); lv_label_set_text(label, "Click-Button"); lv_obj_center(label); ... }

Alle für einen Dialog / Screen zu erstellenden Widgets fassen wir in einer Funktion zusammen. Der Einfachheit halber nenne ich die Funktion für den ersten Screen show_screen1().

Dann erzeugen wir uns ein Label-Objekt für die Button-Beschriftung (lv_obj_t *label;) und erhalten einen Objekt-Pointer zurück. Da wir die Labels später nicht ändern wollen, können wir den Zeiger mehrmals verwenden, er wird dann halt immer wieder mit einem neuen Objekt überschrieben.

Im nächsten Abschnitt erzeugen wir uns einen Button unter dem Objekt-Pointer *btn1, und zwar auf dem gerade aktiven Screen. Wir benutzen hier nur einen (keep it simple), mehr brauchen wir erst einmal nicht.

Unter dem Button1-Objekt registrieren wir eine Event-Funktion, die wir dann gleich noch schreiben müssen. Diese wird aufgerufen, wenn LVGL feststellt, dass jemand auf den Button getappt hat.

Dann geben wir noch die Koordinaten mit (x=0, y=-40) und entfernen die Objekt Eigenschaft LV_OBJ_FLAG_PRESS_LOCK. Die würde normalerweise bewirkt, dass der Button als gedrückt gilt, wenn er einmal niedergedrückt wird, auch wenn während des Drückens der Button-Bereich wieder verlassen wird, man also sozusagen abrutscht. Die Funktionalität, die ein wenig Sicherheit schafft, wenn man merkt, dass man sich "verdrückt" hat, wollen wir aber behalten. Darum löschen wir dieses Flag.

Im nächsten Abschnitt erzeugen wir ein Label für den Button und weisen ihn ihm zu. Die Button-Beschriftung soll mittig sein. Besonders praktisch: LVGL passt die Button-Breite automatisch dem Label-Text an, da müssen wir uns um nichts weiter kümmern.

In Screen1 definieren wir außerdem noch ein weiteres Label rechts neben dem Click-Button mit einem Zähler, der jedesmal hochgezählt werden soll, wenn wir Button1 drücken. Dazu müssen wir den Text des Labels von außerhalb ändern können, darum speichern wir den Objekt-Pointer für das Label außerhalb der Funktionen, also global: lv_obj_t* s1_lab1 = NULL;

Dadurch können wir auch in anderen Funktionen darauf zugreifen. Merke: Jedes Objekt, auf das wir später noch einmal außerhalb der eigenen Event-Funktion zugreifen müssen, braucht einen globalen Objekt-Pointer.

Ein Beispiel dafür wird gleich in der Event-Funktion folgen. Schreiben wir aber erst noch unsere showScreen1-Funktion zuende.


Button 2 ist unser Toggle-Button. Damit kann man etwas einfach an- oder ausschalten. Inaktiv ist der Button blau, aktiv ist er rot. Wir müssen nur das Flag lv_obj_add_flag(btn2, LV_OBJ_FLAG_CHECKABLE); setzen, um einen Button umschaltbar machen, der Rest ist wie bei Button 1. Mit dem State LV_STATE_CHECKED können wir in der zugehörigen Event-Funktion zu Button 2 dann abfragen, wie der derzeitige Status des Togglings ist und darauf reagieren.

Der Button 3 ist der Weiter-Button und unterscheidet sich in der Definition nicht von Button 1. Außer vielleicht dadurch, dass ich ihn btn_weiter nenne und mehrmals verwende, nämlich an Ende jeden Screens. Damit schalte ich von einem Dialog zum nächsten.

Hier der komplette Sourcecode zu Screen1 zum nachvollziehen:

show_screen1() (klicken, um diesen Abschnitt auf- und zuzuklappen)
void show_screen1 () { lv_obj_t *label; lv_obj_t *btn1 = lv_button_create(lv_screen_active()); lv_obj_add_event_cb(btn1, evt_s1_btn1, LV_EVENT_ALL, NULL); lv_obj_align(btn1, LV_ALIGN_CENTER, 0, -40); lv_obj_remove_flag(btn1, LV_OBJ_FLAG_PRESS_LOCK); label = lv_label_create(btn1); lv_label_set_text(label, "Click-Button"); lv_obj_center(label); lv_obj_t *btn2 = lv_button_create(lv_screen_active()); lv_obj_add_event_cb(btn2, evt_s1_btn2, LV_EVENT_ALL, NULL); lv_obj_align(btn2, LV_ALIGN_CENTER, 0, 10); lv_obj_remove_flag(btn2, LV_OBJ_FLAG_PRESS_LOCK); lv_obj_add_flag(btn2, LV_OBJ_FLAG_CHECKABLE); lv_obj_set_height(btn2, LV_SIZE_CONTENT); label = lv_label_create(btn2); lv_label_set_text(label, "Toggle-Button"); lv_obj_center(label); lv_obj_t *btn_weiter = lv_button_create(lv_screen_active()); lv_obj_add_event_cb(btn_weiter, evt_btn_weiter, LV_EVENT_ALL, NULL); lv_obj_align(btn_weiter, LV_ALIGN_CENTER, 0, 70); lv_obj_remove_flag(btn_weiter, LV_OBJ_FLAG_PRESS_LOCK); label = lv_label_create(btn_weiter); lv_label_set_text(label, "Goto next screen"); lv_obj_center(label); s1_lab1 = lv_label_create(lv_screen_active()); lv_label_set_long_mode(s1_lab1, LV_LABEL_LONG_WRAP); // Break long lines lv_label_set_text(s1_lab1, "0"); lv_obj_set_width(s1_lab1, 50); /*Set smaller width to make the lines wrap*/ lv_obj_set_style_text_align(s1_lab1, LV_TEXT_ALIGN_CENTER, 0); lv_obj_align(s1_lab1, LV_ALIGN_CENTER, 120, -40); }

Die rechts zu sehenden Textzeilen oben und unten stammen wie gesagt von der TFT-eSPI Library und wie man sieht, wird ein Teil davon durch LVGL gelöscht / überschrieben. Doch dazu später mehr.

3. Event-Funktionen schreiben

Die zum Beispiel via lv_obj_add_event_cb(btn1, evt_s1_btn1, LV_EVENT_ALL, NULL); registrierten Event-Funktionen müssen natürlich noch geschrieben werden. Da es für jeden Button und jedes Eingabeelement eine Event-Funktion gibt, sollte man sich vorher ein Namenskonzept zurechtlegen, um die richtigen Funktionen leicht wiederfinden zu können.

evt_s1_btn1 setzt sich dabei zusammen aus "evt" als Kennzeichen einer Event-Funktion (in der alphabetischen Gliederung von Platform IO dann leichter zu finden), "s1" für Screen1, also den Dialog und "btn1" für Button1, das Dialogelement in Screen1 ansich. So verliert man auch bei mehrere Dutzend Dialogelemente nicht den ÜBerblick.

Der Code für evt_s1_btn1() sieht so aus:
lv_obj_t* s1_lab1 = NULL; int s1_cnt = 0; static void evt_s1_btn1(lv_event_t *e) { lv_event_code_t code = lv_event_get_code(e); if(code == LV_EVENT_CLICKED) { LV_LOG_USER("Button 1 clicked"); s1_cnt++; if (s1_lab1 != NULL) { lv_label_set_text_fmt(s1_lab1, "%d", s1_cnt); } } }
Außerhalb der Funktion sind der globale Objekt-Pointer s1_lab1 angelegt, den wir in showScreen1() mit einem Objekt "beseelen". Damit wir überprüfen können, ob das Objekt evtl. noch nicht oder nicht mehr gesetzt ist, setzen wir es anfangs auf NULL, um darauf abfragen zu können und Resets zu vermeiden. Für das Hochzählen selbst definieren wir eine int-Variable namens s1_cnt (cnt für counter, Zähler).

LVGL übergibt uns ein Objekt lv_event_t *e. e für event können wir dann für Abfrage-Funktionen benutzen, wovon die wichtigste lv_event_get_code() ist, die uns mitteilt, was das Ereignis ausgelöst hat, wie z. B. LV_EVENT_CLICKED oder LV_EVENT_FOCUSED. Damit wissen wir dann, wie wir auf das Ereignis reagieren sollen.

In unserem Beispiel wird überprüft, ob der Button gedrückt wurde und falls ja, wird der s1_cnt hochgezählt und der Text des Label s1_lab1 mit dem neuen Wert aktualisiert. An dieser Stelle zeigt sich auch, wie wichtig es ist, s1_lab1 global definiert zu haben, denn sonst täten wir uns schwer, auf das Label zuzugreifen.

Jedes mal, wenn der User auf den Button1 klickt, wird nun unser Event aufgerufen und erhöht den Zähler und zeigt ihn an. Beim nächsten LVGL-Handler-Aufruf wird der Unterschied dann durch LVGL bemerkt und der Dialog neu gezeichnet.

4. LVGL-Dialoge und TFT_eSPI-Inhalte mixen / gleichzeitig anzeigen


Grundsätzlich ist es möglich, LVGL-Dialoge und TFT_eSPI gleichzeitig anzuzeigen. Man muss aber ein paar Kleinigkeit beachten und was das ist, auch dazu dient das heutige Beispielprogramm.

Man kann den Bildschirm schon mit tft.fillScreen(TFT_BLUE); löschen, aber LVGL löscht den Bildschirm von sich aus beim ersten handleLVGL() noch einmal von sich selbst aus, und zwar in der durch die Farbe des Themes, das in lv_conf.h definiert ist. Bei mir ist das (wegen #define LV_THEME_DEFAULT_DARK 1 in Zeile 590) das Dark Theme. Dort ist standardmäßig ein dunkles Grau als Hintergrundfarbe eingestellt.

Dieses grau war mir noch zu hell, ich wollte es einfach komplett schwarz haben, was man durch lv_obj_set_style_bg_color(lv_screen_active(), lv_color_hex(TFT_BLACK), LV_PART_MAIN); erreichen kann. Dann wir bei handleLVGL() der Hintergrund auf tiefschwarz gelöscht, das selbe tiefschwarz, wie ich es bei TFT-eSPI auch verwende.

Man kann auch den LVGL-Hintergrund auf transparent setzen. Das war meine Hoffnung, LVGL und TFT_eSPI nebeneinander zu benutzen, aber das sah gar nicht aus: ich hatte auf einmal Geister-Buttons.

Wenn ich
show_screen1(); tft.drawCentreString("Text from TFT_eSPI at beginning for 2s", TFT_HEIGHT/2, 5, 2); tft.drawCentreString("Text from TFT_eSPI at beginning for 2s", TFT_HEIGHT/2, 220, 2);
benutze, habe ich links oben ein schwarzes Loch und zwar genau in der Größe von Button3. Jetzt könnte man natürlich den TFT_eSPI-Text immer neu schreiben:
while (!is_btn_weiter_pressed) { handleLVGL() ; tft.drawCentreString("Text from TFT_eSPI redrawn every 5 ms", TFT_HEIGHT/2, 30, 2); }
Das funktioniert sogar ohne Geflackere.


Aber es geht auch einfacher, wenn man höllisch genau darauf achtet, wann man TFT_eSPI einsetzt. Und zwar muss man erst LVGL alle Dialogelemente erstellen lassen, einmal handleLVGL() aufrufen und dann erst mit TFT_eSPI auf den Screen schreiben.

Dann bleibt die Schrift erhalten. Man darf natürlich nicht über die LVGL-Dialogelemente mit TFT_eSPI schreiben, dann wird LVGL die Bereiche bei einem Update natürlich wieder löschen.

Aber dann kann man sich die ständige Neuschreiben des TFT_eSPI-Textes in einer Schleife auch sparen:
show_screen1(); handleLVGL(); tft.drawCentreString("Text from TFT_eSPI at beginning for 2s", TFT_HEIGHT/2, 5, 2); tft.drawCentreString("Text from TFT_eSPI at beginning for 2s", TFT_HEIGHT/2, 220, 2);

Grundsätzlich sollte man LVGL und TFT_eSPI aber nicht mischen, wenn es nicht notwendig ist. LVGL hat eigentlich so ziemlich alles, was man sich an Dialogelemente wünschen kann und es sollte nur in Ausnahmefällen notwendig werden, beide System miteinander zu mischen.

5. Mehr als einen Dialog anzeigen


Wenn wir auf den Weiter-Button klicken, soll der zweite Dialog angezeigt werden. Es reicht allerdings nicht, den Bilschirm zu löschen und showScreen2 aufzurufen, denn dann sind die Dialogelemente zwar nicht mehr sichtbar, aber für LVGL immer noch da.

Das heißt, wenn ich in den schwarzen Bereich klicke, in dem mal der Toogle-Button war, dann registriert LVGL den Klick und zeigt den Button wieder an.

Auch die Dialogelemente selbst müssen darum gelöscht werden. Wenn man den richtigen Befehl, nämlich lv_obj_clean (lv_screen_active()); kennt, ist das ganz einfach. Denn der löscht alle Objekte, die sich auf dem aktuelle Screen befinden (und wir haben ja nur einen).

Damit ist das Dialogsystem wieder sauber und der nächste Dialog kann erstellt und angezeit werden:
showScreen1 () ... while (!is_btn_weiter_pressed) { handleLVGL() ; tft.drawCentreString("Text from TFT_eSPI redrawn every 5 ms", TFT_HEIGHT/2, 30, 2); } is_btn_weiter_pressed = 0; tft.fillScreen(TFT_BLACK); // clear screen lv_obj_clean (lv_screen_active()); handleLVGL() ; tft.drawCentreString("done: lv_obj_clean (lv_screen_active());", TFT_HEIGHT/2, 220, 2); show_screen2();
Man sollte nur nicht den dummen Fehler machen, irgendwo im Code noch auf alte, nunmehr gelöschte Dialogelemente, zugreifen zu wollen, das wird mit einem Reset bestraft.

Der komplette Source-Code

Die platformio.ini ist so geblieben wie gehabt, außer das vielleicht die TJpg_Decoder Library wieder auskommentiert wurde.

In der lv_conf.h wurde der Dark-Mode eingeschaltet und die Demo und Example-Includes wieder auskommentiert. Wichtige Stellen sind mit "+++" markiert.

Das Logo ist nun kein JPEG mehr, sondern ein XBitmap in schwarz/weiß. Die Grafik hatte eh nur eine Farbe außer der Hintergrundfarbe und die Artefakte (kleine andersfarbige Punkte) hatten mich doch irgendwie gestört. Nun ist die Logo-Datei kleiner, das Logo sauberer und es kann in beliebigen Farben transparent gezeichnet werden.

Die wesentlichen Neuerung finden sich in main.cpp, wobei der obere Teil wie beim letzten mal, der LVGL-Demo, gleich bleibt.

platformio.ini (klicken, um diesen Abschnitt auf- und zuzuklappen)
[platformio] src_dir = . default_envs = cyd_v3 [env] platform = espressif32@6.5.0 board = esp32dev framework = arduino upload_speed = 460800 upload_port = COM17 monitor_speed = 115200 monitor_port = COM17 lib_deps = bodmer/TFT_eSPI@2.5.43 ;https://github.com/Bodmer/TJpg_Decoder https://github.com/PaulStoffregen/XPT2046_Touchscreen lvgl/lvgl@9.1.0 build_flags = ; anstatt User_Setup.h für TFT_eSPI Library -D USER_SETUP_LOADED -D ILI9341_2_DRIVER -D TFT_WIDTH=240 -D TFT_HEIGHT=320 -D USE_HSPI_PORT -D TFT_MISO=12 -D TFT_MOSI=13 -D TFT_SCLK=14 -D TFT_CS=15 -D TFT_DC=2 -D TFT_RST=-1 -D TFT_BL=21 -D TFT_BACKLIGHT_ON=HIGH -D TFT_BACKLIGHT_OFF=LOW -D LOAD_GLCD -D LOAD_FONT2 -D LOAD_FONT4 -D LOAD_FONT6 -D LOAD_FONT7 -D LOAD_FONT8 -D LOAD_GFXFF -D SMOOTH_FONT ;-D SPI_FREQUENCY=27000000 -D SPI_FREQUENCY=55000000 -D SPI_READ_FREQUENCY=20000000 -D SPI_TOUCH_FREQUENCY=2500000 ; für XPT2046_Touchscreen Library -D XPT2046_IRQ=36 -D XPT2046_MOSI=32 -D XPT2046_MISO=39 -D XPT2046_CLK=25 -D XPT2046_CS=33 ; XPT2046 Digitizer X/Y min und max -D XPT2046_XMIN=290 -D XPT2046_XMAX=3670 -D XPT2046_YMIN=230 -D XPT2046_YMAX=3860 ; Lichtsensor-Pin -D LDR_PIN=34 ; LVGL ;-D LV_CONF_PATH="${PROJECT_SRC_DIR}/lv_config.h" ;-D LV_CONF_PATH="D:/Users/admin/Documents/PlatformIO/Projects/ESP32-CYD-LVGL/src/lv_conf.h" ;-D LV_CONF_PATH="${PROJECT_INCLUDE_DIR}/lv_conf.h" ;-D LV_CONF_SKIP -D LV_HOR_RES=320 -D LV_VER_RES=240 -D TFT_HOR_RES=320 -D TFT_VER_RES=240 [env:cyd_v1] build_flags = ${env.build_flags} -D CYD_VARIANT=v1 -D TFT_INVERSION_OFF [env:cyd_v3] build_flags = ${env.build_flags} -D CYD_VARIANT=v3 -D TFT_INVERSION_ON

lv_conf.h (klicken, um diesen Abschnitt auf- und zuzuklappen)
/** * @file lv_conf.h * Configuration file for v9.1.0 */ /* * Copy this file as `lv_conf.h` * 1. simply next to the `lvgl` folder * 2. or any other places and * - define `LV_CONF_INCLUDE_SIMPLE` * - add the path as include path */ /* clang-format off */ #if 1 /*Set it to "1" to enable content*/ #ifndef LV_CONF_H #define LV_CONF_H /*If you need to include anything here, do it inside the `__ASSEMBLY__` guard */ #if 0 && defined(__ASSEMBLY__) #include "my_include.h" #endif /*==================== COLOR SETTINGS *====================*/ /*Color depth: 8 (A8), 16 (RGB565), 24 (RGB888), 32 (XRGB8888)*/ #define LV_COLOR_DEPTH 16 // #define LV_COLOR_SCREEN_TRANSP //+++ /*========================= STDLIB WRAPPER SETTINGS *=========================*/ /* Possible values * - LV_STDLIB_BUILTIN: LVGL's built in implementation * - LV_STDLIB_CLIB: Standard C functions, like malloc, strlen, etc * - LV_STDLIB_MICROPYTHON: MicroPython implementation * - LV_STDLIB_RTTHREAD: RT-Thread implementation * - LV_STDLIB_CUSTOM: Implement the functions externally */ #define LV_USE_STDLIB_MALLOC LV_STDLIB_BUILTIN #define LV_USE_STDLIB_STRING LV_STDLIB_BUILTIN #define LV_USE_STDLIB_SPRINTF LV_STDLIB_BUILTIN #if LV_USE_STDLIB_MALLOC == LV_STDLIB_BUILTIN /*Size of the memory available for `lv_malloc()` in bytes (>= 2kB)*/ #define LV_MEM_SIZE (64 * 1024U) /*[bytes]*/ /*Size of the memory expand for `lv_malloc()` in bytes*/ #define LV_MEM_POOL_EXPAND_SIZE 0 /*Set an address for the memory pool instead of allocating it as a normal array. Can be in external SRAM too.*/ #define LV_MEM_ADR 0 /*0: unused*/ /*Instead of an address give a memory allocator that will be called to get a memory pool for LVGL. E.g. my_malloc*/ #if LV_MEM_ADR == 0 #undef LV_MEM_POOL_INCLUDE #undef LV_MEM_POOL_ALLOC #endif #endif /*LV_USE_STDLIB_MALLOC == LV_STDLIB_BUILTIN*/ /*==================== HAL SETTINGS *====================*/ /*Default display refresh, input device read and animation step period.*/ #define LV_DEF_REFR_PERIOD 33 /*[ms]*/ /*Default Dot Per Inch. Used to initialize default sizes such as widgets sized, style paddings. *(Not so important, you can adjust it to modify default sizes and spaces)*/ #define LV_DPI_DEF 130 /*[px/inch]*/ /*================= * OPERATING SYSTEM *=================*/ /*Select an operating system to use. Possible options: * - LV_OS_NONE * - LV_OS_PTHREAD * - LV_OS_FREERTOS * - LV_OS_CMSIS_RTOS2 * - LV_OS_RTTHREAD * - LV_OS_WINDOWS * - LV_OS_CUSTOM */ #define LV_USE_OS LV_OS_NONE #if LV_USE_OS == LV_OS_CUSTOM #define LV_OS_CUSTOM_INCLUDE #endif /*======================== * RENDERING CONFIGURATION *========================*/ /*Align the stride of all layers and images to this bytes*/ #define LV_DRAW_BUF_STRIDE_ALIGN 1 /*Align the start address of draw_buf addresses to this bytes*/ #define LV_DRAW_BUF_ALIGN 4 /* If a widget has `style_opa < 255` (not `bg_opa`, `text_opa` etc) or not NORMAL blend mode * it is buffered into a "simple" layer before rendering. The widget can be buffered in smaller chunks. * "Transformed layers" (if `transform_angle/zoom` are set) use larger buffers * and can't be drawn in chunks. */ /*The target buffer size for simple layer chunks.*/ #define LV_DRAW_LAYER_SIMPLE_BUF_SIZE (24 * 1024) /*[bytes]*/ #define LV_USE_DRAW_SW 1 #if LV_USE_DRAW_SW == 1 /* Set the number of draw unit. * > 1 requires an operating system enabled in `LV_USE_OS` * > 1 means multiply threads will render the screen in parallel */ #define LV_DRAW_SW_DRAW_UNIT_CNT 1 /* Use Arm-2D to accelerate the sw render */ #define LV_USE_DRAW_ARM2D_SYNC 0 /* Enable native helium assembly to be compiled */ #define LV_USE_NATIVE_HELIUM_ASM 0 /* 0: use a simple renderer capable of drawing only simple rectangles with gradient, images, texts, and straight lines only * 1: use a complex renderer capable of drawing rounded corners, shadow, skew lines, and arcs too */ #define LV_DRAW_SW_COMPLEX 1 #if LV_DRAW_SW_COMPLEX == 1 /*Allow buffering some shadow calculation. *LV_DRAW_SW_SHADOW_CACHE_SIZE is the max. shadow size to buffer, where shadow size is `shadow_width + radius` *Caching has LV_DRAW_SW_SHADOW_CACHE_SIZE^2 RAM cost*/ #define LV_DRAW_SW_SHADOW_CACHE_SIZE 0 /* Set number of maximally cached circle data. * The circumference of 1/4 circle are saved for anti-aliasing * radius * 4 bytes are used per circle (the most often used radiuses are saved) * 0: to disable caching */ #define LV_DRAW_SW_CIRCLE_CACHE_SIZE 4 #endif #define LV_USE_DRAW_SW_ASM LV_DRAW_SW_ASM_NONE #if LV_USE_DRAW_SW_ASM == LV_DRAW_SW_ASM_CUSTOM #define LV_DRAW_SW_ASM_CUSTOM_INCLUDE "" #endif #endif /* Use NXP's VG-Lite GPU on iMX RTxxx platforms. */ #define LV_USE_DRAW_VGLITE 0 #if LV_USE_DRAW_VGLITE /* Enable blit quality degradation workaround recommended for screen's dimension > 352 pixels. */ #define LV_USE_VGLITE_BLIT_SPLIT 0 #if LV_USE_OS /* Enable VGLite draw async. Queue multiple tasks and flash them once to the GPU. */ #define LV_USE_VGLITE_DRAW_ASYNC 1 #endif /* Enable VGLite asserts. */ #define LV_USE_VGLITE_ASSERT 0 #endif /* Use NXP's PXP on iMX RTxxx platforms. */ #define LV_USE_DRAW_PXP 0 #if LV_USE_DRAW_PXP /* Enable PXP asserts. */ #define LV_USE_PXP_ASSERT 0 #endif /* Use Renesas Dave2D on RA platforms. */ #define LV_USE_DRAW_DAVE2D 0 /* Draw using cached SDL textures*/ #define LV_USE_DRAW_SDL 0 /* Use VG-Lite GPU. */ #define LV_USE_DRAW_VG_LITE 0 #if LV_USE_DRAW_VG_LITE /* Enable VG-Lite custom external 'gpu_init()' function */ #define LV_VG_LITE_USE_GPU_INIT 0 /* Enable VG-Lite assert. */ #define LV_VG_LITE_USE_ASSERT 0 /* VG-Lite flush commit trigger threshold. GPU will try to batch these many draw tasks. */ #define LV_VG_LITE_FLUSH_MAX_COUNT 8 /* Enable border to simulate shadow * NOTE: which usually improves performance, * but does not guarantee the same rendering quality as the software. */ #define LV_VG_LITE_USE_BOX_SHADOW 0 /* VG-Lite gradient image maximum cache number. * NOTE: The memory usage of a single gradient image is 4K bytes. */ #define LV_VG_LITE_GRAD_CACHE_SIZE 32 #endif /*======================= * FEATURE CONFIGURATION *=======================*/ /*------------- * Logging *-----------*/ /*Enable the log module*/ //+++ #define LV_USE_LOG 1 #if LV_USE_LOG /*How important log should be added: *LV_LOG_LEVEL_TRACE A lot of logs to give detailed information *LV_LOG_LEVEL_INFO Log important events *LV_LOG_LEVEL_WARN Log if something unwanted happened but didn't cause a problem *LV_LOG_LEVEL_ERROR Only critical issue, when the system may fail *LV_LOG_LEVEL_USER Only logs added by the user *LV_LOG_LEVEL_NONE Do not log anything*/ #define LV_LOG_LEVEL LV_LOG_LEVEL_WARN /*1: Print the log with 'printf'; *0: User need to register a callback with `lv_log_register_print_cb()`*/ #define LV_LOG_PRINTF 0 /*1: Enable print timestamp; *0: Disable print timestamp*/ #define LV_LOG_USE_TIMESTAMP 1 /*1: Print file and line number of the log; *0: Do not print file and line number of the log*/ #define LV_LOG_USE_FILE_LINE 1 /*Enable/disable LV_LOG_TRACE in modules that produces a huge number of logs*/ #define LV_LOG_TRACE_MEM 1 #define LV_LOG_TRACE_TIMER 1 #define LV_LOG_TRACE_INDEV 1 #define LV_LOG_TRACE_DISP_REFR 1 #define LV_LOG_TRACE_EVENT 1 #define LV_LOG_TRACE_OBJ_CREATE 1 #define LV_LOG_TRACE_LAYOUT 1 #define LV_LOG_TRACE_ANIM 1 #define LV_LOG_TRACE_CACHE 1 #endif /*LV_USE_LOG*/ /*------------- * Asserts *-----------*/ /*Enable asserts if an operation is failed or an invalid data is found. *If LV_USE_LOG is enabled an error message will be printed on failure*/ #define LV_USE_ASSERT_NULL 1 /*Check if the parameter is NULL. (Very fast, recommended)*/ #define LV_USE_ASSERT_MALLOC 1 /*Checks is the memory is successfully allocated or no. (Very fast, recommended)*/ #define LV_USE_ASSERT_STYLE 0 /*Check if the styles are properly initialized. (Very fast, recommended)*/ #define LV_USE_ASSERT_MEM_INTEGRITY 0 /*Check the integrity of `lv_mem` after critical operations. (Slow)*/ #define LV_USE_ASSERT_OBJ 0 /*Check the object's type and existence (e.g. not deleted). (Slow)*/ /*Add a custom handler when assert happens e.g. to restart the MCU*/ #define LV_ASSERT_HANDLER_INCLUDE #define LV_ASSERT_HANDLER while(1); /*Halt by default*/ /*------------- * Debug *-----------*/ /*1: Draw random colored rectangles over the redrawn areas*/ #define LV_USE_REFR_DEBUG 0 /*1: Draw a red overlay for ARGB layers and a green overlay for RGB layers*/ #define LV_USE_LAYER_DEBUG 0 /*1: Draw overlays with different colors for each draw_unit's tasks. *Also add the index number of the draw unit on white background. *For layers add the index number of the draw unit on black background.*/ #define LV_USE_PARALLEL_DRAW_DEBUG 0 /*------------- * Others *-----------*/ #define LV_ENABLE_GLOBAL_CUSTOM 0 #if LV_ENABLE_GLOBAL_CUSTOM /*Header to include for the custom 'lv_global' function"*/ #define LV_GLOBAL_CUSTOM_INCLUDE #endif /*Default cache size in bytes. *Used by image decoders such as `lv_lodepng` to keep the decoded image in the memory. *If size is not set to 0, the decoder will fail to decode when the cache is full. *If size is 0, the cache function is not enabled and the decoded mem will be released immediately after use.*/ #define LV_CACHE_DEF_SIZE 0 /*Default number of image header cache entries. The cache is used to store the headers of images *The main logic is like `LV_CACHE_DEF_SIZE` but for image headers.*/ #define LV_IMAGE_HEADER_CACHE_DEF_CNT 0 /*Number of stops allowed per gradient. Increase this to allow more stops. *This adds (sizeof(lv_color_t) + 1) bytes per additional stop*/ #define LV_GRADIENT_MAX_STOPS 2 /* Adjust color mix functions rounding. GPUs might calculate color mix (blending) differently. * 0: round down, 64: round up from x.75, 128: round up from half, 192: round up from x.25, 254: round up */ #define LV_COLOR_MIX_ROUND_OFS 0 /* Add 2 x 32 bit variables to each lv_obj_t to speed up getting style properties */ #define LV_OBJ_STYLE_CACHE 0 /* Add `id` field to `lv_obj_t` */ #define LV_USE_OBJ_ID 0 /* Use lvgl builtin method for obj ID */ #define LV_USE_OBJ_ID_BUILTIN 0 /*Use obj property set/get API*/ #define LV_USE_OBJ_PROPERTY 0 /* VG-Lite Simulator */ /*Requires: LV_USE_THORVG_INTERNAL or LV_USE_THORVG_EXTERNAL */ #define LV_USE_VG_LITE_THORVG 0 #if LV_USE_VG_LITE_THORVG /*Enable LVGL's blend mode support*/ #define LV_VG_LITE_THORVG_LVGL_BLEND_SUPPORT 0 /*Enable YUV color format support*/ #define LV_VG_LITE_THORVG_YUV_SUPPORT 0 /*Enable 16 pixels alignment*/ #define LV_VG_LITE_THORVG_16PIXELS_ALIGN 1 /*Buffer address alignment*/ #define LV_VG_LITE_THORVG_BUF_ADDR_ALIGN 64 /*Enable multi-thread render*/ #define LV_VG_LITE_THORVG_THREAD_RENDER 0 #endif /*===================== * COMPILER SETTINGS *====================*/ /*For big endian systems set to 1*/ #define LV_BIG_ENDIAN_SYSTEM 0 /*Define a custom attribute to `lv_tick_inc` function*/ #define LV_ATTRIBUTE_TICK_INC /*Define a custom attribute to `lv_timer_handler` function*/ #define LV_ATTRIBUTE_TIMER_HANDLER /*Define a custom attribute to `lv_display_flush_ready` function*/ #define LV_ATTRIBUTE_FLUSH_READY /*Required alignment size for buffers*/ #define LV_ATTRIBUTE_MEM_ALIGN_SIZE 1 /*Will be added where memories needs to be aligned (with -Os data might not be aligned to boundary by default). * E.g. __attribute__((aligned(4)))*/ #define LV_ATTRIBUTE_MEM_ALIGN /*Attribute to mark large constant arrays for example font's bitmaps*/ #define LV_ATTRIBUTE_LARGE_CONST /*Compiler prefix for a big array declaration in RAM*/ #define LV_ATTRIBUTE_LARGE_RAM_ARRAY /*Place performance critical functions into a faster memory (e.g RAM)*/ #define LV_ATTRIBUTE_FAST_MEM /*Export integer constant to binding. This macro is used with constants in the form of LV_ that *should also appear on LVGL binding API such as Micropython.*/ #define LV_EXPORT_CONST_INT(int_value) struct _silence_gcc_warning /*The default value just prevents GCC warning*/ /*Prefix all global extern data with this*/ #define LV_ATTRIBUTE_EXTERN_DATA /* Use `float` as `lv_value_precise_t` */ #define LV_USE_FLOAT 0 /*================== * FONT USAGE *===================*/ /*Montserrat fonts with ASCII range and some symbols using bpp = 4 *https://fonts.google.com/specimen/Montserrat*/ #define LV_FONT_MONTSERRAT_8 0 #define LV_FONT_MONTSERRAT_10 0 #define LV_FONT_MONTSERRAT_12 0 #define LV_FONT_MONTSERRAT_14 1 #define LV_FONT_MONTSERRAT_16 0 #define LV_FONT_MONTSERRAT_18 0 #define LV_FONT_MONTSERRAT_20 0 #define LV_FONT_MONTSERRAT_22 0 #define LV_FONT_MONTSERRAT_24 0 #define LV_FONT_MONTSERRAT_26 0 #define LV_FONT_MONTSERRAT_28 0 #define LV_FONT_MONTSERRAT_30 0 #define LV_FONT_MONTSERRAT_32 0 #define LV_FONT_MONTSERRAT_34 0 #define LV_FONT_MONTSERRAT_36 0 #define LV_FONT_MONTSERRAT_38 0 #define LV_FONT_MONTSERRAT_40 0 #define LV_FONT_MONTSERRAT_42 0 #define LV_FONT_MONTSERRAT_44 0 #define LV_FONT_MONTSERRAT_46 0 #define LV_FONT_MONTSERRAT_48 0 /*Demonstrate special features*/ #define LV_FONT_MONTSERRAT_28_COMPRESSED 0 /*bpp = 3*/ #define LV_FONT_DEJAVU_16_PERSIAN_HEBREW 0 /*Hebrew, Arabic, Persian letters and all their forms*/ #define LV_FONT_SIMSUN_16_CJK 0 /*1000 most common CJK radicals*/ /*Pixel perfect monospace fonts*/ #define LV_FONT_UNSCII_8 0 #define LV_FONT_UNSCII_16 0 /*Optionally declare custom fonts here. *You can use these fonts as default font too and they will be available globally. *E.g. #define LV_FONT_CUSTOM_DECLARE LV_FONT_DECLARE(my_font_1) LV_FONT_DECLARE(my_font_2)*/ #define LV_FONT_CUSTOM_DECLARE /*Always set a default font*/ #define LV_FONT_DEFAULT &lv_font_montserrat_14 /*Enable handling large font and/or fonts with a lot of characters. *The limit depends on the font size, font face and bpp. *Compiler error will be triggered if a font needs it.*/ #define LV_FONT_FMT_TXT_LARGE 0 /*Enables/disables support for compressed fonts.*/ #define LV_USE_FONT_COMPRESSED 0 /*Enable drawing placeholders when glyph dsc is not found*/ #define LV_USE_FONT_PLACEHOLDER 1 /*================= * TEXT SETTINGS *=================*/ /** * Select a character encoding for strings. * Your IDE or editor should have the same character encoding * - LV_TXT_ENC_UTF8 * - LV_TXT_ENC_ASCII */ #define LV_TXT_ENC LV_TXT_ENC_UTF8 /*Can break (wrap) texts on these chars*/ #define LV_TXT_BREAK_CHARS " ,.;:-_)]}" /*If a word is at least this long, will break wherever "prettiest" *To disable, set to a value <= 0*/ #define LV_TXT_LINE_BREAK_LONG_LEN 0 /*Minimum number of characters in a long word to put on a line before a break. *Depends on LV_TXT_LINE_BREAK_LONG_LEN.*/ #define LV_TXT_LINE_BREAK_LONG_PRE_MIN_LEN 3 /*Minimum number of characters in a long word to put on a line after a break. *Depends on LV_TXT_LINE_BREAK_LONG_LEN.*/ #define LV_TXT_LINE_BREAK_LONG_POST_MIN_LEN 3 /*Support bidirectional texts. Allows mixing Left-to-Right and Right-to-Left texts. *The direction will be processed according to the Unicode Bidirectional Algorithm: *https://www.w3.org/International/articles/inline-bidi-markup/uba-basics*/ #define LV_USE_BIDI 0 #if LV_USE_BIDI /*Set the default direction. Supported values: *`LV_BASE_DIR_LTR` Left-to-Right *`LV_BASE_DIR_RTL` Right-to-Left *`LV_BASE_DIR_AUTO` detect texts base direction*/ #define LV_BIDI_BASE_DIR_DEF LV_BASE_DIR_AUTO #endif /*Enable Arabic/Persian processing *In these languages characters should be replaced with an other form based on their position in the text*/ #define LV_USE_ARABIC_PERSIAN_CHARS 0 /*================== * WIDGETS *================*/ /*Documentation of the widgets: https://docs.lvgl.io/latest/en/html/widgets/index.html*/ #define LV_WIDGETS_HAS_DEFAULT_VALUE 1 #define LV_USE_ANIMIMG 1 #define LV_USE_ARC 1 #define LV_USE_BAR 1 #define LV_USE_BUTTON 1 #define LV_USE_BUTTONMATRIX 1 #define LV_USE_CALENDAR 1 #if LV_USE_CALENDAR #define LV_CALENDAR_WEEK_STARTS_MONDAY 0 #if LV_CALENDAR_WEEK_STARTS_MONDAY #define LV_CALENDAR_DEFAULT_DAY_NAMES {"Mo", "Tu", "We", "Th", "Fr", "Sa", "Su"} #else #define LV_CALENDAR_DEFAULT_DAY_NAMES {"Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"} #endif #define LV_CALENDAR_DEFAULT_MONTH_NAMES {"January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"} #define LV_USE_CALENDAR_HEADER_ARROW 1 #define LV_USE_CALENDAR_HEADER_DROPDOWN 1 #endif /*LV_USE_CALENDAR*/ #define LV_USE_CANVAS 1 #define LV_USE_CHART 1 #define LV_USE_CHECKBOX 1 #define LV_USE_DROPDOWN 1 /*Requires: lv_label*/ #define LV_USE_IMAGE 1 /*Requires: lv_label*/ #define LV_USE_IMAGEBUTTON 1 #define LV_USE_KEYBOARD 1 #define LV_USE_LABEL 1 #if LV_USE_LABEL #define LV_LABEL_TEXT_SELECTION 1 /*Enable selecting text of the label*/ #define LV_LABEL_LONG_TXT_HINT 1 /*Store some extra info in labels to speed up drawing of very long texts*/ #define LV_LABEL_WAIT_CHAR_COUNT 3 /*The count of wait chart*/ #endif #define LV_USE_LED 1 #define LV_USE_LINE 1 #define LV_USE_LIST 1 #define LV_USE_MENU 1 #define LV_USE_MSGBOX 1 #define LV_USE_ROLLER 1 /*Requires: lv_label*/ #define LV_USE_SCALE 1 #define LV_USE_SLIDER 1 /*Requires: lv_bar*/ #define LV_USE_SPAN 1 #if LV_USE_SPAN /*A line text can contain maximum num of span descriptor */ #define LV_SPAN_SNIPPET_STACK_SIZE 64 #endif #define LV_USE_SPINBOX 1 #define LV_USE_SPINNER 1 #define LV_USE_SWITCH 1 #define LV_USE_TEXTAREA 1 /*Requires: lv_label*/ #if LV_USE_TEXTAREA != 0 #define LV_TEXTAREA_DEF_PWD_SHOW_TIME 1500 /*ms*/ #endif #define LV_USE_TABLE 1 #define LV_USE_TABVIEW 1 #define LV_USE_TILEVIEW 1 #define LV_USE_WIN 1 /*================== * THEMES *==================*/ /*A simple, impressive and very complete theme*/ #define LV_USE_THEME_DEFAULT 1 #if LV_USE_THEME_DEFAULT /*0: Light mode; 1: Dark mode*/ #define LV_THEME_DEFAULT_DARK 1 //+++ /*1: Enable grow on press*/ #define LV_THEME_DEFAULT_GROW 1 /*Default transition time in [ms]*/ #define LV_THEME_DEFAULT_TRANSITION_TIME 80 #endif /*LV_USE_THEME_DEFAULT*/ /*A very simple theme that is a good starting point for a custom theme*/ #define LV_USE_THEME_SIMPLE 0 /*A theme designed for monochrome displays*/ #define LV_USE_THEME_MONO 0 /*================== * LAYOUTS *==================*/ /*A layout similar to Flexbox in CSS.*/ #define LV_USE_FLEX 1 /*A layout similar to Grid in CSS.*/ #define LV_USE_GRID 1 /*==================== * 3RD PARTS LIBRARIES *====================*/ /*File system interfaces for common APIs */ /*API for fopen, fread, etc*/ #define LV_USE_FS_STDIO 0 #if LV_USE_FS_STDIO #define LV_FS_STDIO_LETTER '\0' /*Set an upper cased letter on which the drive will accessible (e.g. 'A')*/ #define LV_FS_STDIO_PATH "" /*Set the working directory. File/directory paths will be appended to it.*/ #define LV_FS_STDIO_CACHE_SIZE 0 /*>0 to cache this number of bytes in lv_fs_read()*/ #endif /*API for open, read, etc*/ #define LV_USE_FS_POSIX 0 #if LV_USE_FS_POSIX #define LV_FS_POSIX_LETTER '\0' /*Set an upper cased letter on which the drive will accessible (e.g. 'A')*/ #define LV_FS_POSIX_PATH "" /*Set the working directory. File/directory paths will be appended to it.*/ #define LV_FS_POSIX_CACHE_SIZE 0 /*>0 to cache this number of bytes in lv_fs_read()*/ #endif /*API for CreateFile, ReadFile, etc*/ #define LV_USE_FS_WIN32 0 #if LV_USE_FS_WIN32 #define LV_FS_WIN32_LETTER '\0' /*Set an upper cased letter on which the drive will accessible (e.g. 'A')*/ #define LV_FS_WIN32_PATH "" /*Set the working directory. File/directory paths will be appended to it.*/ #define LV_FS_WIN32_CACHE_SIZE 0 /*>0 to cache this number of bytes in lv_fs_read()*/ #endif /*API for FATFS (needs to be added separately). Uses f_open, f_read, etc*/ #define LV_USE_FS_FATFS 0 #if LV_USE_FS_FATFS #define LV_FS_FATFS_LETTER '\0' /*Set an upper cased letter on which the drive will accessible (e.g. 'A')*/ #define LV_FS_FATFS_CACHE_SIZE 0 /*>0 to cache this number of bytes in lv_fs_read()*/ #endif /*API for memory-mapped file access. */ #define LV_USE_FS_MEMFS 0 #if LV_USE_FS_MEMFS #define LV_FS_MEMFS_LETTER '\0' /*Set an upper cased letter on which the drive will accessible (e.g. 'A')*/ #endif /*API for LittleFs. */ #define LV_USE_FS_LITTLEFS 0 #if LV_USE_FS_LITTLEFS #define LV_FS_LITTLEFS_LETTER '\0' /*Set an upper cased letter on which the drive will accessible (e.g. 'A')*/ #endif /*LODEPNG decoder library*/ #define LV_USE_LODEPNG 0 /*PNG decoder(libpng) library*/ #define LV_USE_LIBPNG 0 /*BMP decoder library*/ #define LV_USE_BMP 0 /* JPG + split JPG decoder library. * Split JPG is a custom format optimized for embedded systems. */ #define LV_USE_TJPGD 0 /* libjpeg-turbo decoder library. * Supports complete JPEG specifications and high-performance JPEG decoding. */ #define LV_USE_LIBJPEG_TURBO 0 /*GIF decoder library*/ #define LV_USE_GIF 0 #if LV_USE_GIF /*GIF decoder accelerate*/ #define LV_GIF_CACHE_DECODE_DATA 0 #endif /*Decode bin images to RAM*/ #define LV_BIN_DECODER_RAM_LOAD 0 /*RLE decompress library*/ #define LV_USE_RLE 0 /*QR code library*/ #define LV_USE_QRCODE 0 /*Barcode code library*/ #define LV_USE_BARCODE 0 /*FreeType library*/ #define LV_USE_FREETYPE 0 #if LV_USE_FREETYPE /*Let FreeType to use LVGL memory and file porting*/ #define LV_FREETYPE_USE_LVGL_PORT 0 /*Cache count of the glyphs in FreeType. It means the number of glyphs that can be cached. *The higher the value, the more memory will be used.*/ #define LV_FREETYPE_CACHE_FT_GLYPH_CNT 256 #endif /* Built-in TTF decoder */ #define LV_USE_TINY_TTF 0 #if LV_USE_TINY_TTF /* Enable loading TTF data from files */ #define LV_TINY_TTF_FILE_SUPPORT 0 #endif /*Rlottie library*/ #define LV_USE_RLOTTIE 0 /*Enable Vector Graphic APIs*/ #define LV_USE_VECTOR_GRAPHIC 0 /* Enable ThorVG (vector graphics library) from the src/libs folder */ #define LV_USE_THORVG_INTERNAL 0 /* Enable ThorVG by assuming that its installed and linked to the project */ #define LV_USE_THORVG_EXTERNAL 0 /*Use lvgl built-in LZ4 lib*/ #define LV_USE_LZ4_INTERNAL 0 /*Use external LZ4 library*/ #define LV_USE_LZ4_EXTERNAL 0 /*FFmpeg library for image decoding and playing videos *Supports all major image formats so do not enable other image decoder with it*/ #define LV_USE_FFMPEG 0 #if LV_USE_FFMPEG /*Dump input information to stderr*/ #define LV_FFMPEG_DUMP_FORMAT 0 #endif /*================== * OTHERS *==================*/ /*1: Enable API to take snapshot for object*/ #define LV_USE_SNAPSHOT 0 /*1: Enable system monitor component*/ #define LV_USE_SYSMON 0 #if LV_USE_SYSMON /*Get the idle percentage. E.g. uint32_t my_get_idle(void);*/ #define LV_SYSMON_GET_IDLE lv_timer_get_idle /*1: Show CPU usage and FPS count * Requires `LV_USE_SYSMON = 1`*/ #define LV_USE_PERF_MONITOR 0 #if LV_USE_PERF_MONITOR #define LV_USE_PERF_MONITOR_POS LV_ALIGN_BOTTOM_RIGHT /*0: Displays performance data on the screen, 1: Prints performance data using log.*/ #define LV_USE_PERF_MONITOR_LOG_MODE 0 #endif /*1: Show the used memory and the memory fragmentation * Requires `LV_USE_STDLIB_MALLOC = LV_STDLIB_BUILTIN` * Requires `LV_USE_SYSMON = 1`*/ #define LV_USE_MEM_MONITOR 0 #if LV_USE_MEM_MONITOR #define LV_USE_MEM_MONITOR_POS LV_ALIGN_BOTTOM_LEFT #endif #endif /*LV_USE_SYSMON*/ /*1: Enable the runtime performance profiler*/ #define LV_USE_PROFILER 0 #if LV_USE_PROFILER /*1: Enable the built-in profiler*/ #define LV_USE_PROFILER_BUILTIN 1 #if LV_USE_PROFILER_BUILTIN /*Default profiler trace buffer size*/ #define LV_PROFILER_BUILTIN_BUF_SIZE (16 * 1024) /*[bytes]*/ #endif /*Header to include for the profiler*/ #define LV_PROFILER_INCLUDE "lvgl/src/misc/lv_profiler_builtin.h" /*Profiler start point function*/ #define LV_PROFILER_BEGIN LV_PROFILER_BUILTIN_BEGIN /*Profiler end point function*/ #define LV_PROFILER_END LV_PROFILER_BUILTIN_END /*Profiler start point function with custom tag*/ #define LV_PROFILER_BEGIN_TAG LV_PROFILER_BUILTIN_BEGIN_TAG /*Profiler end point function with custom tag*/ #define LV_PROFILER_END_TAG LV_PROFILER_BUILTIN_END_TAG #endif /*1: Enable Monkey test*/ #define LV_USE_MONKEY 0 /*1: Enable grid navigation*/ #define LV_USE_GRIDNAV 0 /*1: Enable lv_obj fragment*/ #define LV_USE_FRAGMENT 0 /*1: Support using images as font in label or span widgets */ #define LV_USE_IMGFONT 0 /*1: Enable an observer pattern implementation*/ #define LV_USE_OBSERVER 1 /*1: Enable Pinyin input method*/ /*Requires: lv_keyboard*/ #define LV_USE_IME_PINYIN 0 #if LV_USE_IME_PINYIN /*1: Use default thesaurus*/ /*If you do not use the default thesaurus, be sure to use `lv_ime_pinyin` after setting the thesauruss*/ #define LV_IME_PINYIN_USE_DEFAULT_DICT 1 /*Set the maximum number of candidate panels that can be displayed*/ /*This needs to be adjusted according to the size of the screen*/ #define LV_IME_PINYIN_CAND_TEXT_NUM 6 /*Use 9 key input(k9)*/ #define LV_IME_PINYIN_USE_K9_MODE 1 #if LV_IME_PINYIN_USE_K9_MODE == 1 #define LV_IME_PINYIN_K9_CAND_TEXT_NUM 3 #endif /*LV_IME_PINYIN_USE_K9_MODE*/ #endif /*1: Enable file explorer*/ /*Requires: lv_table*/ #define LV_USE_FILE_EXPLORER 0 #if LV_USE_FILE_EXPLORER /*Maximum length of path*/ #define LV_FILE_EXPLORER_PATH_MAX_LEN (128) /*Quick access bar, 1:use, 0:not use*/ /*Requires: lv_list*/ #define LV_FILE_EXPLORER_QUICK_ACCESS 1 #endif /*================== * DEVICES *==================*/ /*Use SDL to open window on PC and handle mouse and keyboard*/ #define LV_USE_SDL 0 #if LV_USE_SDL #define LV_SDL_INCLUDE_PATH #define LV_SDL_RENDER_MODE LV_DISPLAY_RENDER_MODE_DIRECT /*LV_DISPLAY_RENDER_MODE_DIRECT is recommended for best performance*/ #define LV_SDL_BUF_COUNT 1 /*1 or 2*/ #define LV_SDL_FULLSCREEN 0 /*1: Make the window full screen by default*/ #define LV_SDL_DIRECT_EXIT 1 /*1: Exit the application when all SDL windows are closed*/ #define LV_SDL_MOUSEWHEEL_MODE LV_SDL_MOUSEWHEEL_MODE_ENCODER /*LV_SDL_MOUSEWHEEL_MODE_ENCODER/CROWN*/ #endif /*Use X11 to open window on Linux desktop and handle mouse and keyboard*/ #define LV_USE_X11 0 #if LV_USE_X11 #define LV_X11_DIRECT_EXIT 1 /*Exit the application when all X11 windows have been closed*/ #define LV_X11_DOUBLE_BUFFER 1 /*Use double buffers for endering*/ /*select only 1 of the following render modes (LV_X11_RENDER_MODE_PARTIAL preferred!)*/ #define LV_X11_RENDER_MODE_PARTIAL 1 /*Partial render mode (preferred)*/ #define LV_X11_RENDER_MODE_DIRECT 0 /*direct render mode*/ #define LV_X11_RENDER_MODE_FULL 0 /*Full render mode*/ #endif /*Driver for /dev/fb*/ #define LV_USE_LINUX_FBDEV 0 #if LV_USE_LINUX_FBDEV #define LV_LINUX_FBDEV_BSD 0 #define LV_LINUX_FBDEV_RENDER_MODE LV_DISPLAY_RENDER_MODE_PARTIAL #define LV_LINUX_FBDEV_BUFFER_COUNT 0 #define LV_LINUX_FBDEV_BUFFER_SIZE 60 #endif /*Use Nuttx to open window and handle touchscreen*/ #define LV_USE_NUTTX 0 #if LV_USE_NUTTX #define LV_USE_NUTTX_LIBUV 0 /*Use Nuttx custom init API to open window and handle touchscreen*/ #define LV_USE_NUTTX_CUSTOM_INIT 0 /*Driver for /dev/lcd*/ #define LV_USE_NUTTX_LCD 0 #if LV_USE_NUTTX_LCD #define LV_NUTTX_LCD_BUFFER_COUNT 0 #define LV_NUTTX_LCD_BUFFER_SIZE 60 #endif /*Driver for /dev/input*/ #define LV_USE_NUTTX_TOUCHSCREEN 0 #endif /*Driver for /dev/dri/card*/ #define LV_USE_LINUX_DRM 0 /*Interface for TFT_eSPI*/ #define LV_USE_TFT_ESPI 0 /*Driver for evdev input devices*/ #define LV_USE_EVDEV 0 /*Driver for libinput input devices*/ #define LV_USE_LIBINPUT 0 #if LV_USE_LIBINPUT #define LV_LIBINPUT_BSD 0 /*Full keyboard support*/ #define LV_LIBINPUT_XKB 0 #if LV_LIBINPUT_XKB /*"setxkbmap -query" can help find the right values for your keyboard*/ #define LV_LIBINPUT_XKB_KEY_MAP { .rules = NULL, .model = "pc101", .layout = "us", .variant = NULL, .options = NULL } #endif #endif /*Drivers for LCD devices connected via SPI/parallel port*/ #define LV_USE_ST7735 0 #define LV_USE_ST7789 0 #define LV_USE_ST7796 0 #define LV_USE_ILI9341 0 #define LV_USE_GENERIC_MIPI (LV_USE_ST7735 | LV_USE_ST7789 | LV_USE_ST7796 | LV_USE_ILI9341) /* LVGL Windows backend */ #define LV_USE_WINDOWS 0 /*================== * EXAMPLES *==================*/ /*Enable the examples to be built with the library*/ #define LV_BUILD_EXAMPLES 0 //+++ /*=================== * DEMO USAGE ====================*/ /*Show some widget. It might be required to increase `LV_MEM_SIZE` */ #define LV_USE_DEMO_WIDGETS 0 //+++ /*Demonstrate the usage of encoder and keyboard*/ #define LV_USE_DEMO_KEYPAD_AND_ENCODER 0 /*Benchmark your system*/ #define LV_USE_DEMO_BENCHMARK 0 /*Render test for each primitives. Requires at least 480x272 display*/ #define LV_USE_DEMO_RENDER 0 /*Stress test for LVGL*/ #define LV_USE_DEMO_STRESS 0 /*Music player demo*/ #define LV_USE_DEMO_MUSIC 0 #if LV_USE_DEMO_MUSIC #define LV_DEMO_MUSIC_SQUARE 0 #define LV_DEMO_MUSIC_LANDSCAPE 0 #define LV_DEMO_MUSIC_ROUND 0 #define LV_DEMO_MUSIC_LARGE 0 #define LV_DEMO_MUSIC_AUTO_PLAY 0 #endif /*Flex layout demo*/ #define LV_USE_DEMO_FLEX_LAYOUT 0 /*Smart-phone like multi-language demo*/ #define LV_USE_DEMO_MULTILANG 0 /*Widget transformation demo*/ #define LV_USE_DEMO_TRANSFORM 0 /*Demonstrate scroll settings*/ #define LV_USE_DEMO_SCROLL 0 /*Vector graphic demo*/ #define LV_USE_DEMO_VECTOR_GRAPHIC 0 /*--END OF LV_CONF_H--*/ #endif /*LV_CONF_H*/ #endif /*End of "Content enable"*/

c-o-o-l.h (klicken, um diesen Abschnitt auf- und zuzuklappen)
#define Xbitmap_logo_width 128 #define Xbitmap_logo_height 100 static unsigned char Xbitmap_logo_bits[] = { 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x0c, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x1c, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x38, 0x00, 0x30, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0xfe, 0x03, 0x70, 0x00, 0x38, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0xfe, 0x0f, 0xe0, 0x00, 0x1c, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x3e, 0xc0, 0x00, 0x0e, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x78, 0xc0, 0x01, 0x07, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0xe0, 0x81, 0x83, 0x03, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0xc0, 0x03, 0x83, 0x01, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x07, 0xc7, 0x01, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x0e, 0xfe, 0xff, 0xff, 0xff, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0xfe, 0xff, 0xff, 0xff, 0xff, 0x3f, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0xfc, 0xff, 0x1f, 0x00, 0x00, 0xc0, 0xff, 0x01, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0xe0, 0xff, 0x07, 0x00, 0x00, 0x00, 0x00, 0xf0, 0x07, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0xfe, 0x0f, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x1f, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0xf0, 0x7f, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x3c, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0xff, 0x03, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0xf0, 0x00, 0x00, 0x00, 0x00, 0x00, 0xe0, 0x1f, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0xe0, 0x01, 0x00, 0x00, 0x00, 0x00, 0xfc, 0x01, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x80, 0x03, 0x00, 0x00, 0x00, 0x00, 0x3f, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x07, 0x00, 0x00, 0x00, 0xc0, 0x07, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x0e, 0x00, 0x00, 0x00, 0xe0, 0x01, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x1c, 0x00, 0x00, 0x00, 0x70, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x1c, 0x00, 0x00, 0x00, 0x38, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x38, 0x00, 0x00, 0x00, 0x1c, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x30, 0x00, 0x00, 0x00, 0x0e, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x70, 0x00, 0x00, 0x00, 0x06, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0xe0, 0x00, 0x00, 0x00, 0x07, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0xe0, 0x00, 0x00, 0x00, 0x03, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0xc0, 0x00, 0x00, 0x80, 0x03, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0xc0, 0x01, 0x00, 0x80, 0x01, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x80, 0x01, 0x00, 0x80, 0x01, 0x00, 0x00, 0x00, 0x60, 0x00, 0x00, 0x00, 0x80, 0x01, 0x00, 0x00, 0x80, 0x01, 0x00, 0xc0, 0x01, 0x00, 0x00, 0x00, 0xfc, 0x00, 0x00, 0x00, 0xc0, 0x0f, 0x00, 0x00, 0x00, 0x01, 0x00, 0xc0, 0x00, 0x00, 0x00, 0x00, 0x3f, 0x00, 0x00, 0x00, 0x00, 0x3f, 0x00, 0x00, 0x00, 0x3f, 0x00, 0xc0, 0x00, 0x00, 0x00, 0xc0, 0x0f, 0x00, 0x00, 0x00, 0x00, 0xf8, 0x00, 0x00, 0x00, 0x3f, 0x00, 0xe0, 0x00, 0x00, 0x00, 0xe0, 0x01, 0x00, 0x00, 0x00, 0x00, 0xe0, 0x01, 0x00, 0x00, 0x3f, 0x00, 0xe0, 0x00, 0x00, 0x00, 0x78, 0x00, 0x00, 0x00, 0x00, 0x00, 0x80, 0x07, 0x00, 0x00, 0x3f, 0x00, 0x60, 0x00, 0x00, 0x00, 0x3c, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x0e, 0x00, 0x00, 0x3f, 0x00, 0x60, 0x00, 0x00, 0x00, 0x0f, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x3c, 0x00, 0x00, 0x3f, 0x00, 0x70, 0x00, 0x00, 0x80, 0x07, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x78, 0x00, 0x00, 0x3f, 0x00, 0x30, 0x00, 0x00, 0xc0, 0x03, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0xe0, 0x00, 0x00, 0x3f, 0x00, 0x3c, 0x00, 0x00, 0x80, 0x00, 0x0f, 0x00, 0x00, 0x00, 0x00, 0x0f, 0x40, 0x00, 0x00, 0x3f, 0xc0, 0xff, 0x01, 0x00, 0x00, 0xe0, 0x7f, 0x00, 0x00, 0x00, 0xe0, 0x7f, 0x00, 0x00, 0x00, 0x3f, 0xe0, 0xff, 0x03, 0x00, 0x00, 0xf8, 0xff, 0x01, 0x00, 0x00, 0xf8, 0xff, 0x01, 0x00, 0x00, 0x3f, 0xf0, 0xff, 0x07, 0x00, 0x00, 0xfc, 0xff, 0x03, 0x00, 0x00, 0xfc, 0xff, 0x03, 0x00, 0x00, 0x3f, 0xf8, 0xff, 0x0f, 0x00, 0x00, 0xfe, 0xff, 0x07, 0x00, 0x00, 0xfe, 0xff, 0x07, 0x00, 0x00, 0x3f, 0xfc, 0xc1, 0x0f, 0x00, 0x00, 0x7f, 0xf0, 0x0f, 0x00, 0x00, 0x7f, 0xf0, 0x0f, 0x00, 0x00, 0x3f, 0xfc, 0x80, 0x0f, 0x00, 0x00, 0x3f, 0xe0, 0x0f, 0x00, 0x00, 0x3f, 0xe0, 0x0f, 0x00, 0x00, 0x3f, 0x7e, 0x80, 0x0f, 0x00, 0x80, 0x1f, 0xc0, 0x1f, 0x00, 0x80, 0x1f, 0xc0, 0x1f, 0x00, 0x00, 0x3f, 0x7e, 0x00, 0x00, 0x00, 0x80, 0x1f, 0xc0, 0x1f, 0x00, 0x80, 0x1f, 0xc0, 0x1f, 0x00, 0x00, 0x3f, 0x7e, 0x00, 0x00, 0xfe, 0x8f, 0x1f, 0x80, 0x1f, 0xfe, 0x8f, 0x1f, 0x80, 0x1f, 0xfe, 0x0f, 0x3f, 0x7e, 0x00, 0x00, 0xfe, 0x8f, 0x0f, 0x80, 0x1f, 0xfe, 0x8f, 0x0f, 0x80, 0x1f, 0xfe, 0x0f, 0x3f, 0x7e, 0x00, 0x00, 0xfe, 0x8f, 0x0f, 0x80, 0x1f, 0xfe, 0x8f, 0x0f, 0x80, 0x1f, 0xfe, 0x0f, 0x3f, 0x7e, 0x00, 0x00, 0xfe, 0x8f, 0x0f, 0x80, 0x1f, 0xfe, 0x8f, 0x0f, 0x80, 0x1f, 0xfe, 0x0f, 0x3f, 0x7e, 0x00, 0x00, 0xfe, 0x8f, 0x0f, 0x80, 0x1f, 0xfe, 0x8f, 0x0f, 0x80, 0x1f, 0xfe, 0x0f, 0x3f, 0x7e, 0x00, 0x00, 0xfe, 0x8f, 0x1f, 0x80, 0x1f, 0xfe, 0x8f, 0x1f, 0x80, 0x1f, 0xfe, 0x0f, 0x3f, 0x7e, 0x00, 0x1f, 0x00, 0x80, 0x1f, 0xc0, 0x1f, 0x00, 0x80, 0x1f, 0xc0, 0x1f, 0x00, 0x00, 0x3f, 0x7e, 0x80, 0x1f, 0x00, 0x80, 0x1f, 0xc0, 0x0f, 0x00, 0x80, 0x1f, 0xc0, 0x0f, 0x00, 0x00, 0x3f, 0xfc, 0x80, 0x1f, 0x00, 0x00, 0x3f, 0xe0, 0x0f, 0x00, 0x00, 0x3f, 0xe0, 0x0f, 0x00, 0x00, 0x3f, 0xfc, 0xc1, 0x1f, 0x00, 0x00, 0xff, 0xf0, 0x07, 0x00, 0x00, 0xff, 0xf0, 0x07, 0x00, 0x00, 0x3f, 0xf8, 0xff, 0x0f, 0x00, 0x00, 0xfe, 0xff, 0x07, 0x00, 0x00, 0xfe, 0xff, 0x07, 0x00, 0x00, 0x3f, 0xf0, 0xff, 0x07, 0x00, 0x00, 0xfc, 0xff, 0x03, 0x00, 0x00, 0xfc, 0xff, 0x03, 0x00, 0x00, 0x3f, 0xe0, 0xff, 0x03, 0x00, 0x00, 0xf8, 0xff, 0x00, 0x00, 0x00, 0xf8, 0xff, 0x00, 0x00, 0x00, 0x3f, 0x80, 0xff, 0x01, 0x00, 0x00, 0xe0, 0x7f, 0x00, 0x00, 0x00, 0xe0, 0x7f, 0x00, 0x00, 0x00, 0x3f, 0x00, 0x1c, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x80, 0x01, 0x00, 0x30, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x80, 0x01, 0x00, 0x30, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0xc0, 0x01, 0x00, 0x30, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0xc0, 0x00, 0x00, 0x30, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0xc0, 0x00, 0x00, 0x30, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0xc0, 0x00, 0x00, 0x30, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0xc0, 0x00, 0x00, 0x30, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0xc0, 0x00, 0x00, 0x70, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0xc0, 0x00, 0x00, 0x60, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0xc0, 0x00, 0x00, 0x60, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0xc0, 0x00, 0x00, 0x60, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0xc0, 0x00, 0x00, 0xe0, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0xc0, 0x00, 0x00, 0xc0, 0x00, 0x00, 0x00, 0x00, 0x80, 0x00, 0x00, 0x00, 0xc0, 0x00, 0x00, 0x00, 0xc0, 0x00, 0x00, 0xc0, 0x00, 0x00, 0x00, 0x00, 0xc0, 0x01, 0x00, 0x00, 0xe0, 0x00, 0x00, 0x00, 0xc0, 0x00, 0x00, 0xc0, 0x01, 0x00, 0x00, 0x00, 0x80, 0x07, 0x00, 0x00, 0x60, 0x00, 0x00, 0x00, 0xe0, 0x00, 0x00, 0x80, 0x01, 0x00, 0x00, 0x00, 0x00, 0x1f, 0x00, 0x00, 0x70, 0x00, 0x00, 0x00, 0x60, 0x00, 0x00, 0x80, 0x03, 0x00, 0x00, 0x00, 0x00, 0xfc, 0x00, 0x00, 0x30, 0x00, 0x00, 0x00, 0x60, 0x00, 0x00, 0x00, 0x03, 0x00, 0x00, 0x00, 0x00, 0xf0, 0x03, 0x00, 0x38, 0x00, 0x00, 0x00, 0x70, 0x00, 0x00, 0x00, 0x07, 0x00, 0x00, 0x00, 0x00, 0xc0, 0x1f, 0x00, 0x1e, 0x00, 0x00, 0x00, 0x30, 0x00, 0x00, 0x00, 0x0e, 0x00, 0x00, 0x00, 0x00, 0x00, 0xfe, 0x81, 0x0f, 0x00, 0x00, 0x00, 0x38, 0x00, 0x00, 0x00, 0x1c, 0x00, 0x00, 0x00, 0x00, 0x00, 0xf0, 0xff, 0x03, 0x00, 0x00, 0x00, 0x1c, 0x00, 0x00, 0x00, 0x38, 0x00, 0x00, 0x00, 0x00, 0x00, 0x80, 0xff, 0x00, 0x00, 0x00, 0x00, 0x0e, 0x00, 0x00, 0x00, 0xf0, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x07, 0x00, 0x00, 0x00, 0xe0, 0x03, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x80, 0x03, 0x00, 0x00, 0x00, 0x80, 0x0f, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0xe0, 0x01, 0x00, 0x00, 0x00, 0x00, 0x1e, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0xf8, 0x00, 0x00, 0x00, 0x00, 0x00, 0x78, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x3e, 0x00, 0x00, 0x00, 0x00, 0x00, 0xf0, 0x01, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x80, 0x0f, 0x00, 0x00, 0x00, 0x00, 0x00, 0xc0, 0x0f, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0xf0, 0x03, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x7f, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0xfe, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0xf8, 0x07, 0x00, 0x00, 0x00, 0x00, 0x00, 0xc0, 0x1f, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0xc0, 0xff, 0x01, 0x00, 0x00, 0x00, 0x00, 0xf8, 0x03, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0xfc, 0xff, 0xff, 0xff, 0xff, 0xff, 0x7f, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0xff, 0xff, 0xff, 0xff, 0xff, 0x07, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00};

main.cpp (klicken, um diesen Abschnitt auf- und zuzuklappen)
// V1.00, 2024-04-22 // (C) by Oliver Kuhlemann, cool-web.de // Quelle: https://cool-web.de/esp8266-esp32/ #include <Arduino.h> #include <SPI.h> #include <XPT2046_Touchscreen.h> #include <TFT_eSPI.h> // #include <lv_conf.h> #include <lvgl.h> #define USE_DMA // Include the JPEG decoder / logo //#include <TJpg_Decoder.h> #include <c-o-o-l.h> // Image is stored here in an 8-bit array, black/white, 1 bit per pixel // for XPT2046 Touch //////////////////////////////// SPIClass xptSPI = SPIClass(VSPI); // SPI-Interface for XPT2046_Touchscreen XPT2046_Touchscreen xpt(XPT2046_CS, XPT2046_IRQ); // create an XPT object (Digitizer) // for TFT Display ////////////////////////////////// TFT_eSPI tft = TFT_eSPI(); // create an TFT object (TFT-Display) #ifdef USE_DMA uint16_t dmaBuffer1[16*16]; // Toggle buffer for 16*16 MCU block, 512bytes uint16_t dmaBuffer2[16*16]; // Toggle buffer for 16*16 MCU block, 512bytes uint16_t* dmaBufferPtr = dmaBuffer1; bool dmaBufferSel = 0; #endif // for LVGL //////////////////////////////////// // LVGL draw into this buffer, 1/10 screen size usually works well. The size is in bytes #define DRAW_BUF_SIZE (TFT_HOR_RES * TFT_VER_RES / 10 * (LV_COLOR_DEPTH / 8)) uint32_t draw_buf[DRAW_BUF_SIZE / 4]; lv_indev_t * indev; // Touchscreen input device for LVGL uint32_t lv_lastTick = 0; //Used to track the tick timer // This next function will be called during decoding of the jpeg file to render each // 16x16 or 8x8 image tile (Minimum Coding Unit) to the TFT. bool tft_output(int16_t x, int16_t y, uint16_t w, uint16_t h, uint16_t* bitmap) { // Stop further decoding as image is running off bottom of screen if ( y >= tft.height() ) return 0; // STM32F767 processor takes 43ms just to decode (and not draw) jpeg (-Os compile option) // Total time to decode and also draw to TFT: // SPI 54MHz=71ms, with DMA 50ms, 71-43 = 28ms spent drawing, so DMA is complete before next MCU block is ready // Apparent performance benefit of DMA = 71/50 = 42%, 50 - 43 = 7ms lost elsewhere // SPI 27MHz=95ms, with DMA 52ms. 95-43 = 52ms spent drawing, so DMA is *just* complete before next MCU block is ready! // Apparent performance benefit of DMA = 95/52 = 83%, 52 - 43 = 9ms lost elsewhere #ifdef USE_DMA // Double buffering is used, the bitmap is copied to the buffer by pushImageDMA() the // bitmap can then be updated by the jpeg decoder while DMA is in progress if (dmaBufferSel) dmaBufferPtr = dmaBuffer2; else dmaBufferPtr = dmaBuffer1; dmaBufferSel = !dmaBufferSel; // Toggle buffer selection // pushImageDMA() will clip the image block at screen boundaries before initiating DMA tft.pushImageDMA(x, y, w, h, bitmap, dmaBufferPtr); // Initiate DMA - blocking only if last DMA is not complete // The DMA transfer of image block to the TFT is now in progress... #else // Non-DMA blocking alternative tft.pushImage(x, y, w, h, bitmap); // Blocking, so only returns when image block is drawn #endif // Return 1 to decode next block. return 1; } void drawLogo(int16_t x, int16_t y, uint16_t fg_color) { // The jpeg image can be scaled down by a factor of 1, 2, 4, or 8 tft.drawXBitmap(x, y, Xbitmap_logo_bits, Xbitmap_logo_width, Xbitmap_logo_height, fg_color); } // read position of XPT digitizer and corresponding TFT position void xptPosition (uint16_t *xptX, uint16_t *xptY, uint8_t *xptZ, uint16_t *tftX, uint16_t *tftY) { uint16_t x, y; uint8_t z; // XPT uint16_t tx, ty; // TFT float xx = (XPT2046_XMAX - XPT2046_XMIN); // width XPT-Points float yy = (XPT2046_YMAX - XPT2046_YMIN); // height XPT-Points xpt.readData(&x, &y, &z); // calc position for TFT display from digitizer position tx = (x / xx * TFT_HEIGHT) - (XPT2046_XMIN / xx * TFT_HEIGHT); // TFT_HEIGHT=320 ty = (y / yy * TFT_WIDTH) - (XPT2046_YMIN / yy * TFT_WIDTH); // TFT_WIDTH=240 // avoid invalid values if (tx < 0) tx = 0; if (ty < 0) ty = 0; if (tx > TFT_HEIGHT-1) tx = TFT_HEIGHT-1; if (ty > TFT_WIDTH-1) ty = TFT_WIDTH-1; *xptX = x; *xptY = y; *xptZ = z; *tftX = tx; *tftY = ty; } // user function, that is called from LVGL // Implement and register a function which can copy the rendered image to an area of your display: void my_disp_flush(lv_display_t *disp, const lv_area_t *area, uint8_t *px_map) { // Display flushing uint32_t w = lv_area_get_width(area); uint32_t h = lv_area_get_height(area); tft.startWrite(); tft.setAddrWindow(area->x1, area->y1, w, h); // Set window area to pour pixels into tft.pushColors( (uint16_t *) px_map, w*h, true); // Push Color Informations into area tft.endWrite(); lv_disp_flush_ready(disp); // Indicate you are ready with the flushing } // user function, that is called from LVGL // Implement and register a function which can read an input device. E.g. for a touchpad: void my_touchpad_read(lv_indev_t *indev, lv_indev_data_t *data) { // Read the touchscreen // Serial.println ("my_touchpad_read"); uint16_t xptX, xptY, tftX, tftY; uint8_t xptZ; if (xpt.touched()) { xptPosition (&xptX, &xptY, &xptZ, &tftX, &tftY); data->point.x = tftX; data->point.y = tftY; data->state = LV_INDEV_STATE_PRESSED; } else { data->state = LV_INDEV_STATE_RELEASED; } } // see https://docs.lvgl.io/master/porting/tick.html static uint32_t my_tick_get_cb(void) { return millis(); } #if LV_USE_LOG // user function, that is called from LVGL // Serial debugging void lvgl_debug_print(lv_log_level_t level, const char * buf) { LV_UNUSED(level); Serial.printf(buf); Serial.flush(); } #endif void handleLVGL () { lv_tick_inc(millis() - lv_lastTick); // LVGL needs a system tick to know the elapsed time for animations and other tasks. lv_lastTick = millis(); lv_timer_handler(); // Update the GUI, handle the tasks of LVGL // uint32_t time_till_next = lv_timer_handler(); // delay(time_till_next); delay(5); //lv_disp_get_inactive_time(disp) // if i want to turn display off and sleep } lv_obj_t* s1_lab1 = NULL; int s1_cnt = 0; static void evt_s1_btn1(lv_event_t *e) { lv_event_code_t code = lv_event_get_code(e); if(code == LV_EVENT_CLICKED) { LV_LOG_USER("Button 1 clicked"); s1_cnt++; if (s1_lab1 != NULL) { //Serial.println(lv_label_get_text(s1_lab1) ); lv_label_set_text_fmt(s1_lab1, "%d", s1_cnt); } } } static void evt_s1_btn2(lv_event_t *e) { lv_event_code_t code = lv_event_get_code(e); if(code == LV_EVENT_VALUE_CHANGED) { LV_LOG_USER("Button 2 toggled"); } } int is_btn_weiter_pressed = 0; static void evt_btn_weiter(lv_event_t *e) { lv_event_code_t code = lv_event_get_code(e); if(code == LV_EVENT_CLICKED) { LV_LOG_USER("Button weiter clicked"); is_btn_weiter_pressed = 1; } } void show_screen1 () { lv_obj_t *label; lv_obj_t *btn1 = lv_button_create(lv_screen_active()); lv_obj_add_event_cb(btn1, evt_s1_btn1, LV_EVENT_ALL, NULL); lv_obj_align(btn1, LV_ALIGN_CENTER, 0, -40); lv_obj_remove_flag(btn1, LV_OBJ_FLAG_PRESS_LOCK); label = lv_label_create(btn1); lv_label_set_text(label, "Click-Button"); lv_obj_center(label); lv_obj_t *btn2 = lv_button_create(lv_screen_active()); lv_obj_add_event_cb(btn2, evt_s1_btn2, LV_EVENT_ALL, NULL); lv_obj_align(btn2, LV_ALIGN_CENTER, 0, 10); lv_obj_remove_flag(btn2, LV_OBJ_FLAG_PRESS_LOCK); lv_obj_add_flag(btn2, LV_OBJ_FLAG_CHECKABLE); lv_obj_set_height(btn2, LV_SIZE_CONTENT); label = lv_label_create(btn2); lv_label_set_text(label, "Toggle-Button"); lv_obj_center(label); lv_obj_t *btn_weiter = lv_button_create(lv_screen_active()); lv_obj_add_event_cb(btn_weiter, evt_btn_weiter, LV_EVENT_ALL, NULL); lv_obj_align(btn_weiter, LV_ALIGN_CENTER, 0, 70); lv_obj_remove_flag(btn_weiter, LV_OBJ_FLAG_PRESS_LOCK); label = lv_label_create(btn_weiter); lv_label_set_text(label, "Goto next screen"); lv_obj_center(label); s1_lab1 = lv_label_create(lv_screen_active()); lv_label_set_long_mode(s1_lab1, LV_LABEL_LONG_WRAP); // Break long lines lv_label_set_text(s1_lab1, "0"); lv_obj_set_width(s1_lab1, 50); /*Set smaller width to make the lines wrap*/ lv_obj_set_style_text_align(s1_lab1, LV_TEXT_ALIGN_CENTER, 0); lv_obj_align(s1_lab1, LV_ALIGN_CENTER, 120, -40); } void show_screen2 () { lv_obj_t *label; lv_obj_t *btn_weiter = lv_button_create(lv_screen_active()); lv_obj_add_event_cb(btn_weiter, evt_btn_weiter, LV_EVENT_ALL, NULL); lv_obj_align(btn_weiter, LV_ALIGN_CENTER, 0, 70); lv_obj_remove_flag(btn_weiter, LV_OBJ_FLAG_PRESS_LOCK); label = lv_label_create(btn_weiter); lv_label_set_text(label, "Goto next screen"); lv_obj_center(label); } void setup() { Serial.begin(115200); Serial.println("Program started."); Serial.print("Using LVGL Version "); Serial.print(lv_version_major()); Serial.print("."); Serial.print(lv_version_minor()); Serial.print("."); Serial.println (lv_version_patch()); // Start the SPI for the touch screen and init the XPT2046 library xptSPI.begin(XPT2046_CLK, XPT2046_MISO, XPT2046_MOSI, XPT2046_CS); xpt.begin(xptSPI); xpt.setRotation(1); // landscape, USB ports right bottom // Init the eSPI-TFT Library tft.init(); tft.setRotation(1); // landscape, USB ports right bottom tft.setTextColor(TFT_WHITE, TFT_BLACK); tft.fillScreen(TFT_BLACK); // clear screen tft.initDMA(); // init DMA for faster drawing in my_disp_flush // Show Logo drawLogo(TFT_HOR_RES/2-60, 10, TFT_WHITE); int y=130; int lh=30; // y-pos 1. line, line-height tft.drawCentreString("For more information", TFT_HEIGHT/2, y, 4); y+=lh; tft.drawCentreString("visit cool-web.de", TFT_HEIGHT/2, y, 4); y+=lh; while (! xpt.touched()) delay (1); // Init the LVGL Library Serial.println ("Init LVGL"); lv_init(); tft.fillScreen(TFT_BLACK); // clear screen lv_display_t * disp; #if LV_USE_TFT_ESPI // TFT_eSPI can be enabled lv_conf.h to initialize the display in a simple way disp = lv_tft_espi_create(TFT_HOR_RES, TFT_VER_RES, draw_buf, sizeof(draw_buf)); lv_display_set_rotation(disp, TFT_ROTATION); #else // Else create a display yourself <-- We use our own TFT_eSPI and display routines disp = lv_display_create(TFT_HOR_RES, TFT_VER_RES); lv_display_set_flush_cb(disp, my_disp_flush); lv_display_set_buffers(disp, draw_buf, NULL, sizeof(draw_buf), LV_DISPLAY_RENDER_MODE_PARTIAL); #endif // Initialize the XPT2046 input device driver Serial.println ("Init XPT2046"); indev = lv_indev_create(); lv_indev_set_type(indev, LV_INDEV_TYPE_POINTER); // LV_INDEV_TYPE_POINTER = touchpad or mouse lv_indev_set_read_cb(indev, my_touchpad_read); lv_lastTick = millis(); lv_tick_set_cb(my_tick_get_cb); #if LV_USE_LOG != 0 lv_log_register_print_cb(lvgl_debug_print); // register print function for debugging #endif Serial.println ("LVGL started."); // funktioniert nicht, geister-buttons lv_obj_set_style_bg_opa(lv_scr_act(), LV_OPA_TRANSP, LV_PART_MAIN); // not defined lv_disp_set_bg_opa(NULL, LV_OPA_TRANSP); lv_obj_set_style_bg_color(lv_screen_active(), lv_color_hex(TFT_BLACK), LV_PART_MAIN); tft.fillScreen(TFT_BLUE); // damit man sieht, wohin durch LVGL gezeichnet wurde delay(2000); handleLVGL(); // vorher schon einmal aufrufen, damit Inhalt (bis auf oben links komischerweise) erhalten bleibt delay(2000); show_screen1(); handleLVGL(); tft.drawCentreString("Text from TFT_eSPI at beginning for 2s", TFT_HEIGHT/2, 5, 2); tft.drawCentreString("Text from TFT_eSPI at beginning for 2s", TFT_HEIGHT/2, 220, 2); delay(2000); while (!is_btn_weiter_pressed) { handleLVGL() ; tft.drawCentreString("Text from TFT_eSPI redrawn every 5 ms", TFT_HEIGHT/2, 30, 2); } is_btn_weiter_pressed = 0; tft.fillScreen(TFT_BLACK); // clear screen //lv_obj_clean (lv_screen_active()); handleLVGL() ; tft.drawCentreString("not done: lv_obj_clean (lv_screen_active());", TFT_HEIGHT/2, 220, 2); show_screen2(); while (!is_btn_weiter_pressed) { handleLVGL() ; tft.drawCentreString("Text from TFT_eSPI redrawn every 5 ms", TFT_HEIGHT/2, 30, 2); } is_btn_weiter_pressed = 0; tft.fillScreen(TFT_BLACK); // clear screen lv_obj_clean (lv_screen_active()); handleLVGL() ; tft.drawCentreString("done: lv_obj_clean (lv_screen_active());", TFT_HEIGHT/2, 220, 2); show_screen2(); } void loop() { while (1) { handleLVGL(); } }

Firmware Download via ESP Web Tools


Du möchtest die Firmware schon einmal ausprobieren, ohne die Entwicklungsumgebung zu installieren oder zu programmieren?

Kein Problem. Schließe einfach dein ESP32 an einen USB-Port deines PC an und klicke auf den deinem Gerät entsprechenden Button:

Die Firmware-Installation funktioniert leider nur mit Google Chrome und Chromium-basierten Browsern wie Microsoft Edge, Opera, Vivaldi oder Brave; jedoch nicht mit Firefox. Bitte benutze eine HTTPS-Verbindung, HTTP funktioniert nicht.

Die Firmware-Installation funktioniert leider nur mit Google Chrome und Chromium-basierten Browsern wie Microsoft Edge, Opera, Vivaldi oder Brave; jedoch nicht mit Firefox. Bitte benutze eine HTTPS-Verbindung, HTTP funktioniert nicht.

Demo und Video

Ich habe wieder ein kleine Demonstrations-Video gemacht, dass den Dialog in Aktion zeigt:


Weitere Aussichten

Beim nächsten Mal will ich ein nützliches Programm mit dem LVGL-Dialogsystem programmieren, um mich noch ein wenig tiefer in die Materie einzuarbeiten. Die Grundlage sind aber bereits mit diesem Artikel geschaffen und die Details für den Rest findet man in der LVGL-Dokumentation.

Hier geht es zum nächsten Artikel, indem ich den ersten Teil von Doc Cool's Utilities, dem RGB-LED-Color Changer, vorstelle.

Quellen, Literaturverweise und weiterführende Links