Block Menüzeile

Die Menüzeile ist eine Navigationsleiste am unteren Seitenrand: Jeder Eintrag zeigt ein Symbol mit Beschriftung und führt mit einem Tippen auf eine Seite. Die Seite, auf der man gerade ist, ist hervorgehoben. Als erster Eintrag steht immer automatisch die Startseite. Weitere Seiten lassen sich hinter dem Eintrag Mehr bereithalten, der immer automatisch als letzter Eintrag der Leiste erscheint; davor steht automatisch Favoriten.

Bedienung

Eintrag: ein Symbol mit Beschriftung. Ein Tippen wechselt auf die zugehörige Seite. Tippt man auf den Eintrag der Seite, auf der man schon ist, passiert nichts.
Aktive Seite: das Symbol der aktuellen Seite liegt auf einer farbig hervorgehobenen Kapsel, die Beschriftung ist fett.
Startseite: der erste Eintrag (Haus-Symbol) zeigt immer die Startseite des Projektes, wie die Home-Taste der Toolbar. Das ist die im Projekt eingestellte Startseite der jeweiligen Ausrichtung, sonst die erste Seite passender Ausrichtung. Ist man auf ihr, ist der Eintrag hervorgehoben. Die Ermittlung ist unter Startseite beschrieben; maßgeblich ist die Ausrichtung der aktuellen Seite.
Favoriten: der Eintrag mit dem Stern öffnet ein Blatt mit allen Elementen, die mit dem Stern in der Titelleiste ihres Dialogs als Favorit gemerkt wurden. Die Elemente erscheinen dort selbst als Kacheln und lassen sich wie auf ihrer Seite bedienen; ihre Dialoge öffnen sich über dem Blatt. Die Liste wird je Gerät (und angemeldetem Benutzer) gespeichert, nicht im Projekt. Der Eintrag ist nie hervorgehoben. Ohne das neue Block-Design zeigt das Blatt eine Liste, ein Tippen wechselt dann auf die Seite des Elements.
Mehr: der Eintrag mit den drei Punkten öffnet ein Blatt mit weiteren Seiten, siehe unten. Ist man auf einer dieser Seiten (und die Seite hat keinen eigenen Eintrag in der Leiste), ist Mehr hervorgehoben.

Die Menüzeile gibt es in zwei Formen. Die Leiste geht über die volle Breite bis an den Seitenrand. Die schwebende Form ist eine abgerundete Kapsel mit Schatten und etwas Abstand zum Rand.

Toolbar der APP: Enthält das Projekt eine Menüzeile, blendet die APP ihre Toolbar in dieser Ausrichtung automatisch aus, denn Startseite, Einstellungen und Verbindungsauswahl sind über die Menüzeile erreichbar. Gilt sie nur für das Hochformat, behält das Querformat seine Toolbar. Die Einstellung der Toolbar bleibt dabei unverändert und gilt wieder, sobald das Projekt keine Menüzeile mehr enthält. Mit einem langen Druck auf die Visu lässt sich die Toolbar trotzdem jederzeit wieder einblenden.

Wischen: Ist es eingerichtet, wechselt ein Wischen nach links zur nächsten und ein Wischen nach rechts zur vorherigen Seite der Menüzeile – irgendwo auf der Seite, solange sie nicht vergrößert ist. Gewechselt wird nur zwischen den Einträgen, die direkt auf eine Seite führen, in der Reihenfolge der Menüzeile; nach der letzten (bzw. vor der ersten) Seite geht es nicht weiter. Steht man auf einer Seite hinter Mehr, ist Wischen wirkungslos.

Das Blatt „Mehr“

Titel: „Mehr“. Darunter steht die Anzahl der Seiten. Das Symbol neben dem Schließen-Knopf schaltet zwischen der Ansicht als Kacheln (Vorgabe) und als Liste um; die Wahl bleibt gespeichert. Daneben stehen zwei weitere Symbole wie in der Toolbar der APP: Einstellungen (Zahnrad) und Verbindung (Funksymbol) öffnen dieselben Dialoge wie dort – praktisch, wenn die Toolbar ausgeblendet ist. Im Studio erscheint stattdessen nur ein Hinweis, dass die Dialoge erst in der APP angezeigt werden; das Blatt bleibt dabei offen.
Seite: Symbol und Seitenname. Ein Tippen wechselt auf die Seite und schließt das Blatt.
Aktuelle Seite: die Seite, auf der man sich befindet, ist farbig hervorgehoben.

Ist Benutzer beachten eingeschaltet, erscheinen im Blatt nur die Seiten, auf die der angemeldete Benutzer wechseln darf.

Einrichtung

Dieser Abschnitt richtet sich an den Errichter der Anlage.

Die Menüzeile wird auf jede Seite gelegt, von der aus mit ihr gewechselt werden soll – am einfachsten einmal eingerichtet, kopiert und in die anderen Seiten eingefügt. Sie braucht keine Verknüpfung mit Adressen oder Funktionsbausteinen: Sie wechselt nur zwischen Seiten des Projektes, welche Seite gerade aktiv ist, ergibt sich aus der Seite, auf der sie liegt. Die Höhe der Menüzeile bestimmt die Größe der Symbole und der Schrift; wird die Zeile breiter oder höher gezogen, wächst alles mit.

Farben und Hintergrund kommen aus dem Style (Bereich Fußzeile, die hervorgehobene Kapsel in der Akzentfarbe des Styles), siehe Styles. Ist kein Style gewählt, gelten die Farben der Vorlage „Hell“.

Parameter

Menüzeile
Form	Leiste (Vorgabe): die Zeile füllt das Bedienelement aus und liegt mit einer feinen Linie am oberen Rand am Seitenrand an. Schwebend: eine abgerundete Kapsel mit Schatten, die rundum etwas Abstand zum Rand des Bedienelementes lässt – das Bedienelement dafür etwas höher anlegen.
Einträge	Die Schaltfläche ... öffnet den Dialog Menüzeile - Einträge mit bis zu 8 Seiteneinträgen. Je Eintrag gibt es die Spalten Seite, Beschriftung und Symbol; Hinzufügen und Entfernen legen Einträge an bzw. löschen den gewählten, mit den Pfeilen wird die Reihenfolge festgelegt. Der Eintrag Startseite steht immer automatisch ganz links und ist nicht änderbar. Der Eintrag Mehr kommt immer automatisch als letzter Eintrag dazu und hat im Dialog nur eine Schaltfläche Seiten in „Mehr“ wählen .... Die Spalten: Seite: die Zielseite, gewählt aus einem Menü mit Suchfeld, das alle Seiten des Projektes zeigt (die aktuelle ist markiert). Ein Eintrag ohne Zielseite bewirkt beim Tippen nichts und wird nie hervorgehoben. Beschriftung: der Text unter dem Symbol. Wird eine Seite gewählt und die Beschriftung ist noch leer oder gleich dem bisherigen Seitennamen, übernimmt sie den Seitennamen; ein von Hand geänderter Text bleibt unverändert. Leer = keine Beschriftung. Die Zeichen ; und # werden entfernt. Die Texte sind übersetzbar. Symbol: die Schaltfläche öffnet die Symbolauswahl mit Suchfeld (Suche nach Bezeichnung und Stichworten, siehe Abschnitt „Symbolauswahl“). Ist kein Symbol angegeben, gilt „haus“ (das Haus-Symbol). Seiten in „Mehr“: die Schaltfläche öffnet den Dialog Seiten im Blatt „Mehr“: die Seiten ankreuzen (mit Suchfeld), mit den Pfeilen die Reihenfolge im Blatt festlegen und je Seite ein Symbol wählen (Vorgabe „haus“). Alle kreuzt alle Seiten an, Alle horizontal und Alle vertikal kreuzen zusätzlich alle Seiten der jeweiligen Ausrichtung an, Keine hebt die Auswahl auf. Ist keine Seite angekreuzt, zeigt das Blatt automatisch alle Seiten des Projektes, die zur Ausrichtung der aktuellen Seite passen (auf einer horizontalen Seite nur die horizontalen, auf einer vertikalen Seite nur die vertikalen) – auch Seiten, die später dazukommen. Das Wort unter dem Symbol von Mehr ist immer „Mehr“ (übersetzbar), die drei Punkte sind das feste Symbol. Ist die Zeile zu schmal, damit jeder Eintrag mindestens etwa 80 % der Zeilenhöhe an Breite hat, entfallen alle Beschriftungen und die Symbole werden etwas größer. Das gilt auch, wenn kein Eintrag eine Beschriftung hat (das Wort „Mehr“ zählt dabei nicht).
Seitenaufruf
Seitenwechsel slide hor.	Wechseln durch Wischen nach links oder rechts irgendwo auf der Seite (nicht bei vergrößerter Seite), siehe oben. Vorgabe aus. In der neuen Visu ist das Wischen immer möglich, die Einstellung gilt dort nicht.
Benutzer beachten	Gewechselt wird nur, wenn ein Benutzer angemeldet und mit der Zielseite verknüpft ist. Eine Seite ohne verknüpfte Benutzer steht jedem angemeldeten Benutzer offen. Gibt es im Projekt keine Benutzer, werden alle Seiten angeboten. Gibt es Benutzer, ist aber niemand angemeldet, wird gar nicht gewechselt. Das gilt für die Einträge, das Wischen und die Liste im Blatt Mehr. Siehe Benutzerverwaltung. Vorgabe aus.

Symbolauswahl

Die Schaltfläche Symbol wählen ... öffnet die Symbolauswahl. Jedes Symbol des Programms hat eine Bezeichnung (sie steht unter dem Symbol), mehrere Stichworte und gehört zu einer Kategorie. So findet man ein Symbol auch ohne den Dateinamen zu kennen, zum Beispiel „Rollo“ für den Rollladen. Gespeichert wird weiterhin der feste Name des Symbols. An bestehenden Projekten ändert sich deshalb nichts.

Suchfeld: gesucht wird in der Bezeichnung und in den Stichworten, und zwar in der Sprache des Studios. Bei mehreren Wörtern müssen alle vorkommen („rollo auf“). Groß- und Kleinschreibung ist egal, Umlaute dürfen mit ä oder ae geschrieben werden. Treffer in der Bezeichnung stehen vor Treffern in den Stichworten. Der Dateiname des Symbols wird ebenfalls durchsucht.
Kategorie: die Auswahlliste neben dem Suchfeld beschränkt die Symbole des Programms auf einen Bereich, zum Beispiel Beleuchtung, Heizung, Lüftung & Klima, Energie & Zähler, Sicherheit & Zutritt, Räume & Gebäude, Haushalt & Geräte oder Schaltschrank & Feldbus. Alle Kategorien zeigt alles. Die Kategorie wirkt nicht auf die Grafiken aus dem Projekt.
Anzeige: unter jedem Symbol steht die Bezeichnung. Der Hinweis beim Überfahren mit der Maus zeigt zusätzlich den Dateinamen und die Stichworte. Die Schaltfläche im Parameter zeigt nach der Wahl ebenfalls die Bezeichnung.
Übernehmen: ein Klick wählt das Symbol aus, ein Doppelklick oder OK übernimmt es.

Eigene Grafiken (SVG) als Symbol

Die Symbolauswahl ist geteilt: links stehen die Symbole des Programms, rechts die Grafiken aus dem Projekt. Dort erscheinen alle ins Projekt importierten Grafiken im Format SVG (andere Formate wie PNG werden nicht angeboten). Eine Grafik wird zuerst über die Projektgrafiken (Auswahl der Bilder) ins Projekt importiert und danach in der Symbolauswahl gewählt. In der Schaltfläche steht bei einer Projektgrafik der Dateiname mit dem Zusatz „(Projekt)“. Dateinamen mit den Zeichen #, ;, , oder ~ werden nicht angeboten.

Damit sich die Farbe der Grafik zur Laufzeit ändert (hell oder dunkel nach Style, Akzentfarbe beim aktiven Eintrag), muss die SVG-Datei so aufgebaut sein:

Eine Farbe, mit currentColor: überall, wo die Grafik gefärbt werden soll (Linie stroke oder Fläche fill), steht das Wort currentColor. Das Programm ersetzt dieses Wort beim Zeichnen durch die jeweils passende Farbe. Feste Farbwerte wie #000000 bleiben unverändert und lassen sich nicht umfärben. Eine Grafik ganz ohne currentColor wird in ihren eigenen Farben gezeichnet.
Quadratisch mit viewBox: empfohlen ist viewBox="0 0 24 24". Die Grafik wird im Verhältnis eingepasst und mittig im Symbolfeld gezeichnet; ohne viewBox hängt die Größe von den Angaben width und height ab.
Nur Vektoren: keine eingebetteten Bilder (<image>), keine Filter, Verläufe oder Schriften. Text bitte in Pfade umwandeln.
Keine Farben in Stilblöcken: die Farbe nicht über <style> oder Klassen festlegen, sondern direkt in den Attributen fill und stroke der Elemente. Die Ersetzung arbeitet auf dem Text der Datei und findet currentColor zwar überall, ein Stilblock mit festen Farben würde sie aber überschreiben.
Linien: bei Umrissen fill="none" setzen, die Linienstärke etwa 1,5 bis 2 (bei 24 Einheiten Kantenlänge) und die Enden mit stroke-linecap="round" abrunden, damit sie zu den Symbolen des Programms passen. Transparenzen über opacity sind möglich.

Beispiel (Dreieck mit Punkt):

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
  <path fill="none" stroke="currentColor" stroke-width="1.8"
        stroke-linecap="round" stroke-linejoin="round" d="M4 20 12 4l8 16Z"/>
  <circle fill="currentColor" cx="12" cy="15" r="1.6"/>
</svg>

Die Grafik wird aus dem Projekt geladen. Wird sie dort ersetzt, wird sie nach einem Neuladen der Seite bzw. dem Neustart der App in der neuen Fassung gezeichnet.

Hinweise

Es lassen sich nur Seiten des eigenen Projektes eintragen. Eine Seite, die es im Projekt nicht mehr gibt, wird im Blatt Mehr nicht mehr angezeigt.
Es sind höchstens 8 Seiteneinträge plus Startseite, Favoriten und Mehr möglich; ist die Grenze erreicht, lässt sich im Dialog nichts mehr hinzufügen.
Bestehende Menüzeilen: Mehr wird als letzter Eintrag ergänzt, wenn er fehlt; stand er bisher an anderer Stelle, rückt er ans Ende. Eine bisher gewählte eigene Beschriftung oder ein eigenes Symbol von Mehr entfällt.
Je mehr Einträge, desto schmaler wird jeder. Bei vielen Einträgen deshalb die Beschriftungen kurz halten oder die selteneren Seiten hinter Mehr legen.
Wer nur zwischen wenigen Seiten blättern möchte, kann stattdessen die Block Fußzeile mit Seitenpunkten und Favoriten verwenden; zum Aufruf einer einzelnen Seite gibt es den Block Seitenaufruf.

Siehe auch Allgemeine Eigenschaften aller Bedienelemente.