Displaying JPG and PNG Images on ESP32-S3 LCD using MicroPython

Displaying JPG and PNG Images on ESP32-S3 LCD using MicroPython

Click the blue text above to follow us

“Displaying Images on ESP32-S3 LCD (Based on MicroPython)” introduces driving the LCD to display BMP images. However, it can only display BMP images, and displaying other format images is more complicated.
This note introduces how to compile firmware to drive the ST7789 based LCD to display JPG and PNG images.

1. Compile Firmware

The ST7789 driver is in C language and can only be used by compiling firmware.
Refer to my previous articles for compiling firmware: “Compiling MicroPython Firmware for OV2640 and Other Cameras on ESP32-S3” and “Compiling MicroPython Firmware for 16M Flash on ESP32-S3”.
First, git clone the repository:
git clone https://github.com/russhughes/st7789_mpy.git

Place the entire st7789 folder from the st7789_mpy file into the usercmodules directory:

~/esp/micropython/examples/usercmodules/

Displaying JPG and PNG Images on ESP32-S3 LCD using MicroPython

“Compiling MicroPython Firmware for OV2640 and Other Cameras” compiled the camera driver. This time we need to compile both the camera driver and the ST7789 driver together, which requires editing the uesrmodules folder’s micropython.cmake file to make both drivers effective:

Displaying JPG and PNG Images on ESP32-S3 LCD using MicroPython

Then, compile the firmware:

make clean make USER_C_MODULES=~/esp/micropython/examples/usercmodule/micropython.cmake
Finally, refer to “Flashing MicroPython Firmware on ESP32-S3 and Lighting Up the LED” to flash the firmware and verify whether the camera and ST7789 drivers work properly, and if they support PSRAM and 16M FLASH:

Displaying JPG and PNG Images on ESP32-S3 LCD using MicroPython

import cameraimport st7789import micropythonimport espmicropython.mem_info()esp.flash_size()/1024/1024

2. Required Hardware

Displaying JPG and PNG Images on ESP32-S3 LCD using MicroPython

We purchased a 1.69-inch LCD display based on ST7789 with a resolution of 240X280. The pins are the same as those of the 0.96-inch LCD from Hezhao, and we directly inserted the 1.69-inch LCD into our designed ESP32-S3 expansion board.

The circuit diagram is as follows:

Displaying JPG and PNG Images on ESP32-S3 LCD using MicroPython

3. Test Code

Place the images to be displayed in the root directory of the SD card, allowing the ESP32S3 to drive the ST7789 based LCD and cycle through the images on the LCD. The code is as follows:

from machine import Pin,SPI,PWM,SoftSPIimport st7789,sdcard,timesd = sdcard.SDCard(SoftSPI(1, sck=Pin(1), mosi=Pin(2), miso=Pin(3)), Pin(8))
os.mount(sd, '/sd')
os.listdir('/sd') 
blk = PWM(Pin(13), duty=500, freq=1000)spi=SPI(1,baudrate=30000000, sck=Pin(18), mosi=Pin(17),miso=Pin(16))#Using SPI1, speed cannot be too high, too high will cause CPU to restart. It was tested that above 30000000 will cause restart st7789.ST7789(spi, 240, 320, reset=Pin(16, Pin.OUT), dc=Pin(15, Pin.OUT), cs=Pin(14, Pin.OUT))tft=st7789.ST7789(spi, 240, 320, reset=Pin(16, Pin.OUT), dc=Pin(15, Pin.OUT), cs=Pin(14, Pin.OUT),backlight=Pin(13),inversion=True)
#If the image is inverted, be sure to modify this parameter: inversion=Falsetft.init()tft.rotation(0)#tft.fill(0)while True :    tft.jpg('/sd/1.jpg',0,0)    time.sleep(1)    tft.png('/sd/1.PNG',0,0)    time.sleep(1)    tft.png('/sd/2.PNG',0,0)    time.sleep(1)    tft.png('/sd/3.PNG',0,0)    time.sleep(1)    tft.jpg('/sd/cat.jpg',0,0)    time.sleep(1)    tft.png('/sd/oran.png',0,0)    time.sleep(1)

5. Display Image Effects

The display effect of images:

Displaying JPG and PNG Images on ESP32-S3 LCD using MicroPython

The display effect of videos:

It was tested that the refresh rate of displaying JPG images is faster, while the refresh rate of displaying PNG is slower.

Finally, it is recommended not to buy a 240X280 display, generally only supporting 240X240 or 240X320. It is recommended to buy these two types of LCD.

Displaying JPG and PNG Images on ESP32-S3 LCD using MicroPython

01

Compiling MicroPython Firmware for OV2640 and Other Cameras

02

Compiling MicroPython Firmware for 16M Flash

03

Flashing MicroPython Firmware on ESP32-S3 and Lighting Up the LED

Leave a Comment