Zustandsverwaltung für Listen

Symbol für Bewertung mit drei Sternen

Scrollbare Listen in Jetpack Compose wie LazyColumn und LazyRow, können große Datenmengen effizient anzeigen. Konfigurationsänderungen wie das Drehen des Geräts oder das Auf- und Zuklappen eines faltbaren Geräts können jedoch den Status einer Liste zurücksetzen, sodass Nutzer wieder an die vorherige Position scrollen müssen.

Best Practices

Scrollbare Listen sollten ihren Status, insbesondere die Scrollposition, und den Status ihrer einzelnen Listenelemente (z. B. Texteingaben) bei allen Konfigurationsänderungen beibehalten, um eine nahtlose Nutzererfahrung zu bieten.

Zutaten

  • rememberLazyListState(): Erstellt und speichert einen LazyListState , mit dem die Scrollposition der Liste gesteuert und beobachtet wird. Er bleibt bei Konfigurationsänderungen automatisch erhalten.
  • rememberSaveable: Speichert den Statuswert bei Konfigurationsänderungen. Dies ist nützlich, um den Status einzelner Listenelemente (z. B. Eingaben in Textfeldern) beizubehalten.

Schritte

In Jetpack Compose wird die Scrollposition einer Liste automatisch beibehalten, wenn Sie einen Scrollstatus verwenden. Verwenden Sie rememberSaveable, um den Status einzelner, komplexer Listenelemente (z. B. TextField-Eingaben) beizubehalten.

1. Scrollstatus der Liste beibehalten

Wenn Sie die Scrollposition Ihrer Liste bei Konfigurations änderungen speichern und wiederherstellen möchten, erstellen Sie mit rememberLazyListState() einen LazyListState und übergeben ihn als state-Parameter Ihrer scrollbaren Liste, z. B. einer LazyColumn.

Compose speichert die Scrollposition automatisch.

2. Status einzelner Listenelemente beibehalten

Wenn Ihre Liste zustandsorientierte Elemente enthält (z. B. Elemente mit Textfeldern), kann der Status dieser einzelnen Elemente verloren gehen, wenn sie aus dem Bildschirm gescrollt und wiederverwendet werden oder bei Konfigurationsänderungen.

Verwenden Sie rememberSaveable im Bereich des Listenelements, um den Status einzelner Elemente beizubehalten. So wird der Status des Elements wiederhergestellt, wenn es neu zusammengesetzt oder wieder in den sichtbaren Bereich gescrollt wird.

Hier ist eine vollständige, kompilierbare Implementierung, die sowohl die Wiederherstellung des Scrollstatus als auch des Elementstatus zeigt:

// Scroll state is automatically saved and restored by rememberLazyListState
val listState = rememberLazyListState()

LazyColumn(state = listState) {
    items(100) { index ->
        // Use rememberSaveable to preserve individual item state (e.g., text input)
        var text by rememberSaveable { mutableStateOf("") }
        TextField(
            value = text,
            onValueChange = { text = it },
            label = { Text("Item $index") }
        )
    }
}

Ergebnisse

Ihre scrollbare Liste kann jetzt ihre Scrollposition und den Status jedes Elements in der Liste wiederherstellen.

Zusätzliche Ressourcen