ESP Home with ili9341 480x320px display

ESPHome
1

UPDATE: This morning I looked at the underside of the display PCB and it’s says “480x320” not 310x240.

Get_width and get_height appear to return 320x240 as shown in the log below.

I have updated the title of the thread accordingly

OP:
Hi All, I bought one of these displays (the 4" version) from Ali Express and am trying to get it working with ESPHome 2022.9.4 which in turn is being used to flash an ESP32 device.

The black area should occupy the whole of the screen area the border should be blue and heaven knows why I have got noise on the right of the screen.

In the logs for the device I can see the screen size being detected correctly (see below). After the log file I have included the yaml for the esphome project. Any idea what I am doing wrong? Rotating the screen (in the yaml) doesn’t seem to make any difference and from searching I’m not the only one with this issue.

Thanks to anyone who can give me some clues on where to start fixing it.

[19:20:31][C][wifi:365]: Hostname: ‘esp32-hd2-display’
[19:20:31][C][wifi:367]: Signal strength: -54 dB ▂▄▆█
[19:20:31][C][wifi:371]: Channel: 3
[19:20:31][C][wifi:372]: Subnet: 255.255.255.0
[19:20:31][C][wifi:373]: Gateway: 192.168.0.1
[19:20:31][C][wifi:374]: DNS1: 192.168.0.1
[19:20:31][C][wifi:375]: DNS2: 0.0.0.0
[19:20:31][C][logger:275]: Logger:
[19:20:31][C][logger:276]: Level: DEBUG
[19:20:31][C][logger:277]: Log Baud Rate: 115200
[19:20:31][C][logger:278]: Hardware UART: UART0
[19:20:31][C][spi:101]: SPI bus:
[19:20:31][C][spi:102]: CLK Pin: GPIO18
[19:20:31][C][spi:103]: MISO Pin: GPIO19
[19:20:31][C][spi:104]: MOSI Pin: GPIO23
[19:20:31][C][spi:106]: Using HW SPI: YES
[19:20:31][C][ili9341:029]: ili9341
[19:20:31][C][ili9341:029]: Rotations: 0 °
[19:20:31][C][ili9341:029]: Dimensions: 240px x 320px
[19:20:31][C][ili9341:030]: Reset Pin: GPIO17
[19:20:31][C][ili9341:031]: DC Pin: GPIO27
[19:20:31][C][ili9341:033]: Update Interval: 1.0s
[19:20:31][C][homeassistant.time:010]: Home Assistant Time:
[19:20:31][C][homeassistant.time:011]: Timezone: ‘GMT0BST,M3.5.0/1,M10.5.0’
[19:20:31][C][captive_portal:088]: Captive Portal:
[19:20:31][C][mdns:100]: mDNS:
[19:20:31][C][mdns:101]: Hostname: esp32-hd2-display
[19:20:31][C][ota:089]: Over-The-Air Updates:
[19:20:31][C][ota:090]: Address: esp32-hd2-display.local:3232
[19:20:31][C][ota:093]: Using Password.
[19:20:31][C][api:138]: API Server:
[19:20:31][C][api:139]: Address: esp32-hd2-display.local:6053
[19:20:31][C][api:141]: Using noise encryption: YES

YAML:

esphome:
  name: "esp32-hd2-display"

esp32:
  board: esp32dev
  framework:
    type: arduino

# Enable logging
logger:

time:
  - platform: homeassistant
    id: esptime

color:
  - id: my_red
    red: 100%
    green: 0%
    blue: 0%
  - id: my_yellow
    red: 100%
    green: 100%
    blue: 0%
  - id: my_green
    red: 0%
    green: 100%
    blue: 0%
  - id: my_blue
    red: 0%
    green: 0%
    blue: 100%
  - id: my_gray
    red: 50%
    green: 50%
    blue: 50%

font:
  - file: "arial.ttf"
    id: arial_48
    size: 48
  - file: "arial.ttf"
    id: arial_36
    size: 36
  - file: "arial.ttf"
    id: arial_24
    size: 24
  - file: "arial.ttf"
    id: arial_12
    size: 12
  - file: "arial.ttf"
    id: arialbd_font
    size: 12

globals:
  - id: enable_change
    type: bool
    restore_value: no
    initial_value: 'true'

spi:
  clk_pin: GPIO18
  mosi_pin: GPIO23
  miso_pin: GPIO19

#output:
#  - platform: ledc
#    pin: 32
#    id: gpio_32_backlight_pwm

display:
  - platform: ili9341
    model: TFT 2.4
    cs_pin: GPIO5
    dc_pin: GPIO27
    reset_pin: GPIO17
    auto_clear_enabled: True
    update_interval: 1s
    id: my_display
    led_pin: GPIO32 
    rotation: 0
    lambda: |-
      it.rectangle(0,  0, it.get_width(), it.get_height(), id(my_blue));
      it.rectangle(0, 20, it.get_width(), it.get_height(), id(my_blue));
      it.strftime((240 / 2), (140 / 3) * 1 + 5, id(arial_24), id(my_gray), TextAlign::CENTER, "%Y-%m-%d", id(esptime).now());
      it.strftime((240 / 2), (140 / 3) * 2 + 5, id(arial_48), id(my_gray), TextAlign::CENTER, "%H:%M:%S", id(esptime).now());
      it.print(5, 5, id(arial_12), id(my_yellow), TextAlign::TOP_LEFT, "ESPHome");
      


# Enable Home Assistant API

20221013_190915
20221013_1909151920×1081 154 KB

2

Please edit your post and put your yaml inside “preformatted text” tags. It’s unreadable as it is.

Preformatted text tags are accessed by clicking </> on the little toolbar in the post editing box.

1 Like
3

Thank you for that tip. I have put the PC to bed for the night so will sort in the morning

EDIT - Done - that makes it so much easier to read…thanks!

4

Are you sure that the 4" display is really ILI9341?

1 Like
5

It’s possibly an ILI9488 - they often advertise them together with the ILI9341 on Aliexpress.

1 Like
6

Are 9488s supported by esphome ?

Thanks by the way

7

No unfortunately… There is an outstanding issue on Github requesting them to be added.

The best way to use ILI9488 with HA ist to use openHASP, with the display configured as a FreeTouchDeck.

https://openhasp.haswitchplate.com/0.6.3/integrations/home-assistant/howto/

For a larger ESPHome display I use the 3.2 inch ILI9341.

8

Definitely not sure…I made the big mistake of “assuming”!

9

That would make sense - thank you

10

Many thanks for sharing that link. I’ve never heard of openHASP so definitely have to do some reading.

Thanks again.

11

It’s hard to tell just by looking. They have the same pinout and software is similar but different enough to make it not work.

12

I’ve been looking at the code for the ili9341 component and it seems like it would be fairly easy to add a new identity (not sure if that’s the right terml with the resolution of the larger display…

BUT

I know its wrong and I wouldn’t know how to regenerate the component for use.

I guess I’ll just have to be patient :frowning:

13

For anyone interested, I spent all day poring over multiple sites and videos to get this working.

Parts:
4 in with touch == https://www.aliexpress.us/item/2251832829271342.html?spm=a2g0o.order_detail.order_detail_item.7.1fbbf19cSGM7m6&gatewayAdapt=glo2usa
esp32 == https://www.aliexpress.us/item/2251832696801305.html?spm=a2g0o.order_list.order_list_main.23.2bf81802a56ykm&gatewayAdapt=glo2usa

I followed this wiring diagram

I made the changes for IRQ to GPIO2 and I unplugged the display (MISO) so I just have T_D0 to 19(MISO)

YAML file

esphome:
  name: feather
  friendly_name: feather

esp32:
  board: lolin_d32_pro
  framework:
    type: arduino

# Enable logging
logger:

# Enable Home Assistant API




web_server:
  local: true

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

  # Enable fallback hotspot (captive portal) in case wifi connection fails


captive_portal:

color:
  - id: my_red
    red: 100%
    green: 0%
    blue: 0%
  - id: my_yellow
    red: 100%
    green: 100%
    blue: 0%
  - id: my_green
    red: 0%
    green: 100%
    blue: 0%
  - id: my_blue
    red: 0%
    green: 0%
    blue: 100%
  - id: my_gray
    red: 50%
    green: 50%
    blue: 50%

font:
  - file: "Arial.ttf"
    id: arial_48
    size: 48
  - file: "Arial.ttf"
    id: arial_36
    size: 36
  - file: "Arial.ttf"
    id: arial_24
    size: 24
  - file: "Arial.ttf"
    id: arial_12
    size: 12
  - file: "Arial.ttf"
    id: arialbd_font
    size: 12

time:
  - platform: homeassistant
    id: esptime

sensor:
  - platform: homeassistant
    id: inside_temperature
    entity_id: sensor.ste1_thermo1_sht3x_temperature
    internal: true

  - platform: homeassistant
    id: outside_temperature
    entity_id: sensor.pumproom_thermo1_sht3x_temperature
    internal: true

spi:
 clk_pin: 18 #display SCK/touch T_CLK
 mosi_pin: 23 #display SDI(MOSI)/touch T_DIN
 miso_pin: 19 #touch T_DO

touchscreen:
  platform: xpt2046
  id: my_touchscreen
  cs_pin: 13 #touch T_CS
  interrupt_pin: 2 #touch T_IRQ
  update_interval: 50ms
  report_interval: 1s
  threshold: 400
  calibration_x_min: 3860
  calibration_x_max: 280
  calibration_y_min: 340
  calibration_y_max: 3860
  swap_x_y: false
  on_touch:
    - lambda: |-
          ESP_LOGI("cal", "x=%d, y=%d, x_raw=%d, y_raw=%0d",
              id(my_touchscreen).x,
              id(my_touchscreen).y,
              id(my_touchscreen).x_raw,
              id(my_touchscreen).y_raw
              );

binary_sensor:
  - platform: touchscreen
    id: touch_key0
    x_min: 0
    x_max: 79
    y_min: 0
    y_max: 79
    on_press:
    - logger.log: "Key0 was touched"

  - platform: touchscreen
    id: touch_key1
    x_min: 80
    x_max: 159
    y_min: 0
    y_max: 79
    on_state:
      - lambda: 'ESP_LOGI("main", "key1: %s", (x ? "touch" : "release"));'

      
display:
  - platform: ili9xxx
    model: ili9488
    cs_pin: 27 #display CS
    dc_pin: 14 #display DC
    reset_pin: 26 #display RESET
    rotation: 180
    id: tft_ha_test
    lambda: |-
      it.rectangle(0,  0, it.get_width(), it.get_height(), id(my_blue));
      it.rectangle(0, 20, it.get_width(), it.get_height(), id(my_blue));
      it.strftime((480 / 2), (140 / 3) * 1 + 5, id(arial_24), id(my_green), TextAlign::CENTER, "%Y-%m-%d", id(esptime).now());
      it.strftime((480 / 2), (140 / 3) * 2 + 5, id(arial_48), id(my_green), TextAlign::CENTER, "%H:%M:%S", id(esptime).now());
      if (id(inside_temperature).has_state()) {it.printf((120 / 2), (140 / 3) * 1 + 5, id(arial_24), id(my_green), TextAlign::CENTER, "%.1f°", id(inside_temperature).state); }
      if (id(outside_temperature).has_state()) {it.printf((850 / 2), (140 / 3) * 1 + 5, id(arial_24), id(my_green), TextAlign::CENTER, "%.1f°", id(outside_temperature).state); }
      it.print(240, 5, id(arial_12), id(my_green), TextAlign::TOP_CENTER, "Home Thermostat Upstairs");

20231121_150408
20231121_1504081920×2560 524 KB