Verwenden Sie gängige Layouts, um Ihre App für gängige Anwendungsfälle und Bildschirmgrößen zu gestalten. Diese gebrauchsfertigen Kompositionen sind gute Ausgangspunkte.
Layout mit Liste und Details
Mit einer Listen-Detailansicht können Nutzer Listen mit Elementen durchsuchen, die beschreibende, erklärende oder andere zusätzliche Informationen enthalten – die Elementdetails. Bei kompakten Bildschirmgrößen sind nur die Listen- oder Detailansicht sichtbar. Listen sind die häufigste Form von Layouts für Apps, da sie eine Sammlung von Inhalten in einem zeilenbasierten Layout darstellen. Das Layout mit Liste und Details eignet sich ideal für Messaging-Apps, Kontaktmanager, Dateibrowser oder jede App, in der die Inhalte als Liste von Elementen organisiert werden können, die zusätzliche Informationen enthalten.
Inhalte können statisch oder dynamisch sein.
- Dynamische Inhalte werden von Ihrer App spontan bereitgestellt und eignen sich ideal für von Nutzern erstellte Inhalte oder um die Präferenzen oder Aktionen des Nutzers widerzuspiegeln. Stellen Sie sich beispielsweise eine Foto-App mit einer scrollbaren Liste von von Nutzern erstellten Fotos vor, die für jeden Nutzer einzigartig ist und sich ändert, wenn der Nutzer weitere Bilder hochlädt. Diese Bilder sind dynamische Inhalte.
- Statische Inhalte sind fest codierte Inhalte, die nur durch direkte Änderungen am Code Ihrer App geändert werden können. Beispiele für statische Inhalte sind Bilder und Texte, die jeder Nutzer sehen kann.
Die Figma-Datei „Now in Android“ enthält mehrere Layout beispiele. Das folgende Beispiel zeigt eine eindimensionale Sammlung von Inhalten.
Weitere Designhinweise zu Listen komponenten und ‑spezifikationen finden Sie unter Material 3-Listen.
Feed layout
Bei einem Feedlayout werden gleichwertige Inhaltselemente in einem konfigurierbaren Raster angeordnet, damit eine große Menge an Inhalten schnell und bequem angezeigt werden kann. Weitere Informationen finden Sie in den Material 3-Richtlinien zur Verwendung von Karten in einer Sammlung. Feeds können auf kompakten Displays als Liste oder Raster konfiguriert werden, in der Regel in Karten oder Kacheln. Inhalte können dynamisch sein, d. h., sie werden aus einer dynamischen externen Quelle wie einer API „eingespeist“.
Ein Rasterlayout besteht aus Zeilen und Spalten, die durch implizite oder explizite Containment-Prinzipien gebildet werden. Ein Rasterlayout kann starrer angewendet oder versetzt werden, um die Zeilen und Spalten zu variieren. Bei beiden sollte der Abstand und die Logik einheitlich angewendet werden, um Nutzer nicht zu verwirren.
Sie können ein Feedlayout mit Lazy Lists oder Lazy Grids implementieren.
Beispiele für gängige Feedformate sind eine Fotogalerie und Podcasts in einem Rasterlayout.
Layout für Supportbereich
Für eine mobile Ansicht sind möglicherweise unterstützende Inhalte oder Steuerelemente wie Blätter oder Dialogfelder erforderlich. Sie sorgen dafür, dass die Hauptansicht übersichtlich bleibt.
Weitere Informationen finden Sie in den M3-Richtlinien für Bottom Sheets.
WebViews
In einer WebView werden Webseiten in der App angezeigt. In den meisten Fällen empfehlen wir, einen Standardwebbrowser wie Chrome zu verwenden, um Inhalte für den Nutzer bereitzustellen. Weitere Informationen zu Webbrowsern finden Sie im Leitfaden zum Aufrufen eines Browsers mit einer Intent.