In dieser Artikelreihe zeige ich Dir eine weitere Visualierungsoberfläche für ioBroker.
Im 8. Teil der Artikelreihe werden wir einen Xiaomi Fenster-oder Türkontakt in die Visualisierung einbinden. Diese Vorgehensweise funktioniert zudem auch mit Homematic Tür- und Fensterkontakten. Für den Artikel habe ich folgende Produkte verwendet:
Tür- und Fensterkontakt
Batteriebetriebener Sensor zur Überwachung von Türen oder Fenstern.
Alternativ können natürlich auch Homematic Produkte verwendet werden:
Im ersten Schritt öffnen wir das Dashboard, auf dem wir den Fenster- oder Türkontakt einfügen möchten. Dazu wechseln wir in den Bearbeitungsmodus und klicken oben links auf „Add Widget„. Im Menü klicken wir unten im Bereich „Custom Widgets“ auf den Menüpunkt „Get more„.
In der Gallery klicken wir auf das Widget „Xiaomi Door Window Sensor“.
In den Details des Widget klicken wir unten auf den Link zum Github Repository.
Link zum Github-Repository:
https://github.com/andreypopov/habpanel-widget-xiaomi-sensor_magnet
Im Github Repository laden wir das Widget herunter.
Im nächsten Schritt gehen wir in den Einstellungen auf Custom Widgets und klicken hier auf den Button „Import widget“ -> „Import from file“ und wählen hier aus dem zuvor heruntergeladenen Ordner die Datei „xiomi-door-window.widget.json“ aus.
Den vorgeschlagenen Namen des Widgets belassen wir so und klicken auf OK.
In der Liste der Custom Widgets taucht nun das neue Widget auf.
Auf dem gewünschten Dashboard öffnen wir jetzt wieder den Bearbeitungsmodus.
Im Menü der Schaltfläche „Add Widget“ finden wir jetzt im Bereich „Custom Widgets“ das neue Widget, welches wir per Klick auf das Dashboard einfügen.
Über die Bearbeitungsfunktionen des Widgets können wir nun das Sensor-Label (z.B. Balkontür) sowie die Datenpunkte für den Status (geöffnet oder geschlossen) und Batteriestatus definieren.
Nach dem Speichern der Widget-Einstellungen können wir nun das Widget in der Ausführung überprüfen. Dabei habe ich festgestellt, dass das Icon des Zustandes nicht angezeigt wird. Grund dafür ist die Abfrage auf den Datenpunkt des Sensor.
In den Einstellungen des Widgets können wir hier die Abfrage der Datenpunkte anpassen. Dazu ersetzen wir die bestehenden Abfragen mit den unten gelb markierten Definition.
Und schon wird das Icon wie gewünscht angezeigt.
ioBroker HABPanel
- Teil 1 – Installation und Grundlagen
- Teil 2 – Dashboard und Widgets
- Teil 3 – Custom Widgets
- Teil 4 – Custom Widgets importieren (JSON-Format)
- Teil 5 – Custom Widgets anpassen und erweitern
- Teil 6 – Eigenes Widget erstellen
- Teil 7 – Unterstützung von verschiedenen Geräten und Auflösungen
- Teil 8 – Tür-/Fensterkontakt visualisieren
- Teil 9 – Das Chart Widget
- Teil 10 - Mit dem Frame-Widget eine VIS-View einbinden
- Teil 11 - Script über Button starten
- Teil 12 - Das Timeline-Widget
- Teil 13 - Das Template-Widget
- Teil 14 - Template Wissenssammlung
- Teil 15 – Das Slider-Widget
- Teil 16 – Das Dummy-Widget
- Teil 17 – Das Knob-Widget
- Teil 18 – Das Clock-Widget
- Teil 19 – Das Button-Widget
- Teil 20 – iCal Termine HTML-Darstellung
- Teil 21 – OpenWeatherMap Widget
- Teil 22 – Image Widget
- Teil 23 – Selection Widget
- Teil 24 – Online-Status Widget
Ich hoffe Dir gefällt der Artikel. Ich freue mich über Deinen Kommentar 🙂