Skip to main content

reTerminal E10xx Work with ESPHome for Home Assistant


Get One Now 🖱️

Introduction to Home Assistant​

Home Assistant is a powerful open-source home automation platform that allows you to control and monitor your smart home devices from a single, unified interface. It acts as the central hub for your smart home, enabling you to automate routines, monitor sensors, and create a more intelligent living space.

Why Home Assistant?​

  • Local Control: Unlike many cloud-based solutions, Home Assistant runs locally on your network, ensuring your data stays private and your automations work even without internet access.

  • Extensive Device Support: Home Assistant integrates with thousands of different smart home devices and services, making it highly versatile and future-proof.

  • Powerful Automation: Create sophisticated automation rules that can respond to various triggers like time, device states, sensor readings, and more.

  • Customizable Dashboard: Design your own user interface to display the information that matters most to you.

Learn More 🖱️

Why reTerminal E10xx with Home Assistant?​

The reTerminal E10xx is an excellent companion for Home Assistant for several reasons:

  1. Energy Efficiency: The e-paper display only consumes power when updating content, making it perfect for displaying persistent information like weather forecasts, calendar events, or system status.

  2. Clear Visibility: Unlike LCD screens, e-paper displays are easily readable in any lighting condition, including direct sunlight, making them ideal for wall-mounted home control panels.

  3. Long Battery Life: Combined with deep sleep mode, the display can operate for months on a single battery charge while still providing valuable information at a glance.

  4. Flexible Integration: Through ESPHome, the display seamlessly integrates with Home Assistant, allowing you to show any data from your smart home system in an elegant, always-visible format.

These advantages make the reTerminal E10xx an ideal choice for creating an energy-efficient, always-on information display for your Home Assistant setup.

ESPHome Integration​

ESPHome is an open-source firmware creation tool specifically designed for ESP8266/ESP32 devices. It allows you to create custom firmware using simple YAML configuration files, which can then be flashed to your device. For the reTerminal E10xx, ESPHome serves as the essential middleware that enables communication between the device and Home Assistant.

The system works by converting your YAML configuration into fully-featured firmware that runs on your ESP device. This firmware handles all the complex tasks of connecting to your network, communicating with Home Assistant, and controlling the ePaper display. When combined with Home Assistant, ESPHome provides a robust platform for creating sophisticated home automation displays and controls.

Let's explore how to set it up and make the most of this versatile display.

Getting Started​

Before the tutorial content of this article begins, you may need to have the following hardware ready.

Materials Required​

reTerminal E10xxHome Assistant Green
Get One Now 🖱️
Get One Now 🖱️

Home Assistant Green is the easiest and most privacy-focused way to automate your home. It offers an effortless setup and allows you to control all the smart devices with just one system, where all the data is stored locally by default. This board benefits from the thriving Home Assistant ecosystem and it will be improved every month by open source.

We recommend using Home Assistant Green as the Home Assistant host for this tutorial, or you can use any Home Assistant host with a Supervisor.

install Home Assistant

We have also written how to install Home Assistant for some of Seeed Studio products, please refer to them.

If you are not using a Seeed Studio product, you can also check and learn how to install Home Assistant for other products on the official Home Assistant website.

Step 1. Install ESPHome​

note

If you have already installed ESPHome, you can skip this step.

Go to Settings -> Add-ons -> ADD-ON STORE

Enter the search term ESPHome.

Click on INSTALL and START.

tip

If you can't find ESPHome in the add-on store, make sure you're using a Home Assistant installation that supports add-ons (like Home Assistant OS or supervised installations). For other installation types (like Home Assistant Container), you may need to run the ESPHome Device Builder independently using Docker. See the official ESPHome documentation for more details.

Step 2. Add a new device​

Go to ESPHome and click on NEW DEVICE.

Give the device a name you like and select ESP32-S3 for chip type, then click on SKIP.

After you create a new device, click EDIT.

Inside the default generated code, the framework of esp32 may be esp-idf, which we need to change to arduino.

Step 3. Install firmware​

This is a very basic example and will show "Hello World!" on the display.

The main purpose is to show you different ways to install firmware to the device.

You can use this example by copying the code below and pasting it after the captive_portal code line in your Yaml file.

# define font to display words
font:
  - file: "gfonts://Inter@700"
    id: font1
    size: 24

# define SPI interface
spi:
  clk_pin: GPIO7
  mosi_pin: GPIO9

display:
  - platform: waveshare_epaper
    id: epaper_display
    model: 7.50inv2
    cs_pin: GPIO10
    dc_pin: GPIO11
    reset_pin:
      number: GPIO12
      inverted: false
    busy_pin:
      number: GPIO13
      inverted: true
    update_interval: 30s
    lambda: |-
      it.print(0, 0, id(font1), "Hello World!");

Click INSTALL to install the code to the device and you will see the following image.

tip

If your Home Assistant Host (Raspberry PI/Green/Yellow etc.) is far away from you, we recommend using this method. You can install it with the computer you have on hand.

First, you need to click Manual download to download the compiled firmware.

Open this website where we will upload the firmware to the ePaper panel.

Go back to ESPHome to download the firmware.

Select Factory format.

Use USB cable to connect the ePaper panel to your computer and click CONNECT.

Select usbmodemxxx(Windows is COMxxx) and click connect. Encountered a problem? Click here.

Click INSTALL and select the firmware you just downloaded.

Wait a moment and you will see 'Hello world!' on the display ～

Basic for drawing in ESPHome​

Drawing Simple Graphics​

This example YAML code configures the SPI interface and the reTerminal E10xx for an ESPHome project. The lambda section contains drawing commands that render simple shapes on the screen:

  • Two rectangles (one at position (10, 10) with size 100x50, and another at (150, 10) with size 50x50)
  • One circle at (250, 35) with a radius of 25
  • Two filled rectangles (at (10, 80) and (150, 80))
  • One filled circle at (250, 105) with a radius of 25

You can use this example by copying the code below and pasting it after the captive_portal code line in your Yaml file.

spi:
  clk_pin: GPIO7
  mosi_pin: GPIO9

display:
  - platform: waveshare_epaper
    id: epaper_display
    model: 7.50inv2
    cs_pin: GPIO10
    dc_pin: GPIO11
    reset_pin:
      number: GPIO12
      inverted: false
    busy_pin:
      number: GPIO13
      inverted: true
    update_interval: 30s
    lambda: |-
      it.rectangle(10, 10, 100, 50);
      it.rectangle(150, 10, 50, 50);
      it.circle(250, 35, 25);
      it.filled_rectangle(10, 80, 100, 50);
      it.filled_rectangle(150, 80, 50, 50);
      it.filled_circle(250, 105, 25);

When you see the feedback like the following image, it means the code is running successfully.

Due to space constraints, we will not elaborate too much on the drawing methods and principles of other patterns, if necessary, the reader is recommended to read ESPHome in this part of the detailed examples.

Getting values from Home Assistant for display​

To display weather data on your reTerminal E10xx device, you'll need to access temperature, weather conditions, and wind speed data from Home Assistant. The Open-Meteo integration provides reliable weather data that can be accessed through Developer Tools.

Installing Open-Meteo Integration​

Step 1. Open your Home Assistant dashboard and navigate to Settings → Devices & Services.

Step 2. Click the Add Integration button in the bottom right corner.

Step 3. Search for "Open-Meteo" and select it from the list.

Step 4. Follow the configuration wizard to set up your location and preferred units.

Step 5. Once installed, the Open-Meteo integration will create several weather-related entities in your Home Assistant instance.

Accessing Weather Data in Developer Tools​

After installing the Open-Meteo integration, you can access the weather data through Developer Tools:

Step 1. In your Home Assistant dashboard, navigate to Developer Tools → States.

Step 2. In the filter box, type weather to find the main weather entity.

Step 3. Click on the entity to view all available attributes. The key weather attributes include:

  • temperature: Current temperature (in your configured units)
  • wind_bearing: Wind Bearing
  • wind_speed: Wind speed

Using Weather Data in ESPHome​

To use this weather data in your ESPHome configuration for the reTerminal E10xx, you'll need to set up a Home Assistant API connection in your ESPHome YAML configuration:

# Example ESPHome configuration to retrieve weather data
# Get info from HA, as string format
text_sensor:
  - platform: homeassistant
    entity_id: weather.home
    id: myWeather
    internal: true
  - platform: homeassistant
    entity_id: weather.home
    id: myTemperature
    attribute: "temperature"
    internal: true

# Get info from HA, as float format
sensor:
  - platform: homeassistant
    entity_id: weather.home
    id: myWindBearing
    attribute: "wind_bearing"
    internal: true

This configuration creates sensor entities in your ESPHome device that pull data from the Home Assistant weather integration. You can then use these sensors to update your reTerminal E10xx display with the current weather information.

tip

For forecast data, you'll need to use the weather.open_meteo_forecast entities which contain predicted values for future days.

Finally, add the code for the display section to use these values above. The complete code is as follows:

# Example ESPHome configuration to retrieve weather data
# Get info from HA, as string format
text_sensor:
  - platform: homeassistant
    entity_id: weather.home
    id: myWeather
    internal: true
  - platform: homeassistant
    entity_id: weather.home
    id: myTemperature
    attribute: "temperature"
    internal: true

# Get info from HA, as float format
sensor:
  - platform: homeassistant
    entity_id: weather.home
    id: myWindBearing
    attribute: "wind_bearing"
    internal: true

font:
  - file: "gfonts://Inter@700"
    id: myFont
    size: 24

# define SPI interface
spi:
  clk_pin: GPIO7
  mosi_pin: GPIO9

display:
  - platform: waveshare_epaper
    id: epaper_display
    model: 7.50inv2
    cs_pin: GPIO10
    dc_pin: GPIO11
    reset_pin:
      number: GPIO12
      inverted: false
    busy_pin:
      number: GPIO13
      inverted: true
    update_interval: 30s
    lambda: |-
      //print info in log
      ESP_LOGD("epaper", "weather: %s", id(myWeather).state.c_str());
      ESP_LOGD("epaper", "temperature: %s", id(myTemperature).state.c_str());
      ESP_LOGD("epaper", "pressure: %.1f", id(myWindBearing).state);
      //display info in epaper screen
      it.printf(100, 100, id(myFont), "%s", id(myWeather).state.c_str());
      it.printf(100, 150, id(myFont), "%s", id(myTemperature).state.c_str());
      it.printf(100, 200, id(myFont), "%.1f", id(myWindBearing).state);

After compiling the above code and uploading it to your device, you may first see NaN displayed on the screen, please don't worry, this is normal. This is due to the fact that the device has not yet been added to the Home Assistant environment, so reTerminal has not yet been able to acquire Home Assistant data. We just need to follow the steps below to add the device.

Adding reTerminal E10xx to Home Assistant​

Step 1. After flashing your device, return to Home Assistant and navigate to Settings → Devices & Services.

Step 3. Home Assistant should automatically discover your reTerminal E10xx device via mDNS. If it appears in the discovered devices section, click Configure to add it.

Step 4. If the device isn't automatically discovered, click Add Integration and search for "ESPHome".

Step 5. Enter the IP address of your reTerminal E10xx device and the API encryption key if you set one.

Step 6. Once connected, your reTerminal E10xx will appear as a device in Home Assistant with all its sensors and components available.

Here's the enhanced Demo 3 content with improved formatting, image placement, and additional descriptions:

Drawing TrueType fonts​

This example demonstrates how to display custom icons on your reTerminal E10xx using TrueType fonts. Material Design Icons provide a wide range of scalable symbols perfect for e-paper displays.

Installing Required Tools​

Step 1. First, we need to install the Studio Code Server add-on to manage files. Navigate to the Home Assistant Add-ons store, search for Studio Code Server and click on it.

Step 2. Click on INSTALL and wait for the installation to complete. Once installed, click START to launch the editor.

Setting Up Icon Fonts​

Step 3. Create a new folder called fonts in your ESPHome configuration directory. This folder will store the TrueType font files needed for displaying icons.

Step 4. Download the Material Design Icons font file by clicking the button below and extract the contents.

Step 5. Upload the downloaded font file (materialdesignicons-webfont.ttf) to the fonts folder you created earlier.

Configuring ESPHome for Icons​

Step 6. Add the following code to your ESPHome configuration file after the captive_portal section. This code defines two font sizes for icons and configures the display to show weather icons.

font:
  - file: 'fonts/materialdesignicons-webfont.ttf'  # Path to the font file
    id: font_mdi_large
    size: 200        # Large icon size
    glyphs: &mdi-weather-glyphs
      - "\U000F0595" # weather-cloudy icon
      - "\U000F0592" # weather-hail icon
  - file: 'fonts/materialdesignicons-webfont.ttf'
    id: font_mdi_medium   # Medium icon size
    size: 40
    glyphs: *mdi-weather-glyphs

spi:
  clk_pin: GPIO7
  mosi_pin: GPIO9

display:
  - platform: waveshare_epaper
    id: epaper_display
    model: 7.50inv2
    cs_pin: GPIO10
    dc_pin: GPIO11
    reset_pin:
      number: GPIO12
      inverted: false
    busy_pin:
      number: GPIO13
      inverted: true
    update_interval: 30s
    lambda: |-
      it.printf(100, 200, id(font_mdi_medium), TextAlign::CENTER, "\U000F0595");
      it.printf(400, 200, id(font_mdi_large), TextAlign::CENTER, "\U000F0592");
note

The glyphs section defines which icons to load from the font file. Loading only the icons you need saves memory on your device.

Step 7. Save your configuration and upload it to your reTerminal E10xx. When you see feedback like the following image, it means the code is running successfully.

Customizing with Different Icons​

The Material Design Icons library contains thousands of icons you can use in your projects. Here's how to find and use different icons:

Step 1. Visit the Material Design Icons website by clicking the button below.

Step 2. Search for an icon you want to use in your project. You can browse by category or use the search function.

Step 3. When you find an icon you like, click on it to view its details. Look for the Unicode value, which will be in the format F0595.

Step 4. Add the Unicode value to your ESPHome configuration by:

  • Adding it to the glyphs list in your font configuration
  • Updating the display code to use the new icon

For example, to use a new icon with Unicode F0123:

glyphs:
  - "\U000F0595" # weather-cloudy icon
  - "\U000F0592" # weather-hail icon
  - "\U000F0123" # your new icon

And in the display lambda:

lambda: |-
  it.printf(100, 200, id(font_mdi_medium), TextAlign::CENTER, "\U000F0123");

Step 5. Save your updated configuration and upload it to your device to see the new icon.

tip

For weather dashboards, consider using icons like F0590 (sunny), F0591 (partly cloudy), F0593 (rainy), and F059E (windy).

By combining these icons with the weather data from Home Assistant that we set up earlier, you can create a dynamic weather display that shows the current conditions using appropriate icons.

Displaying Custom Images​

This example demonstrates how to display custom images on your reTerminal E10xx e-paper display. You can use this feature to show logos, icons, or any graphics that enhance your dashboard experience.

Preparation​

Step 1. Ensure you have the Studio Code Server add-on installed in Home Assistant. If you haven't installed it yet, follow the instructions from the previous example.

Step 2. Create a new folder called image in your ESPHome configuration directory. This folder will store the image files you want to display.

config/
└── esphome/
    ├── your_device.yaml
    └── image/         <- Create this folder

Adding Images​

Step 3. Download a sample image to test the functionality. You can use the WiFi icon provided below or use your own image.

Step 4. Upload the downloaded image to the image folder you created earlier using the Studio Code Server file manager.

tip

For best results on e-paper displays, use high-contrast images with clear black and white areas. JPG and PNG formats are both supported.

Configuring ESPHome for Image Display​

Step 5. Add the following code to your ESPHome configuration file after the captive_portal section. This code defines the image resource and configures the display to show it.

image:
  - file: /config/esphome/image/wifi.jpg    # Path to your image file (JPG or PNG)
    id: myImage
    type: BINARY                            # Binary mode works best for e-paper
    resize: 800x480                         # Resize to match display resolution
    invert_alpha: true                      # Invert colors if needed

spi:
  clk_pin: GPIO7
  mosi_pin: GPIO9

display:
  - platform: waveshare_epaper
    id: epaper_display
    model: 7.50inv2
    cs_pin: GPIO10
    dc_pin: GPIO11
    reset_pin:
      number: GPIO12
      inverted: false
    busy_pin:
      number: GPIO13
      inverted: true
    update_interval: 30s
    lambda: |-
      it.image(0, 0, id(myImage));          # Display image at position (0,0)

Step 6. Save your configuration and upload it to your reTerminal E10xx. When the update completes, your e-paper display will show the image.

Advanced Image Techniques​

You can enhance your image display with these additional techniques:

Positioning Images

To position your image at specific coordinates on the screen:

lambda: |-
  // Display image at position (100,50)
  it.image(100, 50, id(myImage));

Combining Images with Text

You can display both images and text on the same screen:

lambda: |-
  // Display image
  it.image(0, 0, id(myImage));
  
  // Add text below or beside the image
  it.printf(400, 400, id(font1), TextAlign::CENTER, "WiFi Connected");

Using Multiple Images

To display multiple images on the same screen, define each image in your configuration:

image:
  - file: /config/esphome/image/wifi.jpg
    id: wifiImage
    type: BINARY
    resize: 200x200
  
  - file: /config/esphome/image/temperature.png
    id: tempImage
    type: BINARY
    resize: 200x200

# In the display lambda:
lambda: |-
  it.image(50, 50, id(wifiImage));
  it.image(300, 50, id(tempImage));
caution

Remember that e-paper displays have limited refresh rates. The update_interval: 30s setting means your display will refresh only every 30 seconds. Adjust this value according to your needs, but be aware that frequent refreshes can reduce the lifespan of e-paper displays.

By combining images with text and other display elements covered in previous examples, you can create rich, informative dashboards on your reTerminal E10xx.

Continue Reading​

Due to space constraints, this article only covers some basic use cases and drawing examples of the device. We will cover the use of reTerminal's hardware on ESPHome in more detail in the Advanced ESPHome Usage of reTerminal E10xx in Home Assistant's Wiki, which you can read on.

FAQ​

Q1: Why is there no data?​

In this case, you should go to Settings -> Devices & Services -> Integrations to RECONGFIGURE device. Haven't found your reTerminal? Try to reboot Home Assistant.

Q2: Why can't I get those data in Home Assistant?​

In this case, you should go to Settings -> Devices & Services -> Integrations to ADD your device to HA.

Q3: reTerminal E10xx can't connect to you computer?​

Try unplugging and replugging it several times, or just install the driver according to the prompts.

Tech Support & Product Discussion​

Thank you for choosing our products! We are here to provide you with different support to ensure that your experience with our products is as smooth as possible. We offer several communication channels to cater to different preferences and needs.

Loading Comments...