Tab-Vorlage

Die Tab-Vorlage dient als Container für die anderen unten aufgeführten Vorlagen und stellt im oberen Bereich Tabs bereit (siehe Aufbau der Tab-Vorlage).

Die Tabs ermöglichen das Wechseln zwischen Ansichten. Diese Funktion ist besonders nützlich, um Inhalte oder Ansichten zu organisieren, die Nutzer durchsuchen oder suchen möchten.

Enthält:

  • Tableiste mit App-Symbol und bis zu 4 Tabs (keine Schaltfläche „Zurück“)
  • Eingebettete Vorlagen mit folgenden Typen:

Jede Tab-Ansicht entspricht einer eingebetteten Vorlage und es kann jeweils nur eine Tab-Ansicht aktiv sein.

Wireframes der Tabvorlage

Aufbau der Tab-Vorlage

Wireframes der Tabvorlage, einschließlich aller möglichen eingebetteten Vorlagen

Die Vorlage „Tab“ besteht aus den folgenden Elementen:

  1. Tableiste für bis zu vier Tabs
  2. Eingebettete Vorlage mit einer der folgenden Vorlagen: Liste, Raster, Suche, Fenster oder Nachricht

Beispiele für Tab-Vorlagen

Tabvorlage mit eingebetteter Listenvorlage
Die Tab-Ansicht „Alle Geräte“ wird mit einer Tab-Vorlage erstellt, die eine Listenvorlage enthält (Android Auto-Beispiel)
Tabvorlage mit eingebetteter Vorlage „Raster“
Die Tab-Ansicht „Home-Geräte“ wird mit einer Tab-Vorlage erstellt, die eine Vorlage für „Raster“ enthält (Android Auto-Beispiel)

UX-Anforderungen an Tab-Vorlagen

App-Entwickler:

MÜSSEN Fügen Sie für jeden Tab eine Tableiste mit einem Label und einem einfarbigen Vektorsymbol hinzu.
MÜSSEN Fügen Sie im App-Header mindestens zwei und nicht mehr als vier Tabs hinzu.
MÜSSEN Fügen Sie in jede Tab-Ansicht eine eingebettete, nicht leere Vorlage ein.
DARF NICHT Es können mehrere Tabs gleichzeitig aktiv sein.
DARF NICHT Erstellen Sie eine zweite Navigation, indem Sie eine zweite Tab-Ebene hinzufügen.
SOLLTEN Verwenden Sie kurze Tab-Labels, um abgeschnitten zu vermeiden.
DARF NICHT Fügen Sie eingebetteten Vorlagen eine Überschrift oder eine Aktionsleiste ein.