Steuerleiste

Die Steuerleiste enthält Steuerelemente, die mit einer bestimmten Ansicht verknüpft sind. Sie zeigt in der nicht maximierten Version bis zu fünf Steuerelemente und in der maximierten Version bis zu fünf zusätzliche Steuerelemente an.

In Medien-Apps wird die Steuerleiste in der Wiedergabeansicht für „Wiedergabe/Pause“, „Zurück“, „Weiter“ und andere Steuerelemente verwendet, einschließlich solcher für benutzerdefinierte Aktionen von Drittanbietern.

Symbol für Zusatzinformationen
Minimierte Steuerleistenkomponente
Die minimierte Steuerleiste bietet eine minimale Gruppe von Steuerelementen, die in mehreren Ansichten verfügbar sind

Anatomie

Die Steuerleiste hat zwei Formate: nicht maximiert und maximiert. Die nicht erweiterte Version kann bis zu fünf Steuerelemente enthalten. In Medien-Apps ist eine davon die Wiedergabe/Pause.

Die Steuerleiste kann im maximierten Zustand bis zu fünf zusätzliche Steuerelemente in einer zweiten Zeile enthalten. Nutzer können die Überlaufschaltfläche auswählen, um die Steuerleiste zu maximieren oder zu minimieren.

1. Teil der Steuerleiste, der vor der Maximierung sichtbar ist
2. Maximierter Teil der Aktionsleiste
3. Eines der Steuerelemente
4. Dreipunkt-Menü (Steuerungsleiste maximieren und minimieren)

Technische Daten

Symbol für Zusatzinformationen
Layout labels
Definitionen von E, M, KL, P, Flex

Steuerleiste

Maximierte Steuerleiste

Platzierung von 1–4 Steuerelementen auf der Steuerleiste mit verankertem Steuerelement in der Mitte

Ein verankertes Steuerelement in der Mitte ist ein Steuerelement, das bevorzugt in der Mitte der Steuerleiste platziert wird, z. B. eine Schaltfläche für die Wiedergabe/Pause von Musik.

Platzierung von 1–4 Steuerelementen auf der Steuerleiste ohne verankerte Steuerelemente

Platzierung von 6–9 Steuerelementen auf der Steuerleiste

Layouts skalieren

Diese Referenzlayouts zeigen, wie die Steuerleiste an Bildschirme verschiedener Breite und Höhe angepasst werden kann. Die Kategorien für Breite und Höhe werden im Abschnitt Layout definiert. Beachten Sie, dass alle Pixelwerte in gerenderten Pixeln vorliegen, bevor ein Downsampling oder Upsampling erfolgt.

Symbol für Zusatzinformationen
Layout
Ränder, Keylines und Abstände für verschiedene Bildschirmgrößen
Symbol für Zusatzinformationen
Layout labels
Definitionen von E, M, KL, P, Flex

Besonders breite Displays mit mehr als 1028 dp zwischen den Rändern

Wenn die Breite zwischen den Rändern größer als die maximale Breite der Steuerleiste (1.028 dp) ist, zentrieren Sie die Steuerleiste horizontal. Die Steuerleiste erstreckt sich nicht bis zum Rand.

Besonders breite Displays mit weniger als 1028 dp zwischen den Rändern

Breitbildformate

Bildschirme mit Standardbreite

Zentrieren Sie die Steuerleiste auf Bildschirmen mit Standardbreite horizontal. Die Steuerleiste erstreckt sich bis zum Rand. Verwenden Sie auf einem Bildschirm mit einer Standardbreite von genau 690 dp, wie in diesem Beispiel, den seitlichen Abstand von P5 zwischen den Rändern der Steuerleiste und den Rändern des Bildschirms.

Kurze Bildschirme

Steuerleiste auf Bildschirmen unter 1.000 dp maximiert

Steuerleiste auf kurzen Bildschirmen maximiert

Steuerleiste auf Bildschirmen über 1.000 dp maximiert

Stile

Symbol für Zusatzinformationen
Farbrichtlinien
Paletten, Höhen- und Deckkraftwerte und mehr

Farbe

Element Farbe(Tagesmodus) Farbe (Nachtmodus)
Primäre Symbole White Weiß mit 88%
Vollbildgitter Schwarz 78% Schwarz: 84%
Farbverlaufsgitter Noch offen Noch offen

Größen

Element Größe (dp)
Steuerleiste 96 (kurze Displays) / 128 (Standardhöhe und höher)
Primäres Symbol 44

Beispiele

Steuerleiste in der Wiedergabeansicht
Steuerleiste in der Wiedergabeansicht maximiert
Steuerleiste in der Medienwarteschlange
Steuerleiste in der Medienwarteschlange maximiert
Steuerleiste in der Medienwarteschlange
Steuerleiste in der Medienwarteschlange maximiert
Steuerleiste ein- und ausblenden, wenn der Nutzer auf die Überlaufschaltfläche tippt