Problem driving 4.0 inch IPS RGB Interface 480x480 TFT Touch Screen Panel

ESPHome
1

Problem driving 4.0 inch IPS RGB Interface 480x480 TFT Touch Screen Panel

I attempted to use this screen to create a control panel with LVGL, but I failed get it to show anything.

This is screen I use:
yuyinglcd.com/en/products/1/4/245

This is the development board I used, ESP32-S3-WROOM-1-N16R8, FLASH size is 16MB，PSRAM size is 8Mb. This is part of the schematic diagram, including the LED backlight:

image
image1336×1309 314 KB

The driver IC is ST7701s and touch IC is FT6336U
The FPC connector of the screen module is the same as above.

Pin no. Symbol Function
1 A Anode of LED backlight
2 K Cathode of LED backlight
3 K Cathode of LED backlight
4 GND Ground
5 VCI Power supply
6 RESET When /RESET is set to “L”, the register settings are initialized
7-8 NC DUMMY
9 SDA Serial input data
10 SCK Serial input clock
11 CS Chip select signal. When /CS = ‘L’, the chip select becomes active, and data/command I/O is enabled
12 DCLK Dot clock signal
13 DE Data enable input in RGB interface
14 VSYNC Vertical SYNC signal
15 HSYNC Horizon SYNC signal
16-33 DB0-DB17 Data bus
34 GND Ground
35 TP_INT TP break off; interrupt; suspend
36 TP_SDA TP serial input/output signal in serial interface mode
37 TP_SCL TP In Serial Interface, this is used as SCL
38 TP_RESET This signal will reset the device and must be applied to properly initialize the chip
39 TP_VCI Power supply, 2.8–3.3V typ
40 GND Ground

This is the yaml configuration I wrote:

esphome:
  name: lcd
  friendly_name: LCD

esp32:
  board: esp32-s3-devkitc-1
  framework:
    type: esp-idf

# Enable logging
logger:
  level: DEBUG
# Enable Home Assistant API
api:
  encryption:
    key: "T/8n+bsdV0R83UkdGOrW70uSPoMhEls8hNTNgQQ7leE="

ota:
  - platform: esphome
    password: "03888d263616966f60ad7cde08c141a6"

wifi:
  ssid: !secret wifi_ssid
  password: !secret wifi_password

  # Enable fallback hotspot (captive portal) in case wifi connection fails
  ap:
    ssid: "Lcd Fallback Hotspot"
    password: "VUT39O2F64iI"

captive_portal:

# SPI (initialize ST7701)
spi:
  mosi_pin: GPIO39
  clk_pin:  GPIO38
  
# Example minimal configuration entry
display:
  - platform: st7701s
    id: lcd
    spi_mode: MODE3
    color_order: RGB
    dimensions:
      width: 480
      height: 480
    cs_pin: GPIO45
    # reset_pin: GPIOXX
    de_pin: GPIO47
    hsync_pin: GPIO14
    vsync_pin: GPIO21
    pclk_pin: GPIO48

    data_pins:
      red:
        - GPIO0     # DB1
        - GPIO12    # DB2
        - GPIO11    # DB3
        - GPIO10    # DB4
        - GPIO9     # DB5
      green:
        - GPIO46    # DB6
        - GPIO3     # DB7
        - GPIO20    # DB8
        - GPIO19    # DB9
        - GPIO8     # DB10
        - GPIO18    # DB11
      blue:
        - GPIO17    # DB13
        - GPIO16    # DB14
        - GPIO15    # DB15
        - GPIO7     # DB16
        - GPIO6     # DB17


# touch FT6336
i2c:
  sda: GPIO42
  scl: GPIO41
  scan: true

touchscreen:
  platform: ft63x6
  id: my_touch
  interrupt_pin: GPIO5

# backlilght
output:
  - platform: ledc
    pin: GPIO13
    id: backlight

light:
  - platform: monochromatic
    output: backlight
    name: "LCD Backlight"
    id: lcd_backlight

# LVGL config
lvgl:
  displays:
    - lcd
  touchscreens:
    - my_touch
  widgets:
    - label:
        align: CENTER
        text: "Hello, LVGL!"

Can anyone help me find out where is the problem? Is the display platform I used correct?
Really appreciate!

2

Do you turn the backlight on? Probably need a restore mode for it.

1 Like
3

Finally I turned on the backlight and got it working. But there is still some small problem.
The yaml is shown as below:

esphome:
  name: screen
  friendly_name: screen

esp32:
  board: esp32-s3-devkitc-1
  framework:
    type: esp-idf

# Enable logging
logger:
  level: DEBUG

# Enable Home Assistant API
api:
  encryption:
    key: "Bez1NDJgyvj5r9ofdLt1Dp8mT9zPH63WhUttfPUv1qA="

ota:
  - platform: esphome
    password: "ed8af4662ca801786812c94fd312fcfe"

wifi:
  ssid: !secret wifi_ssid
  password: !secret wifi_password

  # Enable fallback hotspot (captive portal) in case wifi connection fails
  ap:
    ssid: "Screen Fallback Hotspot"
    password: "FXKCpAe6Olqt"

    
captive_portal:

output:
  - platform: ledc
    pin: GPIO13
    id: gpio_13_backlight_pwm
    frequency: 20kHz
    channel: 0

light:
  - platform: monochromatic
    output: gpio_13_backlight_pwm
    name: "Display Backlight"
    id: back_light
    restore_mode: ALWAYS_ON
    gamma_correct: 1

# number:
#   # Display Backlight Brightness Adjust
#   - platform: template
#     name: "BackLight Brightness"
#     optimistic: true
#     id: backlight_brightness
#     icon: mdi:brightness-percent
#     unit_of_measurement: "%"
#     initial_value: 80
#     restore_value: true
#     min_value: 5
#     max_value: 100
#     step: 5
#     mode: slider
#   # Screen Timeout Adjust
#   - platform: template
#     name: "Screen Timeout"
#     optimistic: true
#     id: screen_timeout
#     icon: mdi:timer
#     unit_of_measurement: "s"
#     initial_value: 300
#     restore_value: true    
#     min_value: 10
#     max_value: 300
#     step: 5
#     mode: slider

# Example configuration entry
i2c:
  - id: bus_a
    sda: GPIO5
    scl: GPIO4
    scan: False
    frequency: 10kHz

psram:
  mode: octal
  speed: 80MHz

spi:
  clk_pin: GPIO38
  mosi_pin: GPIO39
  interface: spi3
  # miso_pin: 41

touchscreen:
  platform: ft63x6
  id: touchscreen_4_inches
  i2c_id: bus_a
  transform:
      mirror_x: True
      mirror_y: True
      swap_xy: False
  on_touch:
    then:
      # - display.page.show_next: display_4_inches
      # - component.update: display_4_inches
      - logger.log: "Touch, go to next page"

display:
  - platform: st7701s
    id: display_4_inches
    spi_mode: MODE3
    color_order: RGB
    invert_colors: False
    rotation: 180°
    # transform:
    #   mirror_x: true
    #   mirror_y: true
    dimensions:
      width: 480
      height: 480
    cs_pin: GPIO45
    de_pin: GPIO47
    hsync_pin: GPIO14
    hsync_pulse_width: 10
    hsync_front_porch: 20
    hsync_back_porch: 10
    vsync_pin: GPIO21
    vsync_pulse_width: 10
    vsync_front_porch: 10
    vsync_back_porch: 10
    pclk_pin: GPIO48
    pclk_frequency: 21MHz
    pclk_inverted: False
    # update_interval: never
    update_interval: 50ms
    auto_clear_enabled: false

    #data_rate: 75kHz
    init_sequence:
      - [0xFF, 0x77, 0x01, 0x00, 0x00, 0x13]
      - [0xEF, 0x08]
      - [0xFF, 0x77, 0x01, 0x00, 0x00, 0x10]
      - [0xC0, 0x3B, 0x00]
      - [0xC1, 0x0B, 0x02]
      - [0xC2, 0x37, 0x02]
      - [0xCC, 0x10]
      - [0xB0, 0x00, 0x0F, 0x16, 0x0E, 0x11, 0x07, 0x09, 0x09, 0x08, 0x23, 0x05, 0x11, 0x0F, 0x28, 0x2D, 0x18]
      - [0xB1, 0x00, 0x0F, 0x16, 0x0E, 0x11, 0x07, 0x09, 0x08, 0x09, 0x23, 0x05, 0x11, 0x0F, 0x28, 0x2D, 0x18]
      - [0xFF, 0x77, 0x01, 0x00, 0x00, 0x11]
      - [0xB0, 0x4D]
      - [0xB1, 0x33]
      - [0xB2, 0x87]
      - [0xB5, 0x4B]
      - [0xB7, 0x8C]
      - [0xB8, 0x20]
      - [0xC1, 0x78]
      - [0xC2, 0x78]
      - [0xD0, 0x88]
      - [0xE0, 0x00, 0x00, 0x02]
      - [0xE1, 0x02, 0xF0, 0x00, 0x00, 0x03, 0xF0, 0x00, 0x00, 0x00, 0x44, 0x44]
      - [0xE2, 0x10, 0x10, 0x40, 0x40, 0xF2, 0xF0, 0x00, 0x00, 0xF2, 0xF0, 0x00, 0x00]
      - [0xE3, 0x00, 0x00, 0x11, 0x11]
      - [0xE4, 0x44, 0x44]
      - [0xE5, 0x07, 0xEF, 0xF0, 0xF0, 0x09, 0xF1, 0xF0, 0xF0, 0x03, 0xF3, 0xF0, 0xF0, 0x05, 0xED, 0xF0, 0xF0]
      - [0xE6, 0x00, 0x00, 0x11, 0x11]
      - [0xE7, 0x44, 0x44]
      - [0xE8, 0x08, 0xF0, 0xF0, 0xF0, 0x0A, 0xF2, 0xF0, 0xF0, 0x04, 0xF4, 0xF0, 0xF0, 0x06, 0xEE, 0xF0, 0xF0]
      - [0xEB, 0x00, 0x00, 0xE4, 0xE4, 0x44, 0x88, 0x40]
      - [0xEC, 0x78, 0x00]
      - [0xED, 0x20, 0xF9, 0x87, 0x76, 0x65, 0x54, 0x4F, 0xFF, 0xFF, 0xF4, 0x45, 0x56, 0x67, 0x78, 0x9F, 0x02]
      - [0xEF, 0x10, 0x0D, 0x04, 0x08, 0x3F, 0x1F]
      - [0x11]
      - delay 120ms
      - [0x29]

      # - [ 0xE0, 0x1F ]  # Set sunlight readable enhancement

    data_pins:
      blue:
        - GPIO0     # DB1
        - GPIO12    # DB2
        - GPIO11    # DB3
        - GPIO10    # DB4
        - GPIO9     # DB5
      green:
        - GPIO46    # DB6
        - GPIO3     # DB7
        - GPIO20    # DB8
        - GPIO19    # DB9
        - GPIO8     # DB10
        - GPIO18    # DB11
      red:
        - GPIO17    # DB13
        - GPIO16    # DB14
        - GPIO15    # DB15
        - GPIO7     # DB16
        - GPIO6     # DB17

    # lambda: |-
    #   auto white = Color(255, 255, 255);
    #   it.filled_circle(240, 240, 200, white);


# ---------------- LVGL
lvgl:
  displays:
    - display_4_inches
  touchscreens:
    - touchscreen_4_inches

  color_depth: 16
  byte_order: big_endian # or little_endian

  on_idle:
    - timeout: 30s
      then:
        - lvgl.pause
        - logger.log: "LVGL paused (idle)"

  pages:
    - id: main_page
      widgets:
        # - obj:
        #     id: arc_ring_inner
        #     height: 238
        #     width: 238
        #     y: -20
        #     radius: 200
        #     align: CENTER
        #     border_width: 40
        # - label:
        #     align: CENTER
        #     text: "Hello, LVGL!"
        - obj:
            id: green
            x: 0      
            y: -80
            width: 300 
            height: 80  
            bg_color: "0x00ffff"  
            radius: 10
            align: CENTER

        - obj:
            id: red
            x: 0
            y: 0
            width: 300
            height: 80
            bg_color: "0xff0000"
            radius: 10
            align: CENTER
        - obj:
            id: black
            x: 0
            y: 80
            width: 300
            height: 80
            bg_color: "0x000000"
            radius: 10
            align: CENTER
        - obj:
            id: white
            x: 0
            y: 160
            width: 300
            height: 80
            bg_color: "0xffffff"
            radius: 10
            align: CENTER

        - label:
            x: 0
            y: 0
            text: "Hello, LVGL!"
            text_font: "montserrat_30"
            align: CENTER


# lvgl:
#   displays:
#     - display_4_inches
#   # touchscreens:
#   #   - my_touch
#   widgets:
#     - label:
#         align: CENTER
#         text: "Hello, LVGL!"

The color is right, but there comes to a problem: The brightness of the screen is too dark, I’m pretty sure I have the light turned up to max in ha, also I measured GPIO13 which is the ledc connector and it’s 3.3v.
The strange thing is that when I change the invert_colors: False to True, the screen is much brighter even though the colours are wrong. Do you know why?

result
result750×500 47.7 KB

Appreciate your support!

4

you haven’t set the bg_opa of the objs.