see your Home Assistant entities on a TTGO T-display ST7789V TFT LCD

by roger · Published 02-2021 · Updated 02-2021

The inspiration for this mini-project came from a need to display my oven temperature in a convenient place in the kitchen. I might instead need to see the time of the next train, the oil tank level, the broadband speed or indeed the state of any Home Assistant sensor. Whatever, this project needs only a TTGO LCD T-display and a USB outlet to power it. You’ll need a USB-C type cable because that’s what LILYGO/TTGO use on this device.
The project is made straightforward by the display and ESP32 arriving as one unit. You need only modify my code to suit. I had these displays for months before I saw what to do so I hope it’s useful to bring that understanding together here. If you wanted to use a battery to power it, a lead is supplied with the board (but why not use a phone power bank instead).
The display is full colour, 1.14 inches and offers good resolution. If you need to display lots of information at once consider this display project with an old monitor for a shelf somewhere.

Find a Li-po battery like this, and make use of the charging circuit if you will.

find a location for the TTGO T-display

If you use a 3D printer a search at thingiverse.com will find a suitable case to protect the unit. My kitchen location, where I glued the display to the back of a smoked glass door seemed like an ideal one. I powered the TTGO T-display via a USB splitter (1 male to 2 female). It draws very little power.

what you need for this

a TTGO T-Display and USB cable
Home Assistant running on a Raspberry Pi – my setup instructions
A ‘add-on’ called ESPhome which is found in the add-on store – see how I did it

go to ESPhome in Home Assistant, add a ‘new node’ and use this configuration

Go to the ESPHome section of Home Assistant and create a new node (+ sign). A ‘node’ is the place where you tell the display what you want it to do – you do that in lines of text below, adding for example your wifi details.

The following code can replace the code in a newly created ‘node’. You must put a font called Helvetica.ttf in the ESPHome folder in Home Assistant (use the File Editor to upload this). You can use any TTF font (such as Gillsans.ttf) but you must either rename it (to Helvetica.ttf) or edit the code below.

In short, add and customize the code below using the Esphome editor. See below for the options available.
Save, Validate and then COMPILE the code and DOWNLOAD BINARY.
Get the app called ESPflasher > connect the T-Display to your PC with a USB lead.
In ESPflasher, choose the COM port that’s just appeared, choose the binary file you just made and click Flash firmware.
If nothing happens click View the logs. After pressing one of the buttons you might see ‘waiting for download’ which suggests now is the time to click Flash firmware.

# Create a new node in ESPHome. Add these lines to the yaml file 
substitutions:
  devicename: ttgo_oven

esphome:
  name: ttgo_oven
  platform: ESP32
  board: featheresp32
logger:
api:
ota:
captive_portal:

wifi:
  ssid: ""
  password: ""
  manual_ip:
    # Set this to the IP of the ESP
    static_ip: 192.168.1.XX
    # Set this to the IP address of the router. Often ends with .1
    gateway: 192.168.1.1
    subnet: 255.255.255.0

    ssid: "ttgo fallback hotspot"
    password: "password"
  # fallback hotspot (captive portal) in case wifi fails

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: "Helvetica.ttf"
    id: helvetica_48
    size: 48
  - file: "Helvetica.ttf"
    id: helvetica_24
    size: 24
  - file: "Helvetica.ttf"
    id: helvetica_S
    size: 14
# put a ttf font called Helvetica.ttf in the esphome folder

binary_sensor:
  - platform: gpio
    pin:
      number: GPIO0
      inverted: true
    name: ${devicename}top push
    id: tdisplay_button_input_0

  - platform: gpio
    pin:
      number: GPIO35
      inverted: true
    id: tdisplay_button_input_1
    name: ${devicename}bottom push

switch:
  - platform: restart
    name: ${devicename} restart

sensor:
  - platform: homeassistant
    id: oven1_temperature
    entity_id: sensor.oven_temperature
    internal: true
  - platform: homeassistant
    id: oven2_temperature
    entity_id: sensor.oven2_temperature
    internal: true
  - platform: homeassistant
    id: my_timer
    entity_id: timer.oventime
    internal: true
  - platform: wifi_signal
    name: "ttgo wifi signal"
    update_interval: 60s

time:
  - platform: homeassistant
    id: esptime

spi:
  clk_pin: GPIO18
  mosi_pin: GPIO19

display:
  - platform: st7789v
    backlight_pin: GPIO4
    cs_pin: GPIO5
    dc_pin: GPIO16
    reset_pin: GPIO23
    rotation: 0
    lambda: |-
      it.printf(50, 30, id(helvetica_48), id(my_yellow), TextAlign::TOP_CENTER, "%.0f°", id(oven1_temperature).state);
      it.printf(50, 120, id(helvetica_48), id(my_yellow), TextAlign::TOP_CENTER, "%.0f°", id(oven2_temperature).state);
      it.strftime(60, 0, id(helvetica_S), id(my_green), TextAlign::TOP_CENTER, "%H:%M", id(esptime).now());
      it.strftime(60, 190, id(helvetica_S), id(my_green), TextAlign::TOP_CENTER, "%A", id(esptime).now());

how to configure the ESPhome code

All of the above was adapted from the ESPhome guide to the ST7789V
Notice that you have options to infinitely change the colour, the font and the font size.
There are two buttons on the display and Home Assistant watches them for a press. You can use them in Home assistant to trigger say turning on a light.
The sensor section shows that you can pull information about any sensor in Home Assistant. I used oven temperatures.
With ‘rotation’ set to O, the display is landscape, 240 pixels long x 140 pixels high. See the example at ESPHome for a portrait version of the display.
The lamda section does the work of positioning the sensor values and the time. Yes, it’s evil – I suggest you get yourself some graph paper and experiment with the text placement.

go to Home Assistant > Integrations to add your TTGO display device entities

Go to the Home Assistant frontend or Configuration. Choose Integrations. If the display hasn’t already been discovered automatically, add ESPhome and enter the IP address you put in the code above.

the oven temperature on a mini- TFT screen near the cooker

Now this was really useful: get a TTGO OLED T-display to display the temperature readings.