ST7789V TFT LCD¶
Usage¶
The st7789v
display platform allows you to use
ST7789V (datasheet,
Tindie)
displays with ESPHome. Note that this component utilizes the 4-Wire SPI bus.

ST7789V TFT LCD on TTGO T-Display module¶
The TTGO T-Display module shown has the display attached to the module’s board and its connections to the ESP32 cannot be changed. Other display modules have pin headers or other connectors which must be connected appropriately to an ESP module.
Note
Displays larger than the 135x240 pixel display on the TTGO T-Display shown require a significant amount of RAM to operate correctly. Some ESP devices, such as the ESP8266, do not have sufficient memory to support this display. If you attempt to use this component and experience repeated crashes, this is likely the cause of the issue.
# Example minimal configuration entry
spi:
clk_pin: GPIO18
mosi_pin: GPIO19
display:
- platform: st7789v
model: TTGO TDisplay 135x240
backlight_pin: GPIO4
cs_pin: GPIO5
dc_pin: GPIO16
reset_pin: GPIO23
lambda: |-
it.print(0, 0, id(font), "Hello World!");
font:
- file: "gfonts://Roboto"
id: font
size: 20
Note
For more information about the font options see: Fonts.
Warning
When using the TTGO T-Display module, the GPIO pin numbers above cannot be changed as they are hardwired within the module/PCB.
Configuration variables:¶
model (Required, string): The display model to use. One of the following options:
TTGO TDisplay 135x240
Adafruit Funhouse 240x240
Adafruit RR 280x240
(round-rectangular display – some pixels are “deleted” from corners to form rounded shape)Custom
(see details below)
cs_pin (Optional, Pin Schema): The CS pin.
dc_pin (Required, Pin Schema): The DC pin.
reset_pin (Required, Pin Schema): The RESET pin.
height (Optional, int): When
model
is set to “Custom”, use this to specify theheight
of the display in pixels. This option may not be specified when themodel
is not set to “Custom”.width (Optional, int): When
model
is set to “Custom”, use this to specify thewidth
of the display in pixels. This option may not be specified when themodel
is not set to “Custom”.offset_height (Optional, int): When
model
is set to “Custom”, use this to specify the display’s vertical offset in pixels. This option may not be specified when themodel
is not set to “Custom”.offset_width (Optional, int): When
model
is set to “Custom”, use this to specify the display’s horizontal offset in pixels. This option may not be specified when themodel
is not set to “Custom”.eightbitcolor (Optional, boolean): Limits the supported color depth to eight bits. May be useful on memory-constrained devices.
backlight_pin (Optional, Pin Schema): The display’s backlight pin.
lambda (Optional, lambda): The lambda to use for rendering the content on the display. See Display Rendering Engine for more information.
update_interval (Optional, Time): The interval to re-draw the screen. Defaults to
5s
.pages (Optional, list): Show pages instead of a single lambda. See Display Pages.
id (Optional, ID): Manually specify the ID used for code generation.
Note
On memory-constrained devices, it may be possible to use part of the display area by setting the model to “custom”
and specifying a smaller height
and/or width
than that of the actual display.
Configuration examples¶
To use colors in your lambda:
color:
- id: my_red
red: 100%
green: 3%
blue: 5%
...
display:
...
lambda: |-
it.rectangle(0, 0, it.get_width(), it.get_height(), id(my_red));
To bring in color images:
image:
- file: "image.jpg"
id: my_image
resize: 200x200
type: RGB24
...
display:
...
lambda: |-
it.image(0, 0, id(my_image));
Complete example¶
The following is an example YAML configuration that you can add to your base device configuration. It defines:
three fonts (well, one font in three sizes)
a
binary_sensor
that indicates the state of connectivity to the APIa
binary_sensor
for each of the two buttons on the TTGO modulea
switch
, allowing control of the backlight from HAseveral colors
a color image to be shown on the display
time, for display…on the display
the SPI configuration for communicating with the display
the display component itself, for use on the TTGO module
a lambda which paints the screen as shown in the picture above:
blue borders, with a sort of “title bar” along the top
“ESPHome” in yellow in the top left corner
the API connection status, “Online” in green when connected, “Offline” in red when not
the time and date, more or less in the center of the display
To use this example, you need only to provide the font file, “Helvetica.ttf” (or update it to a font of your choosing) and an image file, “image.png” (it may also be a “.jpg”). Place these into the same directory as the YAML configuration file itself. Comment/Uncomment/Modify the appropriate lines of C code in the lambda to hide or show the image or text as you wish.
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_12
size: 12
binary_sensor:
- platform: status
name: "Node Status"
id: system_status
- platform: gpio
pin:
number: GPIO0
inverted: true
mode:
input: true
pullup: true
name: "T-Display Button Input 0"
id: tdisplay_button_input_0
- platform: gpio
pin:
number: GPIO35
inverted: true
name: "T-Display Button Input 1"
id: tdisplay_button_input_1
# Allow dimmable control of the backlight (pin GPIO4)
output:
- platform: ledc
pin: GPIO4
id: gpio4
light:
- platform: monochromatic
output: gpio4
name: "Backlight"
image:
- file: "image.png"
id: my_image
resize: 200x200
type: RGB24
time:
- platform: homeassistant
id: esptime
spi:
clk_pin: GPIO18
mosi_pin: GPIO19
display:
- platform: st7789v
cs_pin: GPIO5
dc_pin: GPIO16
reset_pin: GPIO23
rotation: 270
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)); // header bar
it.strftime((240 / 2), (140 / 3) * 1 + 5, id(helvetica_24), id(my_gray), TextAlign::CENTER, "%Y-%m-%d", id(esptime).now());
it.strftime((240 / 2), (140 / 3) * 2 + 5, id(helvetica_48), id(my_gray), TextAlign::CENTER, "%H:%M:%S", id(esptime).now());
it.print(5, 5, id(helvetica_12), id(my_yellow), TextAlign::TOP_LEFT, "ESPHome");
// Comment out the above lines to see the image without text overlaid
// it.image(0, 0, id(my_image));
if (id(system_status).state) {
it.print(235, 5, id(helvetica_12), id(my_green), TextAlign::TOP_RIGHT, "Online");
}
else {
it.print(235, 5, id(helvetica_12), id(my_red), TextAlign::TOP_RIGHT, "Offline");
}