Mit Lazy-Grids können Sie große Datensätze und dynamische Inhalte verwalten und so die App-Leistung verbessern. Mit Lazy-Grid-Kompositen können Sie Elemente in einem scrollbaren Container anzeigen, der sich über mehrere Spalten oder Zeilen erstreckt.
Versionskompatibilität
Für diese Implementierung muss das minSDK Ihres Projekts auf API-Level 21 oder höher festgelegt sein.
Abhängigkeiten
Rasterausrichtung festlegen
Die Composeables LazyHorizontalGrid
und LazyVerticalGrid
unterstützen die Anzeige von Elementen in einem Raster. In einem Lazy Vertical Grid werden die Elemente in einem vertikal scrollbaren Container angezeigt, der sich über mehrere Spalten erstreckt. Lazy Horizontal Grids funktionieren auf der horizontalen Achse genauso.
Scrollbares Raster erstellen
Mit dem folgenden Code wird ein horizontal scrollbares Raster mit drei Spalten erstellt:
@Composable fun ScrollingGrid() { val itemsList = (0..15).toList() val itemModifier = Modifier .border(1.dp, Color.Blue) .width(80.dp) .wrapContentSize() LazyHorizontalGrid( rows = GridCells.Fixed(3), horizontalArrangement = Arrangement.spacedBy(16.dp), verticalArrangement = Arrangement.spacedBy(16.dp) ) { items(itemsList) { Text("Item is $it", itemModifier) } item { Text("Single item", itemModifier) } } }
Wichtige Punkte zum Code
- Mit dem
LazyHorizontalGrid
-Element wird die horizontale Ausrichtung des Rasters festgelegt.- Wenn Sie ein vertikales Raster erstellen möchten, verwenden Sie stattdessen die Taste
LazyVerticalGrid
.
- Wenn Sie ein vertikales Raster erstellen möchten, verwenden Sie stattdessen die Taste
- Mit der Eigenschaft
rows
wird festgelegt, wie die Rasterinhalte angeordnet werden.- Verwenden Sie für ein vertikales Raster die Property
columns
, um das Layout anzugeben.
- Verwenden Sie für ein vertikales Raster die Property
items(itemsList)
fügtitemsList
zuLazyHorizontalGrid
hinzu. Das Lambda-Objekt rendert für jedes Element einText
-Komposit und legt den Text auf die Artikelbeschreibung fest.- Mit
item()
wirdLazyHorizontalGrid
ein einzelnes Element hinzugefügt, während das Lambda ein einzelnesText
rendert, das ähnlich wieitems()
zusammengesetzt werden kann. GridCells.Fixed
definiert die Anzahl der Zeilen oder Spalten.Wenn Sie ein Raster mit möglichst vielen Zeilen erstellen möchten, legen Sie die Anzahl der Zeilen mit
GridCells.Adaptive
fest.Im folgenden Code gibt der Wert
20.dp
an, dass jede Spalte mindestens 20 dp breit ist und alle Spalten dieselbe Breite haben. Wenn das Display 88 dp breit ist, gibt es 4 Spalten mit jeweils 22 dp.
Ergebnisse
LazyHorizontalGrid
Sammlungen, die diesen Leitfaden enthalten
Dieser Leitfaden ist Teil der folgenden ausgewählten Sammlungen von Kurzanleitungen, die allgemeinere Ziele der Android-Entwicklung abdecken:
![](https://developer.android.com/static/images/quick-guides/collection-illustration.png?hl=de)
Liste oder Raster anzeigen
![](https://developer.android.com/static/images/quick-guides/collection-illustration.png?hl=de)
Interaktive Komponenten anzeigen
![](https://developer.android.com/static/images/quick-guides/collection-illustration.png?hl=de)