logo elektroda
logo elektroda
X
logo elektroda

How to program the ESP32 C3 Mini TV LCD 1.44inch ST7735 module? PlatformIO tutorial

p.kaczmarek2 4398 5
ADVERTISEMENT
Treść została przetłumaczona polish » english Zobacz oryginalną wersję tematu
  • ESP32 C3 module with a colorful LCD display in a keychain format. .
    This inconspicuous module is based on the ESP32 C3 and offers a 1.44" colour display with 128x128 resolution, controlled via SPI protocol. Here I will show how easy it is to get started with it, how it can be batch uploaded remotely (via WiFi), how to display a simple animation and compare the display speed between software and hardware SPI. In addition, I will check if an older esptool can handle the ESP32-C3....

    The product often appears under the heading 'ESP32 C3 Desktop Trinket Mini TV Portable Pendant LVGL 1.44inch LCD ST7735' and can be purchased for around £40. I received the whole thing after purchase in such a box, properly protected:
    Box with label of ESP32 C3 module with display Small brown box with a label and CE mark. .
    Also included is a simple case based on spacers and a key fob:
    ESP32-C3 module kit with accessories in packaging. .
    The attached sticker (why sticker?) with QR code refers us to information from the vendor .
    Informational leaflet with contact details and QR codes from Spotpear .
    And here is the module itself:
    Close-up of a PCB with electronic components, including a micro USB socket, integrated circuits, and I/O connectors. LCD display module on a wooden table. Image of a green circuit board with an ESP32-C3 and Winbond chip. Close-up of a circuit board with an ESP32-C3 microcontroller and Winbond chip. .
    In addition to the classic BOOT (bootloader mode) and RESET buttons, here we also have two additional buttons on IO8 and IO10, as well as having pads from several pinouts.
    You can see the 25Q128JVSG memory (all 16MB of it) and of course the ESP32-C3. There is also a 1.27mm connector for connecting a Li-Ion cell and a micro USB connector.
    Information from the vendor leads to a short tutorial/documentation at:
    https://spotpear.com/wiki/ESP32-C3-desktop-tr...ortable-Pendant-LVGL-1.44inch-LCD-ST7735.html
    Diagram:
    Schematic of the ESP32 C3 module with ST7735 display .
    Li-Ion battery support is handled here by the PL4054. 3.3V (with 5V from USB) is provided by the CAT6219. Flash memory is, as mentioned, the W25Q128, and the display.... you know

    Demonstration program .
    The demonstration program is pre-loaded on the board and displays the image as soon as power is applied:
    Module displaying WLAN setup instructions on a small screen. .
    I couldn't find an English-language manual for its use on the web, but basically it just requires a WiFi access point to be set up on our phone with the data:
    
    spotpear
    12345678
    
    .
    It then connects to it and then downloads weather information for our location via our phone's internet connection:
    ESP32 C3 module with display and phone set up as a Wi-Fi hotspot ESP32-C3 module with a display next to a smartphone set as a WiFi hotspot. ESP32-C3 module with display and smartphone with Wi-Fi hotspot settings. .
    The top bar successively displays the downloaded data.
    ESP32 C3 display showing weather data next to a smartphone with hotspot settings. ESP32 C3 module with a color display next to a phone. Miniature ESP32-C3 display module showing weather information next to a phone. .
    The program source can be downloaded on Github:
    https://github.com/Spotpear/ESP32C3_1.44inch

    Flash copy and error Unexpected CHIP magic value 0x1b31506f .
    To start with I started by making a copy of the original factory program and by then I had already encountered the problem. I used my tried-and-tested esptool.py, which I installed once along with the ESP support for Arduino:
    
    esptool.py read_flash 0 0x1000000 ESP32-C3-Desktop-Trinket-Mini-TV-Portable-Pendant-LVGL-1.44inch-LCD-ST7735.bin
    pause
    
    .
    However, this esptool does not recognise this board:
    Screenshot of esptool.py error message .
    This is because it is version 3.0.2, as indicated by the path itself:
    
    esp8266\hardware\esp8266\3.0.2\tools\esptool
    
    .
    Therefore, it is better to download the latest esptool from Github - you can already in exe form:
    https://github.com/espressif/esptool/releases
    The newer esptool-v4.8.1-win64.zip was able to rip the batch without any problems .
    Screenshot of a terminal during esptool operation. .
    
    esptool.exe read_flash 0 0x1000000 ESP32-C3-Desktop-Trinket-Mini-TV-Portable-Pendant-LVGL-1.44inch-LCD-ST7735.bin
    pause
    
    .
    I have posted a copy here:
    https://github.com/openshwprojects/FlashDumps/tree/main/IoT/ESP32


    Easiest program in PlatformIO .
    Some people still program in the Arduino IDE, but I find it easier in PlatformIO. This environment is an add-on to the free Visual Code, which I have described more extensively in earlier topics:
    How to program a Wemos D1 (ESP8266) board in Arduino shape? ArduinoOTA in PlatformIO .
    Clock on ESP12 and MAX7219 display - tutorial - part 1, ArduinoOTA, basics .
    I have created a new project. I couldn't find this particular one from the topic in the boards, so I used another one from ESP32-C3.
    PlatformIO wizard window for creating a new project for Adafruit QT Py ESP32-C3. .
    To start, I ran the UART alone, without the display.
    Code: C / C++
    Log in, to see the code
    .
    My platformio.ini
    
    [env:adafruit_qtpy_esp32c3]
    platform = espressif32
    board = adafruit_qtpy_esp32c3
    framework = arduino
    
    
    .
    One call to "Upload and Monitor" later, everything started working as expected:
    Screenshot of a terminal displaying data verification messages and data transmission information. .


    We are running the display in PlatformIO .
    Ok, but we didn't buy this board to not use its display. It needs to be made operational.
    You will need two libraries for this:
    - adafruit/Adafruit ST7735 and ST7789 Library .
    - adafruit/Adafruit GFX Library .
    These can be added via the PlatformIO GUI:
    Screenshot of the PlatformIO interface with the Libraries tab open and a menu icon highlighted on the left. .
    ... or simply add them to our platformio.ini and PIO will download them itself:
    
    [env:adafruit_qtpy_esp32c3]
    platform = espressif32
    board = adafruit_qtpy_esp32c3
    framework = arduino
    lib_deps =
        adafruit/Adafruit ST7735 and ST7789 Library
        adafruit/Adafruit GFX Library
    
    
    .
    Then we can start Hello World ST7735. Here it is important to set the pin indices appropriately, as they may differ between modules:
    Code: C / C++
    Log in, to see the code
    .
    Here we have in sequence:
    - Adafruit_ST7735(int8_t cs, int8_t dc, int8_t mosi, int8_t sclk, int8_t rst) - runs the display in software SPI mode (bit-bang).
    - tft.initR(INITR_BLACKTAB) - initializes display with appropriate configuration for ST7735
    - tft.fillScreen(color) - fills the entire screen with the specified colour
    - tft.setCursor(x, y) - sets the cursor position
    - tft.setTextColor(color) - sets text colour
    - tft.setTextSize(size) - sets text size
    - tft.print(text) - displays the text at the current cursor position
    Result:
    Small LCD display connected to an ESP32-C3 module showing hello world text..

    Animation and partial screen cleaning technique .
    Static text is not everything - it is possible to do quite smooth animations here. Of course, this requires appropriate optimisation, one of which is to draw only what has changed on the screen.
    For example, when we want to draw a simple clock, instead of refreshing the whole screen with each movement of the hand, we can simply 'blur' the previous hand with the background colour and then draw it again:
    Code: C / C++
    Log in, to see the code
    .
    Not much has changed in the code, basically I just count the centre of the screen at the beginning and then in the function from drawing the pointer I also count the tip of the pointer for a given angle (from trigonometry). I connect the centre point with the calculated tip with a line. I call the same thing twice in the loop, once for the "old" pointer, painting it with the background colour, and then for the "new" pointer - in white.
    The result:


    .


    Updating the batch over the network .
    Let's not forget the Arduino OTA - I've already presented it here, among others:
    How to program a Wemos D1 (ESP8266) board in the shape of an Arduino? ArduinoOTA in PlatformIO .
    Let's modify my project to add a remote update. New PlatformIO.ini:
    
    
    
    [env:adafruit_qtpy_esp32c3]
    platform = espressif32
    board = adafruit_qtpy_esp32c3
    framework = arduino
    lib_deps =
        adafruit/Adafruit ST7735 and ST7789 Library
        adafruit/Adafruit GFX Library
        ArduinoOTA
    
    [env:adafruit_qtpy_esp32c3_ota]
    extends = env:adafruit_qtpy_esp32c3
    upload_protocol = espota
    upload_port = 192.168.0.192
    
    
    .
    New code:
    Code: C / C++
    Log in, to see the code

    The added ArduinoOTA.begin(); initiates the OTA system, and in turn the regular call ArduinoOTA.handle(); that handles the update itself is equally important.
    After the first upload, we check the board's IP on the router and enter it into the aforementioned platformio.ini:
    Fragment of DHCP client list showing assigned IP addresses .
    Now we have two task groups on the sidebar, we start the upload from the OTA group:
    Screenshot of the PlatformIO interface in Visual Studio Code with highlighted Upload and Monitor tasks. .
    The programme is updated remotely:
    Terminal showing firmware update progress on ESP32-C3. .



    Colours .
    There is a slightly larger selection of colours on this board than I have shown so far. Here is the modified "clock" code, so that the pointer changes colour depending on which quadrant of the screen it is in:
    Code: C / C++
    Log in, to see the code
    .
    The result:


    .

    Faster drawing .
    So far, I have shown examples in a version based on software-based, free SPI. Such SPI is implemented by software "swiping" the pins, as can be seen in the library code (see TFT_SOFT_SPI section):
    Code: C / C++
    Log in, to see the code
    .
    but the hwspi, or hardware SPI, option is also available.
    Which SPI is used depends on the constructor used.
    In order to run the hardware SPI, a minor change needs to be made:
    Code: C / C++
    Log in, to see the code
    .
    The rest of the code analogously. Now the question is, how much does this give us?
    Let's do a small benchmark for this, a performance test:
    Code: C / C++
    Log in, to see the code
    .
    The code above saves the current time and then fills the screen repeatedly with different colours using the fillScreen function. Then the current time is downloaded again and how much the whole process took is calculated.
    I ran it for both versions and compared the results:


    .


    .
    Software SPI: 16 014ms
    Hardware: 470ms
    Hardware SPI is more than 30 times faster in this case. It will definitely make a noticeable difference, especially at frequent screen refresh rates.

    Demonstration of various features .
    This display can still do a bit more, so I decided to flip the "graphicstest" program from Adafruit over to it:
    https://raw.githubusercontent.com/adafruit/Ad...master/examples/graphicstest/graphicstest.ino
    The program only required changing the pins and port from the Adafruit_ST7735 class constructor:
    Code: C / C++
    Log in, to see the code
    .
    Result:


    .


    Buttons and their operation .
    Finally, it is worth showing the use of the buttons on pins IO8 and IO10. In the simplest version, you can use pinMode and the usual digitalRead to operate them. I won't worry about contact vibration here, I will solve the problem by adding a blocking delay in the code. Menu navigation, for example, can be implemented based on these buttons:
    Code: C / C++
    Log in, to see the code
    .
    The above code could be significantly improved, first of all by removing the blocking delay , as well as by optimising the display of the menu - instead of drawing it all over again every time, you could just paint over the arrow and draw it in a new place. The result:
    ESP32 C3 module with a 1.44-inch LCD display and on-screen menu. Small module with LCD display showing menu options. .

    Much simplified ST7735 support library in one file/project .
    Here without much commentary, but maybe someone will find it useful.
    I wanted to get more familiar with the ST7735 support, and I reworked myself a library from Adafruit so that it has just 600 lines of code and in C style (no class). The whole thing only supports software SPI (bit-bang) and can only draw simple shapes, there is no font. Everything is in one PlatformIO project:
    View of Visual Studio Code editor with an open platformio.ini file for the ESP32 C3 project. .
    My simplified demo:
    Code: C / C++
    Log in, to see the code
    .
    Result:



    Download: .
    c3aSimpli..ed.rar Download (3.72 MB) .

    Summary .
    A very interesting module. A bit of design can be done, and there are ready-made libraries for everything. The display can be driven both hardware (efficiently) and software, although the latter option is unlikely to be useful here. Flash memory is plentiful, all 16MB. In addition to the boot and reset buttons, the following are also provided There are two GPIOs, so you can control something without soldering, and if you want additional peripherals, this is also an option.
    However, I haven't tested battery power and here I have a doubt: how long will it last with this display on a cell? Is it not too bright? The current consumption of my example with the display is around 70-100mA....
    Have you used this module, what applications do you see for it? .

    Cool? Ranking DIY
    Helpful post? Buy me a coffee.
    Do you have a problem with Arduino? Ask question. Visit our forum Arduino.
    About Author
    p.kaczmarek2
    Moderator Smart Home
    Offline 
    p.kaczmarek2 wrote 11888 posts with rating 9967, helped 570 times. Been with us since 2014 year.
  • ADVERTISEMENT
  • #2 21334569
    gulson
    System Administrator
    Thanks for the test. I think such an interesting application could be such a portable "status bar" displaying basic data about our devices or network or coming from various sensors. Instead of unlocking the phone, a glance at the display and everything is immediately known. In addition, the derivation of a single button would make it possible to perform an action.
    It would be nice to combine this with ChatGPT, which would, as it were, give the relevant messages, already processed, personalised and suitably short.
  • ADVERTISEMENT
  • #3 21365764
    rchristescu
    Level 7  
    Thank you so much for this tutorial, you made me buy this device and I am really happy with it.
    I have one remark. With this setup, there are some anomalies that I see on my device, as well in your videos.
    - on the right side, there is a column of pixels not filled;
    - on the left and upper side there are 2 rows / columns of pixels not visible. You should set cursor to 2,2 in order to clear see the text. "Benchmark" is clear visible, "hello world" not;
    - the function tft.height() return 160 instead of 128. In your examples, the clock is not in the center, but a little down.
    - colors are 5-6-5 but with red on the least significant 5 bits and blue on the most significant 5 bits. For example tft.fillScreen(ST77XX_RED) will fill the screen with blue. Your clock hand is blue, green, red, cyan, starting from first quadrant, instead of red, green, blue, yellow as expected.
    The good news is that all of this can easily be fixed by using
    tft.initR(INITR_144GREENTAB);

    instead of
    tft.initR(INITR_BLACKTAB);
    (this is for 1.8" screen).
  • ADVERTISEMENT
  • #4 21463136
    Wulfara
    Level 2  
    Thank you very much for this information. Did you manage to compile and flash the original project? I followed instructions from Spotpear and compiled without errors and flashed the project successfully but all I get after that is an empty screen and the device unresponsive. Or maybe you managed to add LVGL to your own PlatformIO project by any chance? Trying to do so I end with the same compiling but non working result.
    Thank you.
    Best regards.
  • ADVERTISEMENT
  • #5 21463205
    p.kaczmarek2
    Moderator Smart Home
    I didn't compile for this particular board yet, but I have shown LVGL example usage in this topic, which is not yet translated, so I am posting two links:
    https://www.elektroda.pl/rtvforum/topic4069845.html
    https://www.elektroda.com/rtvforum/topic4069845.html
    Would you find PlatformIO sample for this board useful? I can do such a presentation for you, but it can take few weeks at least before I publish it.
    Helpful post? Buy me a coffee.
  • #6 21463308
    Wulfara
    Level 2  
    Thank you very much for your kind response.
    p.kaczmarek2 wrote:
    Would you find PlatformIO sample for this board useful? I can do such a presentation for you, but it can take few weeks at least before I publish it.

    That would be amazing! LVGL setup for this specific board is what I'm failing to achieve or find information about. I’d really appreciate it if you could help, but I’d feel bad making you go through all that effort.

    Added after 1 [hours] 20 [minutes]:

    We've just managed to make LVGL work on the device using the Adafruit ST7735 and ST7789 Library you mentioned. The problem was the TFT_eSPI alternative Spotpear was using in their project. Unfortunately, the refresh rate with Adafruit's library is really slow for our project. We're trying to make it work with TFT_eSPI which is supposed to be much faster.
ADVERTISEMENT