An ESPHome-based touch screen panel to install in your house to interface with Home Assistant. This project is based on the esphome-modular-lvgl-buttons library.

Check the esphome-modular-lvgl-buttons library project for a list of supported (touch)screens.

To use this project you should have an ESP32-powered board with an LCD screen of roughly 3.5 inches, with touchscreen support. I'm currently using the WaveShare ESP32-S3-Touch-LCD-3.5B. This a good board with a capacitive touchscreen, which feels good even in the era of smartphones equipped with super accurate, multitouch screens. Alternatives include the Guition and Sunton devices, but I have no experience with those.

See Mechanical Details page

See Electronics Details page

There are 2 ways to develop software for Waveshare devices, as suggested by Waveshare:

1. VSCode + ESP-IDF extension
2. Arduino IDE

However I've chosen a third way: using ESPHome. ESPHome has support for all chips installed on the Waveshare device, see Hardware Details page and offers seamless integration with Home Assistant

This repository contains a working main.yaml ESPHome configuration file that can be used to generate the actual firmware binary and flash it on the board. Please note that this is an ESPHome package and thus it uses substitutions to make the YAML config file as reusable as possible.

The ESPHome firmware uses the LVGL Graphics to render the UI on the display.

In addition this repository provides 2 more ESPHome configuration files:

• dev-sdl.yaml: this is a development-friendly version of main.yaml that allows for quick iteration on your computer, using the SDL backend of ESPHome (so you can test UI changes without re-flashing all the times the real device).

• self-contained.yaml: this is a self-contained ESPHome firmware that does NOT use the esphome-modular-lvgl-buttons library. I used this as early experiment to interface the Waveshare panel with ESPHome.

NOTE: Although I contributed to the esphome-modular-lvgl-buttons library the support for the Waveshare hardware board after some time I decided to decouple this project from 1

For the very-first FLASH on the board, please use the CLI method described below.

See ESPHome usage from Home Assistant UI. Assuming you have ESPHome Builder installed and running, follow this step by step procedure:

1. Click "New Device" in ESPHome Builder interface and choose "Empty Configuration"

2. Copy-paste the following config:

packages: remote_package_files: url: https://github.com/f18m/floor-heating-controller/ files: - path: main.yaml vars: encryption_key: !secret encryption_key wifi_ssid: !secret wifi_ssid wifi_password: !secret wifi_password wifi_ap_password: !secret wifi_ap_password ota_password: !secret ota_password ref: main # optional refresh: 1d # optional esphome: name: "interfacepanel-p0" friendly_name: InterfacePanel-P0

Make sure your ESPHome Builder secrets file contains above keys to allow the device to talk to your Wifi network and your HomeAssistant instance.

3. Hit "Validate" and then "Install".

See ESPHome CLI intro. Assuming you have esphome CLI utility working fine (e.g. you can run esphome version), follow this step by step procedure:

1. Create an interface-panel.yaml file containing the same config reported above in previous section. It points to this GH repository so that esphome will fetch this repo on the fly.

2. Create a secrets.yaml file containing all secrets to allow the device to talk to your Wifi network and your HomeAssistant instance: encryption_key, wifi_ssid, etc.

3. If this is the first time you're flashing the board (brand new device), connect the board via USB to the local computer and update the Makefile to point to the right USB-TTY device, e.g. /dev/ttyACM0. If you're just updating the firmware, then you can do OTA update, just make sure that the IP in the Makefile is correct.

4. Run make flash-main to do an update over the air (OTA). Run make flash-main LOCALLY_ATTACHED=1 to do an update via an USB cable.

See Installation into wall box.

Editing the LVGL configuration via YAMLs is a pain but after a while you will get used to it. The most useful command to develop changes to the UI is:

make test-local

that will use the SDL backend of ESPhome to render locally on your Linux workstation. Maintain the differences between main.yaml and dev-sdl.yaml as minimal as possible to avoid mismatches between the SDL rendering and the actual rendering on the device.

A few links to other similar projects:

• https://github.com/bennydiamond/esphome_lvgl_hmi_garage
• https://github.com/kancelott/neo-nesp
• https://github.com/hareeshmu/climate-control-display