Übersicht über Beispiel-Visualisierungen.
Auf dieser Download-Seite kannst Du dir verschiedene ioBroker VIS Beispiel-Visualisierungen ansehen und als VIS-Projekt herunterladen. Ich habe diese Visualisierungen zu Test- und Lernzwecken für meine Webseite erstellt, und gebe diese gerne an die Community weiter. Ich werde auf dieser Seite immer wieder neue Visualisierungen hinzufügen oder bestehende aktualisieren und erweitern. Wenn Du Deine Visualisierung über diese Download-Seite veröffentlichen möchtest, kontaktiere mich einfach per E-Mail.
Anleitung Import von Projekten
Lade im ersten Schritt die gewünschte Visualisierung als Zip-Datei herunter und speichere sie in einem Verzeichnis Deiner Wahl. Ich habe das Zip einfach im Download-Ordner belassen. Starte nun die ioBroker Visualisierung VIS und klicke auf folgenden Menüpunkt:
Setup – Projekt – Export/Import – Import
Klicke jetzt auf die Eingabe-Fläche oder ziehe die Datei aus dem Download-Ordner per Drag&Drop auf die Eingabe-Fläche. Vergebe zudem noch einen eindeutigen Namen für das neue Projekt und klicke auf die Schaltfläche Import Projekt. Das Projekt wird jetzt als neues Projekt in VIS importiert.
Beispiel A
Im Beispiel A ist die Navigation der einzelnen Seiten auf der linken Seite angeordnet. Auf jeder Seite wird einfach die Navigations-View eingeblendet. Auf der rechten Seite der Navigation beginnt jede Seite mit einer Überschrift sowie dem eigentlichen Inhaltsbereich.
Beispiel B
Im Beispiel B ist die Navigation der einzelnen Seiten unterhalb der Seite angeordnet. Auf jeder Seite wird einfach die Navigations-View eingeblendet.
Beispiel C – Material Design Widgets
Im Beispiel C habe ich eine Visualisierung mittels dem Material Design Widget Adapter sowie der Top App Navigation Bar umgesetzt. Hier findest Du den Artikel zur Erstellung der Navigation:
{{ Link zum Artikel }}
Beispiel D – Material Design Widgets
Im Beispiel D habe ich eine Visualisierung mittels dem Material Design Widget Adapter sowie einer normalen Frame-Navigation umgesetzt. Für die Nutzung werden die Material und Material Design Widgets benötigt.
Beispiel D – Inventwo Design Widgets
Im Beispiel D habe ich eine Visualisierung mittels dem Adapter VIS-Inventwo Design Widgets erstellt. Die Visualisierung verfügt über eine einfache Navigation auf der linken Seite sowie den einzelnen Seiten für die verschiedenen Gewerke.
Ich hoffe ich konnte Dir damit eine Grundlage für die eigene Visualisierung zur Verfügung stellen. Über Kommentare oder E-Mails freue ich mich 🙂