DIY: Smarte Pixel Clock mit ESPHome und dem MAX7219

Willst du eine geniale, smarte Pixel Clock für dein Zuhause bauen? Mit ein wenig ESPHome-Magie und einem MAX7219 LED-Matrix-Display ist das unglaublich einfach. In diesem Beitrag zeige ich dir Schritt für Schritt, wie aus ein paar Einzelteilen ein cooles Gadget für dein Home Assistant Setup wird.

Die ursprüngliche Idee für diese Umsetzung stammt von Adam auf GitHub, der dieses Projekt bereits großartig für Home Assistant dokumentiert hat. Wir bauen seine Variante heute quasi eins zu eins nach. Lass ihm also gerne einen Stern auf GitHub da, wenn dir das Projekt gefällt.

Was genau brauchst du für den Nachbau? Das Herzstück bildet ein Matrix-Display vom Typ MAX7219. Dazu gesellt sich ein passender ESP-Controller sowie ein herkömmliches Netzteil für die Stromversorgung, das du bestimmt noch in einer Schublade findest. Für das Gehäuse kannst du auf einen 3D-Druck zurückgreifen.

Folgende Komponenten nutze ich und diese sind auch im Video:

Es spricht überhaupt nichts dagegen andere Komponenten zu nutzen – insbesondere, wenn du noch einen ESP-Controller zu Hause hast bspw. Achte in diesem Fall nur noch mehr auf die PIN-Belegung, also den korrekten Anschluss.

Es gibt wunderschöne 3D-Druck-Gehäuse, bei denen man die Pins des Displays ablötet und elegant nach hinten wegführt (hierfür einfach auf den entsprechenden Portalen nach „MAX7219“ suchen und die passende Vorlage auswählen). Wenn du es dir wie ich etwas einfacher machen möchtest, wählst du eine Variante, bei der die Pins an der Seite bleiben. Das spart Zeit und Nerven. Adam hat hierzu auch eine simple Variante bereitgestellt.

Als Erstes schnappst du dir den Code aus dem entsprechenden GitHub-Repository. Damit dein ESP direkt reibungslos in deinem WLAN funkt, passt du deine Zugangsdaten und Secrets an. Richte dir am besten auch gleich das Captive Portal samt Fallback-Access-Point ein. Ebenso definierst du deine Keys für den API-Zugriff und die Over-the-Air-Updates in ESPHome:

# Enable Home Assistant API
api:
  encryption:
    #secret anpassen/prüfen
    key: !secret api_key

ota:
  - platform: esphome
    #secret anpassen/prüfen
    password: !secret ota_password


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

  # Enable fallback hotspot (captive portal) in case wifi connection fails
  ap:
    ssid: "Max7219-Esp32-Reg"
    #gerne ein sicheres Passwort wählen
    password: "12345678"

captive_portal:
    

Ein kleiner, aber wichtiger Tipp für den Originalcode: Ändere in Zeile 144 den Parameter auf Minus 1. Machst du das nicht, wird der Text auf dem MAX7219 Display am unteren Rand leicht abgeschnitten.

Original-Code	Anpassung
it.print(0, 0, id(text_font), text.c_str());	it.print(0, -1, id(text_font), text.c_str());

Damit die Anzeige später gut aussieht, benötigst du noch die passenden Schriftarten Basis33 und Eight Bit Dragon. Lade dir diese herunter und kopiere sie einfach in dein ESPHome-Verzeichnis unter config/esphome/fonts. Im YAML-Code von Adam findest du hierfür den benötigten Link in Zeile 83 😉

Jetzt geht es ans Eingemachte. Du erstellst in Home Assistant ein neues ESPHome-Gerät, wählst die Import-Funktion und lädst deine angepasste YAML-Datei hoch. Klicke auf Installieren und lass eine .bin-Datei erstellen. Diese Datei lädst du herunter und flasht sie dann ganz bequem per USB-Kabel über web.esphome.io direkt auf deinen ESP-Controller.

Sobald das Gerät in Home Assistant auftaucht, trennst du den Controller unbedingt wieder vom Strom. Erst jetzt schließt du das MAX7219 Display an. Achte hierbei penibel auf die richtige Pinbelegung, um Schäden an Controller oder Display zu vermeiden.

MAX7219	ESP32
VCC	5V
GND	GND
DIN	G27
CS	G25
CLK	G26

Dann kannst du den ESP32 wieder mit Strom versorgen und das Gerät in Home Assistant, wie bei ESPHome-Geräten üblich, integrieren.

Wenn alles läuft, stehen dir in Home Assistant tolle Steuerungsmöglichkeiten zur Verfügung. Du kannst die Helligkeit des MAX7219 Displays regeln, zwischen Uhrzeit- und Text-Modus wechseln oder das Display komplett ausschalten. Besonders praktisch ist der Nachtmodus. Hierfür kannst du Start- und Endzeiten sowie eine minimale Helligkeit festlegen.

Im Text-Modus kannst du freie Texte an die Uhr senden. Ist der Text zu lang, scrollt er wie bei einem klassischen Ticker flüssig durch das Bild. Das eröffnet geniale Möglichkeiten für dein Smart Home.

Beispiele: So nutzt du die Pixel Clock in deinen Home Assistant Automationen

Im Text-Modus spielt die Uhr durch ESPHome ihre wahren Stärken aus. Egal ob smarte Erinnerungen oder die Anzeige aktueller Sensorwerte – mit den richtigen Automationen wird das Display zum perfekten Assistenten. Hier sind einige meiner liebsten Beispiele, die du ganz einfach als Inspiration nutzen kannst:

Sobald der Akku meiner PV-Anlage mindestens zu 90% geladen ist, lasse ich einen Info-Text für 15 Sekunden anzeigen:

alias: Max7219-Bsp-1
description: ""
triggers:
  - trigger: numeric_state
    entity_id:
      - sensor.rct_power_storage_mxwp_battery_state_of_charge
    above: 90
conditions: []
actions:
  - action: select.select_option
    metadata: {}
    target:
      entity_id: select.max7219_esp32_reg_display_page
    data:
      option: Text
  - action: text.set_value
    metadata: {}
    target:
      entity_id: text.max7219_esp32_reg_display_text
    data:
      value: Akku fast voll!
  - delay:
      hours: 0
      minutes: 0
      seconds: 15
      milliseconds: 0
  - action: select.select_option
    metadata: {}
    target:
      entity_id: select.max7219_esp32_reg_display_page
    data:
      option: Clock
mode: single

Also generell ist nötig zuerst den Modus der Pixelclock auf „Text“ zu setzen, was dann am Ende der Automation auch wieder rückgängig gemacht werden muss.

Ein weiteres Beispiel ist das Anzeigen einer Benachrichtigung, bis ein Zustand erreicht wird:

alias: Max7219-Bsp-2
description: ""
triggers:
  - trigger: numeric_state
    entity_id:
      - sensor.linkgear_co2_ampel_967258_scd41_co2
    above: 800
conditions: []
actions:
  - action: select.select_option
    metadata: {}
    target:
      entity_id: select.max7219_esp32_reg_display_page
    data:
      option: Text
  - action: text.set_value
    metadata: {}
    target:
      entity_id: text.max7219_esp32_reg_display_text
    data:
      value: Fenster auf!
  - wait_for_trigger:
      - trigger: numeric_state
        entity_id:
          - sensor.linkgear_co2_ampel_967258_scd41_co2
        below: 600
  - action: select.select_option
    metadata: {}
    target:
      entity_id: select.max7219_esp32_reg_display_page
    data:
      option: Clock
mode: single

Konkret lasse ich mich in diesem Beispiel benachrichtigen, wenn die Luft im Raum (also der CO2-Gehalt) schlecht wird. Und diese Benachrichtigung bleibt bestehen, bis der CO2-Gehalt dann wieder unter 600 sinkt.

Jetzt liegt es an dir: Such dir ein schickes Gehäuse, flashe deinen ESP und hab ganz viel Spaß mit deiner eigenen ESPHome Pixel Clock!