AppBar Editor
Der AppBar Editor gibt dir volle Kontrolle über die obere Navigationsleiste deiner App. Du kannst das Design, die Typografie, Farben, ein Logo und Action Buttons vollständig anpassen - und das individuell für jede Seite.
Übersicht
Abschnitt betitelt „Übersicht“Der Editor ist in drei Hauptbereiche (Tabs) unterteilt:
Editor öffnen
Abschnitt betitelt „Editor öffnen“Das Bearbeiten-Icon (Stift-Symbol) erscheint nur im Edit Mode in der AppBar, rechts neben dem Titel:
- Aktiviere den Edit Mode über die App Builder Tools
- Navigiere zu einer beliebigen Seite mit AppBar
- Tippe auf das Stift-Icon in der AppBar (rechts vom Titel)
- Der Editor öffnet sich als Modal mit einer Live-Vorschau
Editor-Oberfläche
Abschnitt betitelt „Editor-Oberfläche“Tab-Leiste
Abschnitt betitelt „Tab-Leiste“Die Tab-Leiste am oberen Rand bietet drei Bereiche:
| Tab | Icon | Funktion |
|---|---|---|
| Stil | Palette | Alle visuellen Einstellungen der AppBar |
| Actions | Touch App | Action Buttons links und rechts verwalten |
| Vorlagen | Dashboard | Fertige Designs anwenden und eigene Vorlagen speichern |
Live-Vorschau
Abschnitt betitelt „Live-Vorschau“Unterhalb der Tab-Leiste siehst du eine Live-Vorschau deiner AppBar:
- Zeigt alle Änderungen in Echtzeit
- Enthält einen Beispiel-Titel und den Zurück-Button
- Aktualisiert sich bei jeder Einstellungsänderung
- Zeigt auch konfigurierte Action Buttons
Dark Mode Toggle
Abschnitt betitelt „Dark Mode Toggle“In vielen Bereichen findest du einen Light/Dark Mode Toggle. Damit wechselst du zwischen der Bearbeitung der Farben für helles und dunkles Theme:
- Light Mode: Bearbeite Farben für das helle Theme
- Dark Mode: Bearbeite Farben für das dunkle Theme
Speichern und Schließen
Abschnitt betitelt „Speichern und Schließen“Am unteren Rand des Editors findest du zwei Buttons:
| Button | Funktion |
|---|---|
| Abbrechen | Schließt den Editor ohne Änderungen zu speichern |
| Speichern | Speichert alle Änderungen und schließt den Editor |
Die Änderungen werden in der ISAR-Datenbank gespeichert und sind beim nächsten App-Start verfügbar.
Versteckte AppBar
Abschnitt betitelt „Versteckte AppBar“Wenn du die AppBar über den Sichtbarkeit-Toggle ausblendest, zeigt die Vorschau einen Platzhalter:
“AppBar ist ausgeblendet”
Die Seite wird dann ohne AppBar angezeigt. Dies kann für spezielle Seiten wie Splash-Screens oder Vollbild-Inhalte sinnvoll sein.
Häufige Fragen
Abschnitt betitelt „Häufige Fragen“Warum sehe ich das Stift-Icon nicht?
Abschnitt betitelt „Warum sehe ich das Stift-Icon nicht?“Das Bearbeiten-Icon erscheint nur im Edit Mode. Stelle sicher, dass du den Edit Mode über die App Builder Tools aktiviert hast.
Kann ich verschiedene AppBars für verschiedene Seiten haben?
Abschnitt betitelt „Kann ich verschiedene AppBars für verschiedene Seiten haben?“Ja! Jede Seite hat ihre eigene AppBar-Konfiguration. Wenn du die AppBar auf einer Seite bearbeitest, betrifft das nur diese Seite.
Wie nutze ich die Vorlagen?
Abschnitt betitelt „Wie nutze ich die Vorlagen?“Im Vorlagen-Tab findest du 8 fertige AppBar-Designs (Standard, Transparent, Gradient Blue, etc.). Tippe auf “Anwenden”, um ein Design zu übernehmen. Du kannst auch eigene Designs als Vorlagen speichern.
Wie entferne ich den Zurück-Button?
Abschnitt betitelt „Wie entferne ich den Zurück-Button?“Im Stil-Tab unter “Titel & Navigation” findest du den Toggle “Zurück-Button”. Deaktiviere ihn, um den Button zu entfernen.
Warum funktioniert der Titel-Abstand nicht?
Abschnitt betitelt „Warum funktioniert der Titel-Abstand nicht?“Der Titel-Abstand funktioniert nur, wenn “Titel zentrieren” deaktiviert ist. Bei zentriertem Titel wird der Abstand automatisch berechnet.
Wie ändere ich die Titelfarbe für den Dark Mode?
Abschnitt betitelt „Wie ändere ich die Titelfarbe für den Dark Mode?“Nutze den Dark Mode Toggle in der Titelfarbe-Sektion. Wechsle zu “Dark Mode” und ändere dann die Farbe. Die App verwendet automatisch die richtige Farbe basierend auf dem aktiven Theme.