Ein Dashboard erstellen

So erstellen Sie ein SharKNX-Dashboard in der App: Bereiche, Seiten und Widgets, der Editor, wie ein Dashboard aussieht und läuft und wie Sie es teilen.

Ein Dashboard ist eine Touch-Oberfläche für eine KNX-Installation: Räume mit Schaltflächen, Schiebereglern und Messwerten, die auf Gruppenadressen senden und mithören. Sie erstellen es im Editor der App, und Sie oder Ihr Kunde bedienen es in der Dashboard-Ansicht. Diese Anleitung setzt KNX-Grundlagen voraus (Gruppenadressen, Datenpunkttypen), aber keine Kenntnisse von SharKNX.

Lieber im Texteditor? Ein Dashboard ist eine JSON-Datei, die Sie auch von Hand schreiben können. Siehe die Referenz Dashboard-Dateiformat und ihre Beispiele.

Free-Plan: Dashboards sind in jedem Plan enthalten. Jeder Befehl, den ein Dashboard sendet, zählt zu den täglichen Sendungen des Free-Plans; die Statusabfragen beim Öffnen nicht. Siehe Abonnementpläne.

Auf dieser Seite

1. Woraus ein Dashboard besteht
2. Ein Dashboard anlegen
3. Der Editor
4. Bereiche und Seiten
5. Widgets hinzufügen
6. Das Formular eines Widgets
7. Welches Widget wofür
8. Das Aussehen gestalten
9. Verbindung, Projekt und Sicherheit
10. Ein Dashboard ausführen
11. Ein Dashboard für Ihren Kunden
12. Teilen und Sichern
13. Wenn etwas nicht stimmt

Woraus ein Dashboard besteht

Die Hauptoberfläche der App mit Projekt, Monitor und den anderen Werkzeugen heißt Profi-Ansicht. Dashboards liegen auf der Dashboards-Seite, dem dritten Tab in der unteren Navigationsleiste.

Grenzen: 10 Seiten pro Bereich, 100 Widgets pro Seite, 8 Bereichsebenen unter der Startseite, 500 Bereiche und 5.000 Widgets pro Dashboard, Namen bis 50 Zeichen. Siehe Grenzwerte.

Ein Dashboard anlegen

Tippen Sie auf der Dashboards-Seite auf +:

• Dashboard erstellen öffnet den Editor mit einem neuen, leeren Dashboard: die Startseite mit einer Seite. Gespeichert wird erst, wenn Sie speichern.
• Dashboard importieren liest eine .json-Datei, etwa eine von einem anderen Gerät exportierte oder eines der Beispiele.

Die Karte eines gespeicherten Dashboards hat ▶ (Ausführen, in der Dashboard-Ansicht öffnen) und ✎ (im Editor öffnen). Tippen Sie an eine andere Stelle der Karte für alle Aktionen - siehe Die Dashboards-Seite.

Aus einem ETS-Projekt: Ist ein Projekt in der App geladen und hat das Dashboard nur die Startseite, baut ⋮ → Bereiche aus ETS erstellen im Editor den Bereichsbaum aus den Gebäuden, Geschossen und Räumen des Projekts auf (Namen, Verschachtelung und Symbole). Es erstellt nur Bereiche, jeden mit einer leeren Seite; die Widgets fügen Sie hinzu.

Der Editor

Der Editor ist ein Modell des Dashboards, kein laufendes: Er sendet nichts und liest nichts. Widgets zeigen ein Beispielaussehen, und ein Tippen wählt ein Widget aus, statt es zu bedienen.

Auf dem Telefon:

• Obere Zeile: ✕ (Editor schließen), der Bereich, in dem Sie sich befinden (antippen, um zu einem anderen Bereich zu wechseln), ⋮ (Dashboard-Einstellungen) und Speichern.
• Unten: Raster / Baum, Darstellung, Auswählen und + (Hinzufügen).

Auf Tablet oder Desktop: dieselben Bedienelemente, mit Hinzufügen, Raster, Baum, Darstellung und Auswählen in einer Leiste an der Seite. Ab 840 dp Breite zeigt die obere Zeile den Pfad zum aktuellen Bereich (Startseite › Erdgeschoss › Küche), und jeder Schritt öffnet diesen Bereich.

Raster und Baum sind zwei Ansichten desselben Dashboards. Raster zeigt die Seiten so, wie sie aussehen werden. Baum zeigt die Struktur: Bereiche, ihre Seiten und ihre Widgets. Im Baum können Sie Bereiche und Seiten durch Ziehen verschieben.

Gespeichert wird ausdrücklich. Nichts wird gespeichert, bis Sie auf Speichern tippen. Schließen Sie mit ungespeicherten Änderungen, fragt der Editor, ob Sie speichern, verwerfen oder abbrechen möchten (Speichern, Verwerfen, Abbrechen). Entfernen und Verschieben bieten in ihrer Meldung Rückgängig an.

Zurück führt zu dem Bereich, in dem Sie vorher waren, wie in einem Browser. Mit ✕ verlassen Sie den Editor.

Bereiche und Seiten

Hinzufügen → Bereich öffnet das Formular Neuer Bereich:

• Name, übergeordneter Bereich, Position und Symbol.
• Navigations-Widget hinzufügen (standardmäßig an): legt auf der Seite, auf der Sie waren, eine Verknüpfung zum neuen Bereich an, damit er von dort erreichbar ist. Schalten Sie es für Bereiche aus, die Sie anders erreichen.

Weiteres hinzufügen erstellt den Bereich und lässt das Formular für den nächsten offen, mit demselben übergeordneten Bereich und Symbol. Für eine nummerierte Reihe auf einmal (Raum 1 bis Raum 12) verwenden Sie Mehrere Bereiche….

Das Bereichsmenü (tippen Sie auf den Namen des aktuellen Bereichs) blättert Ebene für Ebene durch die Bereiche und bietet Bereich hinzufügen, Bereich bearbeiten und Bereich löschen. Das Löschen eines Bereichs löscht auch seine Unterbereiche, ihre Widgets und jede Verknüpfung dorthin und bietet Rückgängig an. Die Startseite lässt sich nicht löschen.

Seiten: Mit den Bedienelementen unter den Seiten fügen Sie eine Seite hinzu oder entfernen sie (ein Bereich behält mindestens eine). Im Baum ziehen Sie eine Seite, um sie neu anzuordnen, oder auf einen anderen Bereich, um sie dorthin zu verschieben.

Verknüpfungen sind nicht die Hierarchie. Eine Bereichsverknüpfung (Navigations-Widget) kann jeden Bereich an jeder Stelle des Baums öffnen, und mehrere Verknüpfungen können denselben Bereich öffnen. Das Löschen einer Verknüpfung löscht nie ihren Bereich.

Widgets hinzufügen

Hinzufügen → Widget (oder der gestrichelte Platz Widget hinzufügen nach dem letzten Widget) öffnet den Widget-Katalog, nach Kategorien gegliedert:

Die Suche findet ein Widget nach Name oder Beschreibung. Viele Einträge sind Voreinstellungen, ein generisches Widget, das für einen Zweck vorbereitet ist: Lichtschalter ist eine Binäre Steuerung mit Licht-Namen und -Symbolen, und Temperatur ist ein Wertstatus in °C. Sie öffnen ein Formular mit dem Titel der Voreinstellung, in dem ihre Wahl schon getroffen ist.

Das Widget wird der Seite hinzugefügt, auf der Sie sind, nach ihrem letzten Widget.

Anordnen: Tippen Sie auf ein Widget, um es auszuwählen und seine Aktionen zu öffnen: Widget bearbeiten, Duplizieren, Verschieben… (an eine andere Position, Seite oder in einen anderen Bereich) und Löschen (mit Rückgängig). Eine Bereichsverknüpfung bietet außerdem Öffnen. Zum Umsortieren von Hand halten Sie ein Widget gedrückt und ziehen es; halten Sie es am Bildschirmrand, um es auf die nächste Seite mitzunehmen.

Auswählen markiert mehrere Widgets (oder mehrere Bereiche) auf einmal, über Seiten und Bereiche hinweg, um sie gemeinsam zu duplizieren, zu verschieben oder zu löschen. Sie starten es auch, indem Sie ein Widget gedrückt halten und an Ort und Stelle loslassen.

So wird eine Seite angeordnet: Widgets füllen die Seite Zeile für Zeile in ihrer Reihenfolge, jedes an der ersten Stelle, an der es passt. Ein Widget, das nicht mehr in den Rest einer Zeile passt, beginnt die nächste, und die Lücke bleibt: Der Editor zeigt sie, und Sie schließen sie durch Umsortieren oder eine andere Größe. Widgets werden nie vergrößert, um Platz zu füllen. Dasselbe Layout gilt für jeden Bildschirm; ein breiterer Bildschirm hat einfach mehr Spalten.

Das Formular eines Widgets

Jedes Widget hat dasselbe Formular, in Karten von oben nach unten. Auf dem Telefon öffnet es sich als ganze Seite, auf dem Tablet in einem Blatt an der Seite.

Ein kleines ⓘ neben einem Feld erklärt es.

Adressen

• Eintippen: dreistufig (1/2/3), zweistufig (1/515) oder als einfache Zahl. Die Tastatur bietet nur Ziffern und /.
• Aus einem Projekt wählen: Ist ein Projekt geladen, öffnet die Lupe seine Gruppenadressen zum Suchen und Wählen. Eine gewählte Adresse füllt auch den Namen des Widgets und seinen Typ aus (zum Beispiel die Namen Offen/Geschlossen und das Symbol eines Fensterkontakts).
• Statusvorschlag: Nachdem Sie eine Schaltadresse gewählt haben, kann das Formular die passende Statusadresse vorschlagen, die es auf demselben Gerätekanal gefunden hat. Tippen Sie auf Übernehmen, um sie zu nehmen; sie wird nie von selbst eingetragen.
• Mehrere Sendeadressen: Eine Binäre Steuerung oder Wertsteuerung kann denselben Wert an bis zu 10 Adressen senden (Adresse hinzufügen).
• Typen werden geprüft: Eine Adresse, deren Datenpunkttyp für das Widget nicht passt, wird markiert und verhindert das Speichern. Eine Adresse ohne in ETS gesetzten Typ wird immer akzeptiert.
• Status beim Öffnen lesen (am Ende der Karte KNX-Adressen, bei einer Statusadresse): fragt beim Öffnen oder Wiederverbinden des Dashboards den Wert der Statusadresse ab. Schalten Sie es für Objekte aus, die sich nicht lesen lassen.

Mit oder ohne Status? Mit einer Statusadresse zeigt das Widget, was das Gerät meldet, auch Änderungen durch Taster, Zeitschaltuhren und Zentralfunktionen. Ohne Statusadresse zeigt es den letzten Wert, der auf seine Sendeadresse geschrieben wurde, vom Dashboard oder von jedem anderen am Bus. Für einfache Verbraucher reicht das, aber eine Änderung über eine andere Adresse sieht es nicht.

Hinzufügen und Speichern

• Hinzufügen platziert das Widget und schließt das Formular.
• Weiteres hinzufügen platziert es und lässt das Formular für das nächste offen; die Einstellungen bleiben, aber Name und Adressen werden geleert, denn sie kennzeichnen ein einzelnes Widget.
• Speichern (beim Bearbeiten) behält den Platz des Widgets auf der Seite.

Ein Widget, dem noch etwas Nötiges fehlt, etwa eine erforderliche Adresse, wird als Unvollständig angezeigt: Hinzufügen und Speichern bleiben deaktiviert, bis es vollständig ist.

Welches Widget wofür

Das Aussehen gestalten

Design und Schaltflächen

Die Schaltfläche Darstellung im Editor wählt das Design des Dashboards: Automatisch (folgt dem hellen oder dunklen Modus des Geräts), Hell, Dunkel, Nacht, Große Welle, Sahara-Dämmerung, Polarlicht oder Neonstadt. Sie wählt auch, wie Schaltflächen auf den Karten aussehen: Gefüllt (ein dezenter Hintergrund) oder Schlicht (nur Symbole). Das Design lässt sich später auch in der Dashboard-Ansicht ändern.

Größen

Jedes Widget bietet die Größen, in denen es mehr zu zeigen hat, von 1×1 bis 4×2 (bei einigen auch 3×3). Eine größere Karte zeigt mehr: Ein Dimmer zeigt in 1×1 seinen Pegel, in 3×1 kommt ein Ziehstreifen hinzu, in 2×2 der Schieberegler oder − +. Die Größe wählen Sie unter Allgemein; die Vorschau zeigt das Ergebnis. Eine Reihe aus vier Zellen füllt die Breite eines Telefons.

Abschnitte

Ein Abschnitt (unter Layout) ist ein Titel über den Widgets danach, bis zum nächsten Abschnitt. Er belegt immer eine eigene Zeile. Geben Sie ihm ein Symbol und eine Farbe. Schalten Sie Einklappbar ein, um seine Widgets in der Dashboard-Ansicht mit einem Tippen ein- und auszuklappen; er öffnet sich immer ausgeklappt.

Farben

Standardmäßig übernimmt jedes Widget seine Farben aus dem Design. Öffnen Sie die Karte Darstellung eines Widgets, um ihm eigene zu geben:

• Kartenfarbe: der Hintergrund der Karte, in jedem Zustand.
• Farbe ein und Farbe aus (Widgets mit einem Ein-Zustand) oder Symbolfarbe (die übrigen): das Symbol, der Zustandstext und der Rahmen im eingeschalteten Zustand. Auch die Tasten und der Schieberegler des Widgets übernehmen diese Farbe.

Jede bietet Design, sieben benannte Farben oder Eigene (jede beliebige Farbe, auf einem Farbfeld gewählt oder als #RRGGBB eingegeben):

• Benannte Farben folgen dem Design. Eine blaue Karte ist die Karte des Designs, ins Blaue getönt: hellblau in einem hellen Design, tiefblau in einem dunklen. Eine benannte Symbolfarbe nimmt einen hellen oder dunklen Farbton an, je nachdem, welcher auf ihrer Karte lesbar ist.
• Eigene Farben sind exakt, in jedem Design dieselben.
• Text und Tasten passen sich automatisch an: Auf einer Kartenfarbe wird Text weiß oder schwarz, wenn der des Designs nicht lesbar wäre, und Tasten, deren Farbe nicht lesbar wäre, nehmen stattdessen einen Farbton der Kartenfarbe an.

Tipps zu Farben:

• Geben Sie jedem Raum oder jeder Gruppe unter einem Abschnitt eine eigene Kartenfarbe, damit ein Bereich auf einen Blick erkennbar ist.
• Setzen Sie Akzente mit Bedeutung ein: eine Farbe ein für alle Leuchten, eine andere für die Heizung.
• Prüfen Sie eigene Farben in der Vorschau, besonders eine dunkle Karte in einem hellen Design.

Verbindung, Projekt und Sicherheit

⋮ im Editor öffnet die Dashboard-Einstellungen: Name, Verbindung, Projekt, Sicherheit und Bereiche aus ETS erstellen. Änderungen gelten, wenn das Blatt geschlossen wird.

Verbindung

Wie die Dashboard-Ansicht bei jedem Öffnen den Bus erreicht:

Ist die App beim Öffnen des Dashboards bereits anderswo verbunden, fragt es (Bereits verbunden), ob Sie die Verbindung behalten (Aktuelle behalten) oder wechseln (Wechseln) möchten. Beim Verlassen des Dashboards bleibt die Verbindung, wie sie ist.

Zugangsdaten (Secure-Tunneling-Passwörter, der Backbone-Schlüssel) richten Sie in der Profi-Ansicht ein, nie im Dashboard - siehe KNX IP Secure einrichten.

Projekt und Sicherheit

Das Dashboard selbst hat keine Sicherheitseinstellungen. Die App ver- und entschlüsselt Data-Secure-Adressen mit den Schlüsseln, die sie geladen hat.

• Kein Projekt (Standard): Der Editor wählt Adressen aus dem in der App geöffneten Projekt, und das Dashboard verwendet die Sicherheit, die die App geladen hat.
• Projekt dieses Dashboards: Wählen Sie ein ETS-Projekt aus dem Archiv. Das Dashboard behält eine eigene Kopie der Data-Secure-Gruppenschlüssel und IP-Secure-Zugangsdaten des Projekts, verschlüsselt auf dem Gerät. Läuft es in einer App, in der nichts geladen ist, werden die Schlüssel ohne Rückfrage installiert. Ist etwas anderes geladen, fragt es, ob Sie dies entladen (Entladen) oder behalten (Aktuelle behalten) möchten. Was es installiert hat, wird am Ende der Ausführung entfernt.

Die Zeile Sicherheit zeigt, was das Dashboard mitbringt (gesicherte Adressen, Tunnel, Backbone-Schlüssel) und ob es zur Verbindung passt.

Eine gesicherte Adresse, deren Schlüssel fehlen, wird nie aktualisiert. Das verursacht keinen Fehler; prüfen Sie deshalb Sicherheit, wenn ein gesichertes Widget unbekannt bleibt. Siehe KNX Data Secure.

Ein Dashboard ausführen

Tippen Sie auf ▶ Ausführen. Die Dashboard-Ansicht öffnet sich sofort im Vollbild und verbindet sich im Hintergrund. Werte erscheinen, sobald sie gelesen und empfangen werden: zuerst die Seite auf dem Bildschirm, dann der Rest des Dashboards.

Widgets bedienen

• Leuchten und Schalter: Ein Tippen schaltet um. Bei einer Leuchte mit Dimmer, Farb- oder Weißsteuerung tippen Sie auf das Symbol, um sie zu schalten, und auf den Rest der Karte für ihre Bedienelemente.
• Szenen und Bereichsverknüpfungen: Ein Tippen ruft die Szene ab oder öffnet den Bereich.
• Alles andere: Schieberegler, − + und Tasten funktionieren direkt auf der Karte, wo sie angezeigt werden; ein Tippen an eine andere Stelle der Karte öffnet ihr Bedienblatt mit allen Bedienelementen des Widgets: Voreinstellungen, einem eingegebenen Wert, jeder Betriebsart.
• Messwerte reagieren nicht auf Tippen.

Eine Karte mit Statusadresse zeigt ?, bis der Status antwortet; eine ohne beginnt mit einem Standardwert (Aus, 0 %), bis etwas an ihre Adresse gesendet wird. In ihrer Ecke können zwei Markierungen erscheinen: !, wenn das Gateway den letzten Befehl abgelehnt hat, und ein unterbrochenes Kettensymbol, wenn ihre Statusadresse nicht antwortet.

Das Dock

Die Leiste unten enthält ⌂ (Startseite), ☰ (Bereiche; auf Tablets eine Seitenleiste) und ⚙ (Einstellungen), dazu den Verbindungsstatus auf Tablets (auf Telefonen oben rechts): ein grünes Kettensymbol bei Verbindung, gelb während des Verbindens, ein unterbrochenes Kettensymbol ohne Verbindung. Tippen Sie auf den Status für die Gateway-Seite mit Neu verbinden.

⚙ Einstellungen: Gateway, Darstellung (Design und Schaltflächen, sofort gespeichert), Bildschirm eingeschaltet lassen, Widgets anordnen und Zurück zur Profi-Ansicht.

Die Glocke oben listet die Meldungen der Ausführung (Aktivität): vom Gateway abgelehnte Befehle, Verbindung verloren und wiederhergestellt, Adressen, die nie antworten. Benachrichtigungsbanner stummschalten behält sie nur in Aktivität.

Favoriten, Dock-Verknüpfungen und Anordnen

Widgets anordnen (unter ⚙, oder halten Sie eine leere Stelle einer Seite gedrückt) lässt den Nutzer des Dashboards es ohne Editor aufräumen:

• Ziehen Sie eine Karte (gedrückt halten), um sie umzusortieren oder auf eine andere Seite desselben Bereichs zu legen. Legen Sie sie hinter der letzten Seite ab, entsteht eine neue Seite.
• Tippen Sie auf eine Karte für Zu Favoriten hinzufügen und Zum Dock hinzufügen.
• Rückgängig und Fertig stehen oben.

Favoriten erscheinen als eigene Seite vor der ersten Seite jedes Bereichs (★ in den Seitenpunkten). Auf dieser Seite ziehen Sie sie, um sie umzusortieren.

Dock-Verknüpfungen legen bis zu 6 Widgets als Symbole ins Dock. Eine Verknüpfung tut, was ein Tippen auf ihre Karte tut: Eine Leuchte schaltet um (und leuchtet im eingeschalteten Zustand), eine Szene wird abgerufen, ein Dimmer oder Thermostat öffnet sein Bedienblatt. Auf einem schmalen Telefon wird der letzte Platz zu ⋯ für die Verknüpfungen, die nicht passen.

Änderungen in der Dashboard-Ansicht (Design, Bildschirm eingeschaltet lassen, Anordnung, Favoriten, Dock) werden im Dashboard gespeichert. Widgets hinzufügen, bearbeiten und löschen bleibt dem Editor vorbehalten.

Ein Dashboard für Ihren Kunden

Für ein Wandpanel oder das Tablet eines Kunden:

1. Erstellen und speichern Sie das Dashboard, und führen Sie es einmal aus, um jedes Widget zu prüfen.
2. Verwenden Sie Konfiguriertes Gateway, wenn sich das Gerät immer mit einem Gateway verbinden soll, oder behalten Sie Automatisch, um das der App zu nutzen.
3. Wählen Sie bei einer Data-Secure- oder IP-Secure-Installation Projekt dieses Dashboards, damit das Dashboard seine Schlüssel mitbringt.
4. Öffnen Sie auf der Dashboards-Seite die Aktionen des Dashboards → Beim App-Start öffnen. Die App öffnet dann dieses Dashboard als einzige Oberfläche. Optional legen Sie eine PIN zum Verlassen fest (4 oder 6 Ziffern).
5. Schalten Sie unter ⚙ der Dashboard-Ansicht Bildschirm eingeschaltet lassen ein, wenn ein Panel nie in den Ruhezustand gehen soll.

Die PIN wird vor Zurück zur Profi-Ansicht abgefragt. Sie ist keine Sicherheitsfunktion; sie verhindert nur, dass das Dashboard versehentlich verlassen wird.

PIN vergessen: Halten Sie ⌂ (Startseite) im Dock 20 Sekunden lang gedrückt. Die PIN wird entfernt und die Profi-Ansicht öffnet sich. Das Dashboard öffnet sich weiterhin beim Start.

Teilen und Sichern

Exportieren (in den Aktionen des Dashboards auf der Dashboards-Seite) speichert eine .json-Datei:

• Einfaches JSON: das Dashboard als bearbeitbare Datei, ohne Schlüssel oder Passwörter. Für Sicherungen, zum Teilen eines Entwurfs oder zum Bearbeiten von Hand.
• Mit Schlüsseln: das Dashboard mit den Data-Secure-Schlüsseln der verwendeten Adressen und den Zugangsdaten, die seine Verbindung braucht, verschlüsselt mit einem Passwort Ihrer Wahl. Damit übergeben Sie das Dashboard einer gesicherten Installation an ein anderes Gerät.

Dashboard importieren (unter + auf der Dashboards-Seite) liest beide Arten; eine geschützte Datei fragt nach ihrem Passwort. Gibt es bereits ein Dashboard mit demselben Namen, wählen Sie Als Kopie importieren oder Ersetzen. Hat die Datei Probleme, erklärt eine Liste jedes einzelne, mit Details kopieren.

Das Format beschreibt die Referenz Dashboard-Dateiformat vollständig.

Wenn etwas nicht stimmt

Verwandte Themen

• Die Dashboards-Seite - der Tab, in dem Dashboards und Hunts liegen
• Dashboard-Dateiformat - jedes Feld der JSON-Datei, mit Beispielen
• Ein ETS-Projekt laden - zum Wählen von Adressen und für Bereiche aus ETS erstellen
• Grenzwerte - Bereiche, Seiten, Widgets und Dock-Verknüpfungen