Hallo zusammen,
ich arbeite an einem ESPHome-Projekt, das ein OLED-Display (SH1106 128x64) verwendet. Mein Ziel ist es, Material Design Icons (oder ähnliche Grafiken) in meinem Display zu integrieren (Glyphsets). Dazu möchte ich herausfinden:
- Wie oder besser wo erstelle ich einen Ordner in ESPHome, in dem ich die Icons speichern kann?
- Wie kann ich die Icons dann in meinem YAML-Code referenzieren und auf dem Display anzeigen lassen?
Hier ist mein aktueller YAML-Code für die Konfiguration:
esphome:
name: display-steckergehause
friendly_name: display Steckergehäuse
esp8266:
board: d1_mini
# Enable logging
logger:
# Enable Home Assistant API
api:
encryption:
key: ""
ota:
- platform: esphome
password: ""
wifi:
ssid: !secret wifi_ssid
password: !secret wifi_password
manual_ip:
static_ip:
gateway:
subnet: 255.255.255.0
# Enable fallback hotspot (captive portal) in case wifi connection fails
ap:
ssid: "Display-Steckergehause"
password: ""
captive_portal:
font:
# Google Fonts Roboto, Regular, Größe 20
- file: "gfonts://Roboto"
id: roboto
size: 20
# Google Fonts Roboto, Bold, Größe 24
- file:
type: gfonts
family: Roboto
weight: 900
id: roboto_16
size: 20
i2c:
sda: GPIO5
scl: GPIO4
display:
- platform: ssd1306_i2c
model: "SH1106 128x64"
lambda: |-
// Funktion zur Schätzung der Textbreite (Pixel pro Zeichen: 6 für kleine, 8 für große Schrift)
auto estimate_width = [](std::string text, int char_width) {
return text.length() * char_width;
};
if (id(waschmaschine_power).state > 20.0) {
int text_width = estimate_width("Waschgang", 6);
it.printf((128 - text_width) / 2, 0, id(roboto), "Waschgang"); // Erste Zeile
text_width = estimate_width("läuft", 6);
it.printf((128 - text_width) / 2, 16, id(roboto), "läuft"); // Zweite Zeile
text_width = estimate_width("%.0f W", 6);
it.printf((128 - text_width) / 2, 32, id(roboto), "%.0f W", id(waschmaschine_power).state); // Dritte Zeile
} else if (id(wasche).state) {
int text_width = estimate_width("Bereit:", 6);
it.printf((128 - text_width) / 2, 0, id(roboto), "Bereit:"); // Erste Zeile
text_width = estimate_width("zum", 6);
it.printf((128 - text_width) / 2, 20, id(roboto), "zum"); // Zweite Zeile
text_width = estimate_width("Waschen", 6);
it.printf((128 - text_width) / 2, 40, id(roboto), "Waschen"); // Dritte Zeile
} else if (id(avm_infra_waschmaschine).state) {
int text_width = estimate_width("Steckdose", 12);
it.printf((128 - text_width) / 2, 0, id(roboto), "Steckdose"); // Erste Zeile
text_width = estimate_width("ein", 8);
it.printf((128 - text_width) / 2, 18, id(roboto), "AVM ein"); // Zweite Zeile
it.printf((128 - 84) / 2, 40, id(roboto), " %.2f W", id(waschmaschine_power).state); // Dritte Zeile
} else {
auto now = id(current_time).now();
if (now.is_valid()) {
// Anpassung der Uhrzeit: Verschiebung nach links (X - 15)
int text_width = estimate_width("00:00:00", 8); // Maximale Breite der Uhrzeit
it.strftime((128 - text_width) / 2 - 15, 0, id(roboto_16), "%H:%M:%S", now); // Erste Zeile, Uhrzeit
// Vergrößerung des Abstands zur zweiten Zeile (Y + 10)
it.printf(0, 20, id(roboto), "Netz: %.0f W", id(netz).state); // Zweite Zeile
it.printf(0, 40, id(roboto), "Solar: %.0f W", id(solar).state); // Dritte Zeile
} else {
it.printf(0, 4, id(roboto_16), "Keine Uhrzeit"); // Erste Zeile
it.printf(0, 36, id(roboto_16), "Check System."); // Zweite Zeile
}
}
sensor:
- platform: homeassistant
name: "SOLAR"
id: solar
entity_id: sensor.solar_power
- platform: homeassistant
name: "Netz"
id: netz
entity_id: sensor.strombezug_aktuell
- platform: homeassistant
name: "Waschmaschine Stromverbrauch"
id: waschmaschine_power
entity_id: sensor.avm_infra_waschmaschine_power_consumption
- platform: wifi_signal
name: "WLAN Signalstärke"
id: wifi_signal_strength
update_interval: 60s
binary_sensor:
- platform: homeassistant
name: "Wasche"
id: wasche
entity_id: input_boolean.wasche
switch:
- platform: homeassistant
name: "AVM Waschmaschine"
id: avm_infra_waschmaschine
entity_id: switch.avm_infra_waschmaschine
time:
- platform: homeassistant
id: current_time
Zusatzinformationen:
Ich weiß, dass ich Bilder oder Icons in Bitmap-Format (.bmp oder ähnliches) verwenden könnte. Aber ich bin mir unsicher:
- Wo ich die Icons speichern soll, sodass ESPHome darauf zugreifen kann.
- Wie ich diese im Code integriere.
Falls jemand ein Beispiel für die Integration von Icons (z. B. ein einfaches WLAN-Symbol oder eine Glühbirne) hat, wäre das großartig!
Vielen Dank im Voraus!