LVGL Handling

[spienz]

Hy,

at the moment i'm playing with my Display and try to figure out whats working.

I hav esome Problems:

Font, i tired a lot ways to get an own Font Loaded but nothing works.

Slider is moving after some Hours across the Screen, why is this happen.

System is horrible slow after Loading a Image, just loading is enough to get the System is slow, if i put it on the Screen it will be displayed, but Slider is hanging. Without Image Slider is working.

Any suggestions ?!?

THX

Sebastian

from i2c import I2C
import gt911, lcd_bus, task_handler, rgb_display, time, os, vfs, gc
import lvgl as lv  # NOQA
from machine import SPI, SDCard


_WIDTH = const(800)
_HEIGHT = const(480)

_BUFFER_SIZE = const(768000)  # width * height * 2 1107651508 768000

_CTP_SCL = const(20)
_CTP_SDA = const(19)
_CTP_IRQ = None

_SD_MOSI = None
_SD_SCK = None
_SD_MISO = None

_LCD_FREQ = const(13500000)
_PCLK_ACTIVE_NEG = const(1)#0

_HSYNC_PULSE_WIDTH = const(20)#10,4
_HSYNC_BACK_PORCH = const(46)#10,43
_HSYNC_FRONT_PORCH = const(210)#10,8

_VSYNC_PULSE_WIDTH = const(10)#10,4
_VSYNC_BACK_PORCH = const(23)#10,12
_VSYNC_FRONT_PORCH = const(22)#20,8

_PCLK = const(0)
_HSYNC = const(39)
_VSYNC = const(41)
_DE = const(40)
_DISP = None
_BCKL = const(2) # backlight
_DRST = None

# Initialize the SPI bus with appropriate pins
spi_bus = SPI.Bus(
    host=2,        # SPI bus host number (adjust based on your board)
    mosi=11,       # Master Out Slave In (adjust based on your hardware)
    miso=13,       # Master In Slave Out (adjust based on your hardware)
    sck=12         # Clock pin (adjust based on your hardware)
)


I2C_BUS = I2C.Bus(
    host=1,
    scl=_CTP_SCL,
    sda=_CTP_SDA,
    freq=400000,
    use_locks=False
)

TOUCH_DEVICE = I2C.Device(
    I2C_BUS,
    dev_id=gt911.I2C_ADDR,
    reg_bits=gt911.BITS
)

_DATA15 = const(14)  # B7 1
_DATA14 = const(21)  # B6 9
_DATA13 = const(47)  # B5 46
_DATA12 = const(48)  # B4 3
_DATA11 = const(45)  # B3 8
_DATA10 = const(4)  # G7
_DATA9 = const(16)  # G6
_DATA8 = const(15)  # G5
_DATA7 = const(7)  # G4
_DATA6 = const(6)  # G3
_DATA5 = const(5)  # G2
_DATA4 = const(1)  # R7 14
_DATA3 = const(9)  # R6 21
_DATA2 = const(46)  # R5 47
_DATA1 = const(3)  # R4 48
_DATA0 = const(8)  # R3 45

bus = lcd_bus.RGBBus(
    hsync=_HSYNC,
    vsync=_VSYNC,
    de=_DE,
    pclk=_PCLK,
    data0=_DATA0,
    data1=_DATA1,
    data2=_DATA2,
    data3=_DATA3,
    data4=_DATA4,
    data5=_DATA5,
    data6=_DATA6,
    data7=_DATA7,
    data8=_DATA8,
    data9=_DATA9,
    data10=_DATA10,
    data11=_DATA11,
    data12=_DATA12,
    data13=_DATA13,
    data14=_DATA14,
    data15=_DATA15,
    freq=_LCD_FREQ,
    hsync_front_porch=_HSYNC_FRONT_PORCH,
    hsync_back_porch=_HSYNC_BACK_PORCH,
    hsync_pulse_width=_HSYNC_PULSE_WIDTH,
    hsync_idle_low=False,
    vsync_front_porch=_VSYNC_FRONT_PORCH,
    vsync_back_porch=_VSYNC_BACK_PORCH,
    vsync_pulse_width=_VSYNC_PULSE_WIDTH,
    vsync_idle_low=False,
    de_idle_high=False,
    pclk_idle_high=False,
    pclk_active_low=_PCLK_ACTIVE_NEG,
    disp=1,
)

buf1 = bus.allocate_framebuffer(_BUFFER_SIZE, lcd_bus.MEMORY_SPIRAM)
buf2 = bus.allocate_framebuffer(_BUFFER_SIZE, lcd_bus.MEMORY_SPIRAM)

display = rgb_display.RGBDisplay(
    data_bus=bus,
    display_width=_WIDTH,
    display_height=_HEIGHT,
    frame_buffer1=buf1,
    frame_buffer2=buf2,
    backlight_pin=_BCKL,
    backlight_on_state=rgb_display.STATE_PWM,
    color_space=lv.COLOR_FORMAT.RGB565,
    rgb565_byte_swap=False
)

display.set_power(True)
display.init()
display.set_backlight(10)
#indev = gt911.GT911(TOUCH_DEVICE)
indev = gt911.GT911(TOUCH_DEVICE, startup_rotation=lv.DISPLAY_ROTATION._0)

# display.set_rotation(lv.DISPLAY_ROTATION._90)  # NOQA


sd = None

while sd is None:
    try:
        sd = SDCard(
            spi_bus=spi_bus,
            cs=10,
            freq=10000000
        )
        vfs.mount(sd, "/sd")
        print('Flash Mounted')
        print(os.listdir('/sd'))
    except Exception as er:
        sd = None
        print('sd card failure')
        time.sleep(5)
        
# Bilddaten von der SD-Karte lesen
with open('/sd/HoPOS_small_320.bin', 'rb') as file:
   img_data = file.read()
    


 # Neuen Bildschirm erstellen und als aktiv setzen
screen = lv.obj()
lv.screen_load(screen)  # Setzt diesen Bildschirm als aktuellen Bildschirm

# Canvas-Objekt erstellen und Bilddaten darauf anzeigen
canvas = lv.canvas(screen)  # Canvas wird auf dem erstellten Bildschirm hinzugefügt
canvas.set_buffer(img_data, 320, 240, lv.COLOR_FORMAT.RGB565)  # Setzt Bildgröße und RGB565-Format
canvas.align(lv.ALIGN.CENTER, 0, 0)  # Zentriert das Bild auf dem Bildschirm


th = task_handler.TaskHandler()

scrn = lv.screen_active()
scrn.set_style_bg_color(lv.color_hex(0x404040), 0) #0x404040

slider = lv.slider(scrn)
slider.set_size(500, 90)
slider.center()

#myFont1 = lv.lv_font_load("Cochin60.bin");

label = lv.label(scrn)
label.set_text('HELLO WORLD!')
label.align_to(slider, lv.ALIGN.OUT_BOTTOM_MID, 0, 50)
label.align(lv.ALIGN.CENTER, 0, -50)


# Erstelle das Label
label = lv.label(scrn)
label.set_text('HELLO WORLD!')


try:
    # Dateipfad zur Schriftartdatei angeben
    font_path = "Cochin25_2.bin"  
    font = lv.binfont_create(font_path)
except Exception as e:
    print("Fehler beim Laden der Schriftart:", e)
else:
    if font is None:
        print(f"Schriftartdatei '{font_path}' existiert nicht oder konnte nicht geladen werden.")
        time.sleep(5)
    else:
        print("Schriftart erfolgreich geladen.")

# Erstelle einen Stil und setze die Textfarbe
style = lv.style_t()
style.init()
style.set_text_font(lv.font_montserrat_16)  # Hier die gewünschte Schriftart auswählen font_montserrat_16
style.set_text_color(lv.color_hex(0xFF0000))  # Rot als Hex-Farbe

# Stil dem Label zuweisen
label.add_style(style, lv.PART.MAIN)

# Alle Attribute und Methoden des lv-Moduls ausgeben
#for item in dir(lv):
 #   if "font" in item.lower():
  #      print(item)
        
# LVGL-Version durch Aufrufen der Funktionen anzeigen
major = lv.version_major()
minor = lv.version_minor()
patch = lv.version_patch()

# Garbage Collector aufrufen, um unbenutzten Speicher freizugeben
gc.collect()

total_ram = gc.mem_alloc() + gc.mem_free()
used_ram = gc.mem_alloc()
free_ram = gc.mem_free()

print("Gesamter RAM:", total_ram, "Bytes")
print("Belegter RAM:", used_ram, "Bytes")
print("Freier RAM:", free_ram, "Bytes")

print("LVGL Version:", major, ".", minor, ".", patch)

REPL

LVGL MicroPython 1.23.0 on 2024-10-15; Generic ESP32S3 module with Octal-SPIRAM with ESP32S3

Type "help()" for more information.

Touch Product id: 911
Touch Firmware version: 0x1060
Touch Vendor id: 0x0
Touch resolution: width=800, height=480
Flash Mounted
['test.txt', 'test2.txt', 'HoPOS.bin', 'HoPOS_small_320.bin']
Schriftartdatei 'Cochin25_2.bin' existiert nicht oder konnte nicht geladen werden.
Gesamter RAM: 6349312 Bytes
Belegter RAM: 257824 Bytes
Freier RAM: 6091488 Bytes
LVGL Version: 9 . 1 . 0

Cochin25.bin.txt
Cochin25_2.bin.txt
HoPOS_small_320.bin.txt

[kdschlosser]

change this

_LCD_FREQ = const(13500000)

to this

_LCD_FREQ = const(13000000)

and that should stop the display from shifting over time. You might need to lower it even more, it is something you will have to fine tune. Usually 500000 increments are good.

in order to have LVGL load anything from the file system you need to use the file system driver to do that.

import lvgl as lv

import fs_driver

fs_drv = lv.fs_drv_t()  # This MUST not be garbage collected. It is best to do this in your main.py file at the module level. 
fs_driver.fs_register(fs_drv, 'S')

try:
    # Dateipfad zur Schriftartdatei angeben
    font_path = "S:Cochin25_2.bin"  
    font = lv.binfont_create(font_path)
except Exception as e:
    print("Fehler beim Laden der Schriftart:", e)
else:
    if font is None:
        print(f"Schriftartdatei '{font_path}' existiert nicht oder konnte nicht geladen werden.")
        time.sleep(5)
    else:
        print("Schriftart erfolgreich geladen.")

[spienz]

Hy,

i updated the Image to the newest build and now it isn't working, bevor it did.
LVGL (9.2.2) MicroPython (1.24.1) Binding compiled on 2025-01-07; Generic ESP32S3 module with Octal-SPIRAM with ESP32S3

TOUCH_DEVICE = I2C.Device(
I2C_BUS,
dev_id=gt911.I2C_ADDR,
reg_bits=gt911.BITS
)

Traceback (most recent call last):
File "", line 64, in
TypeError: extra positional arguments given

This is line 64 " reg_bits=gt911.BITS"

Regards

Sebastian

[kdschlosser]

I recently made some changes to the I2C driver and I am working through some issue with it. so you have to be patient until I get it back up and running again.

[spienz]

Hy,

so, I2C is working again, but loading a font from the SD card isn't possible.
I tried almost everything I found, but I'm still getting the same error.

The Picture will be loaded, but not the font.
Hard-/Softreset will make no difference with this behavior.

LVGL (9.2.2) MicroPython (1.24.1) Binding compiled on 2025-01-30; Generic ESP32S3 module with Octal-SPIRAM with ESP32S3

Any suggestions?

from i2c import I2C
import gt911
import lcd_bus
import task_handler
import lvgl as lv  # NOQA
import rgb_display
import fs_driver
#import lv_utils
import time
from machine import SPI, SDCard
import os, vfs, gc

_WIDTH = const(800)
_HEIGHT = const(480)

_BUFFER_SIZE = const(76800)  # width * height * 2 1107651508 768000

_CTP_SCL = const(20)
_CTP_SDA = const(19)
_CTP_IRQ = None

_SD_MOSI = None
_SD_SCK = None
_SD_MISO = None

_LCD_FREQ = const(10000000) #500000 13000000
_PCLK_ACTIVE_NEG = const(1)#0

_HSYNC_PULSE_WIDTH = const(20)#10,4
_HSYNC_BACK_PORCH = const(46)#10,43
_HSYNC_FRONT_PORCH = const(210)#10,8

_VSYNC_PULSE_WIDTH = const(10)#10,4
_VSYNC_BACK_PORCH = const(23)#10,12
_VSYNC_FRONT_PORCH = const(22)#20,8

_PCLK = const(0)
_HSYNC = const(39)
_VSYNC = const(41)
_DE = const(40)
_DISP = None
_BCKL = const(2) # backlight
_DRST = None

# Initialize the SPI bus with appropriate pins
spi_bus = SPI.Bus(
    host=2,        # SPI bus host number (adjust based on your board)
    mosi=11,       # Master Out Slave In (adjust based on your hardware)
    miso=13,       # Master In Slave Out (adjust based on your hardware)
    sck=12         # Clock pin (adjust based on your hardware)
)


I2C_BUS = I2C.Bus(
    host=0,
    scl=_CTP_SCL,
    sda=_CTP_SDA,
    freq=100000,
    use_locks=False
)

TOUCH_DEVICE = I2C.Device(
    I2C_BUS,
    dev_id=gt911.I2C_ADDR,
    reg_bits=gt911.BITS
)

_DATA15 = const(14)  # B7 1
_DATA14 = const(21)  # B6 9
_DATA13 = const(47)  # B5 46
_DATA12 = const(48)  # B4 3
_DATA11 = const(45)  # B3 8
_DATA10 = const(4)  # G7
_DATA9 = const(16)  # G6
_DATA8 = const(15)  # G5
_DATA7 = const(7)  # G4
_DATA6 = const(6)  # G3
_DATA5 = const(5)  # G2
_DATA4 = const(1)  # R7 14
_DATA3 = const(9)  # R6 21
_DATA2 = const(46)  # R5 47
_DATA1 = const(3)  # R4 48
_DATA0 = const(8)  # R3 45

bus = lcd_bus.RGBBus(
    hsync=_HSYNC,
    vsync=_VSYNC,
    de=_DE,
    pclk=_PCLK,
    data0=_DATA0,
    data1=_DATA1,
    data2=_DATA2,
    data3=_DATA3,
    data4=_DATA4,
    data5=_DATA5,
    data6=_DATA6,
    data7=_DATA7,
    data8=_DATA8,
    data9=_DATA9,
    data10=_DATA10,
    data11=_DATA11,
    data12=_DATA12,
    data13=_DATA13,
    data14=_DATA14,
    data15=_DATA15,
    freq=_LCD_FREQ,
    hsync_front_porch=_HSYNC_FRONT_PORCH,
    hsync_back_porch=_HSYNC_BACK_PORCH,
    hsync_pulse_width=_HSYNC_PULSE_WIDTH,
    hsync_idle_low=False,
    vsync_front_porch=_VSYNC_FRONT_PORCH,
    vsync_back_porch=_VSYNC_BACK_PORCH,
    vsync_pulse_width=_VSYNC_PULSE_WIDTH,
    vsync_idle_low=False,
    de_idle_high=False,
    pclk_idle_high=False,
    pclk_active_low=_PCLK_ACTIVE_NEG,
    )
#disp=1,

buf1 = bus.allocate_framebuffer(_BUFFER_SIZE, lcd_bus.MEMORY_SPIRAM)
buf2 = bus.allocate_framebuffer(_BUFFER_SIZE, lcd_bus.MEMORY_SPIRAM)

display = rgb_display.RGBDisplay(
    data_bus=bus,
    display_width=_WIDTH,
    display_height=_HEIGHT,
    frame_buffer1=buf1,
    frame_buffer2=buf2,
    backlight_pin=_BCKL,
    backlight_on_state=rgb_display.STATE_PWM,
    color_space=lv.COLOR_FORMAT.RGB565,
    rgb565_byte_swap=False
)

display.set_power(True)
display.init()
display.set_backlight(80)
#indev = gt911.GT911(TOUCH_DEVICE)
indev = gt911.GT911(TOUCH_DEVICE, startup_rotation=lv.DISPLAY_ROTATION._0)

# display.set_rotation(lv.DISPLAY_ROTATION._90)  # NOQA


sd = None

while sd is None:
    try:
        # SD-Karte initialisieren
        sd = SDCard(spi_bus=spi_bus, cs=10, freq=10000000)

        # SD-Karte als VFS mounten (hier als FAT-Dateisystem)
        vfs_sd = vfs.VfsFat(sd)
        os.mount(vfs_sd, "/S")  # Mount-Pfad: "/sd"

        # Überprüfen, ob der Inhalt vorhanden ist
        print("Inhalt von /sd:", os.listdir("/S"))
        # LVGL-Dateisystemtreiber initialisieren und registrieren
        fs_drv = lv.fs_drv_t()  # Dieses Objekt darf nicht vom Garbage Collector entfernt werden!
        # Registrieren Sie den Treiber und geben Sie dabei den Mount-Pfad an (hier "/sd")
        #time.sleep(1)
        fs_driver.fs_register(fs_drv, 'S')
        time.sleep(1)
        
    except Exception as er:
        #sd = None
        print(er)
        print('sd card failure')
        time.sleep(5)
try:

    
        # Bilddaten von der SD-Karte lesen
    with open('S:HoPOS_small_320.bin', 'rb') as file:
       img_data = file.read()
        


     # Neuen Bildschirm erstellen und als aktiv setzen
    screen = lv.obj()
    lv.screen_load(screen)  # Setzt diesen Bildschirm als aktuellen Bildschirm

    # Canvas-Objekt erstellen und Bilddaten darauf anzeigen
    canvas = lv.canvas(screen)  # Canvas wird auf dem erstellten Bildschirm hinzugefügt
    canvas.set_buffer(img_data, 320, 240, lv.COLOR_FORMAT.RGB565)  # Setzt Bildgröße und RGB565-Format
    canvas.align(lv.ALIGN.CENTER, 0, 0)  # Zentriert das Bild auf dem Bildschirm


    th = task_handler.TaskHandler()

    scrn = lv.screen_active()
    scrn.set_style_bg_color(lv.color_hex(0x404040), 0) #0x404040

    slider = lv.slider(scrn)
    slider.set_size(500, 90)
    slider.center()

    label = lv.label(scrn)
    label.set_text('HELLO WORLD!')
    label.align_to(slider, lv.ALIGN.OUT_BOTTOM_MID, 0, 50)
    label.align(lv.ALIGN.CENTER, 0, -50)


    # Erstelle das Label
    label = lv.label(scrn)
    label.set_text('HELLO WORLD!')

    indev.enable_input_priority()
    # Dateipfad zur Schriftartdatei angeben
    font_path = "S:Cochin25_2.bin"  
    font = lv.binfont_create(font_path)
except Exception as e:
    print("Fehler beim Laden der Schriftart:", e)
else:
    if font is None:
        print(f"Schriftartdatei '{font_path}' existiert nicht oder konnte nicht geladen werden.")
        time.sleep(1)
    else:
        print("Schriftart erfolgreich geladen.")
        

Touch Product id: 911
Touch Firmware version: 0x1060
Touch Vendor id: 0x0
Touch resolution: width=800, height=480
Inhalt von /sd: ['test.txt', 'test2.txt', 'HoPOS.bin', 'HoPOS_small_320.bin', 'Cochin25.bin', 'Cochin25_2.bin']
Fehler beim Laden der Schriftart: [Errno 2] ENOENT

[spienz]

How can i test if my font file is correct?
COCHIN_25.bin.txt

[kdschlosser]

It's not correct.

The first 12 bytes in the file should map directly to lv_image_header_t. which is

typedef struct {
    uint32_t magic: 8;          /**< Magic number. Must be LV_IMAGE_HEADER_MAGIC*/
    uint32_t cf : 8;            /**< Color format: See `lv_color_format_t`*/
    uint32_t flags: 16;         /**< Image flags, see `lv_image_flags_t`*/

    uint32_t w: 16;
    uint32_t h: 16;
    uint32_t stride: 16;        /**< Number of bytes in a row*/
    uint32_t reserved_2: 16;    /**< Reserved to be used later*/
} lv_image_header_t;

uint32_t is an unsigned 32 bit integer which means it would be 4 bytes in size. There are bitfield specifiers for all of the fields in the structure.

magic is using 8 bits
cf is using 8 bits
flags is using 16 bits
w is using 16 bits
h is using 16 bits
stride is using 16 bits
and reserved_2 is using 16 bits.

magic is going to be 0x19 for LVGL v9.x.x
cf is the color format,
LV_COLOR_FORMAT_RAW = 0x01
LV_COLOR_FORMAT_RAW_ALPHA = 0x02
LV_COLOR_FORMAT_RGB565 = 0x12
LV_COLOR_FORMAT_ARGB8565 = 0x13
LV_COLOR_FORMAT_RGB888 = 0x0F
LV_COLOR_FORMAT_ARGB8888 = 0x10

flags is for indicating if the data is compressed or not or if the colors are premultiplied.
If compression is used then the next 12 bytes are going to be as follows.

compression type: 4 bytes
compressed data length: 4 bytes
raw data length: 4 bytes

The data follows the first header is not compression is used and if compression is used then it follows the compression header.

You file has the first 12 bytes as

0x30 0x00 0x00 0x00 0x68 0x65 0x61 0x64 0x01 0x00 0x00 0x00

right out of the gate it is not right because the first byte is 0x30 when it should be 0x19. The second byte is also incorrect as it is not a valid color format.

attach the C file and I will convert it to a binary file for ya.

[spienz]

Thx for your fast Response,

thanks for your detailed explanation.
i tried to convert a font file with the LVGL Font converter.
https://lvgl.io/tools/fontconverter

What's wrong with them?

Regards Sebastian

Cochin.ttf.txt

[kdschlosser]

I misunderstood what you said. I thought we were dealing with images.

If you used the font converter that is on LVGL's website then it will work as advertised. There is a trick to getting them to load.

To make it work upload the binary font file to your MCU. The code below is an example of how to get it working.

import lvgl as lv
import fs_driver

fs_drv = lv.lv_fs_drv_t()

fs_driver.fs_register(fs_drv, 'S')

font = lv.binfont_create('S:/path/to/font.bin')

the drive letter 'S' will point to the root directory on the MCU.

[spienz]

Hy
ok know we are confused,
loading from / is working loading from mounted sd is not
sd is mounted an file is displayed

custom_font = lv.binfont_create('S:/COCHINB36.bin') works

custom_font = lv.binfont_create('S:/sd/COCHINB36.bin') not
dir / output
['sd', 'COCHINB36.bin', 'boot.py', 'font_load.py', 'montserrat-22.fnt', 'test.py', 'test_tft.py', 'test_tft2.py', 'test_tft_i2c.py']
dir /sd/ output
['test.txt', 'test2.txt', 'COCHINB36.bin', 'HoPOS_small_320.bin']

any idea

[kdschlosser]

try adding a period between the colon and the first slash.

[spienz]

like this ?

custom_font = lv.binfont_create('S:./sd/COCHINB36.bin')

RuntimeError: fs_open_callback(./sd/COCHINB36.bin) exception: [Errno 2] ENOENT

[kdschlosser]

try removing that for forward slash also remove the period as well.

[mark-hoy]

Here is what MikeW used in some code we are using on a 7" Crowpanel. I used Thonny to load the fonts into a directory called font in the flash. Thanks to Uli Raich for the github fonts (MicroPython Font files)[ https://github.com/uraich/lv_mpy_examples_v8/tree/main/assets/font] screen = lv.obj() fs_drv = lv.fs_drv_t() fs_driver.fs_register(fs_drv, 'S') try: f16 = lv.font_montserrat_16 except: f16 = lv.binfont_create("S:font/montserrat-16.fnt") Mark

…

On Wed, Feb 5, 2025 at 9:43 AM Kevin Schlosser ***@***.***> wrote: try removing that for forward slash also remove the period as well. — Reply to this email directly, view it on GitHub <#174 (reply in thread)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AKFOJBHX53ORIIAMY74YGLD2OJET7AVCNFSM6AAAAABRMXXVYOVHI2DSMVQWIX3LMV43URDJONRXK43TNFXW4Q3PNVWWK3TUHMYTEMBXGI3TANQ> . You are receiving this because you are subscribed to this thread.Message ID: <lvgl-micropython/lvgl_micropython/repo-discussions/174/comments/12072706@ github.com>