Bei Rastern werden Elemente in einem Rasterlayout dargestellt.
Diese Vorlage ist nützlich, wenn Nutzer ihre Auswahl hauptsächlich auf Bilder treffen.
Diese Vorlage kann in die Tab-Vorlage eingebettet werden, um die Navigation über Tabs zu ermöglichen.
Enthält:
- Kopfzeile mit optionaler Aktionsleiste (Aktionsleiste wird durch Tabs ersetzt, wenn diese Vorlage in die Tabvorlage eingebettet ist)
- Rasterelemente (siehe Hinweis unten), die jeweils ein Symbol oder ein großes Bild enthalten
- Primärtext für jedes Rasterelement (erforderlich)
- Sekundärtext für jedes Rasterelement (optional)
- Optionale unverankerte Aktionsschaltfläche
Beispiele für Rastervorlagen
Die folgenden Beispiele für Android Auto und Android Automotive OS (AAOS) wurden mit der Vorlage Grid erstellt.
Raster, in dem einige Elemente Sekundärtext haben (Beispiel für Android Auto)
Raster mit dem Symbol eines Elements vorübergehend durch ein rotierendes Ladesymbol und dem Primärtext eines anderen Elements wird abgeschnitten, da seine Länge den verfügbaren Platz überschreitet (AAOS-Beispiel)
UX-Anforderungen für Rastervorlage
App-Entwickler:
| SOLLTEN | Begrenzen Sie die Länge des primären und sekundären Textstrings, um ein Abschneiden zu vermeiden. |
| SOLLTEN | Jedem Rasterelement eine Aktion zugeordnet (Elemente, die nur Informationszwecken dienen) werden nicht empfohlen. |
| SOLLTEN | Zeigen Sie den Elementstatus (bei Rasterelementen mit mehreren Zuständen, z. B. ausgewählt und nicht ausgewählt) durch Variationen des Bildes, Symbols oder Texts klar an. |
| DARF NICHT | Füge gleichzeitig eine Aktionsleiste und eine unverankerte Aktionsschaltfläche ein. |
| MAI | Zeigt anstelle des Symbols oder Bildes für ein Rasterelement ein Ladesymbol an, wenn eine dem Element zugeordnete Aktion ausgeführt wird. |