Preservare lo stato delle schede al cambio
Mantenga lo scorrimento e lo stato di ogni scheda.
Preservare lo stato delle schede al cambio è una lezione Jetpack Compose Academy gratuita su CoddyKit. Questa è la lezione 3 di 4. Puoi leggere la lezione completa qui gratuitamente — poi esercitati direttamente nel browser con un editor di codice integrato e un tutor IA disponibile 24/7. Fa parte del percorso di apprendimento Jetpack Compose Academy, e i tuoi progressi si sincronizzano tra il web e l'app CoddyKit. Il corso Jetpack Compose Academy include 4 lezioni in totale.
Il problema della posizione di scorrimento persa
Per impostazione predefinita, uscire da una scheda e tornarvi la ricrea da zero, perciò la scroll position e i dati inseriti scompaiono. Fastidioso, vero? 😅
Perché succede
Una semplice navigate sostituisce la destinazione, quindi Compose dimentica la vecchia schermata. Per conservare lo stato bisogna indicare alla navigazione di save invece di eliminarlo.
Salvare all'uscita
Quando esegue il pop della vecchia scheda, aggiunga saveState per memorizzarne lo stato dell'interfaccia invece di eliminarlo.
popUpTo(startRoute) {
saveState = true
}Ripristinare all'ingresso
Quando naviga verso la scheda, imposti restoreState per ripristinare immediatamente lo stato salvato in precedenza.
navController.navigate(tab.route) {
restoreState = true
}La combinazione dei tre flag
Insieme, saveState, restoreState e launchSingleTop offrono il comportamento classico e fluido che gli utenti si aspettano quando passano da una scheda all'altra.
popUpTo(start) { saveState = true }
launchSingleTop = true
restoreState = trueAnche rememberSaveable è utile
Per i valori contenuti in una schermata, rememberSaveable mantiene elementi come i campi di testo anche dopo una ricreazione, completando il salvataggio dello stato di navigazione.
var query by rememberSaveable { mutableStateOf("") }Gli elenchi richiedono il salvataggio dello scorrimento
Una LazyColumn conserva la posizione di scorrimento quando si usa rememberLazyListState, e lo stato di navigazione salvato permette di mantenerla anche tornando da un'altra scheda.
val listState = rememberLazyListState()
LazyColumn(state = listState) { /* ... */ }Controllare la route iniziale
Esegua sempre il pop fino allo stesso id della start destination, così i bundle dello stato salvato vengono associati alla scheda corretta.
popUpTo(navController.graph.findStartDestination().id)Verificare passando da una scheda all'altra
Faccia una prova: scorra una scheda, passi a un'altra e poi torni indietro. Con i flag impostati, lo scroll dovrebbe trovarsi esattamente nel punto in cui lo aveva lasciato.
Quando non ripristinare
A volte una scheda deve aggiornarsi all'ingresso, per esempio nel caso di un feed. In tal caso, per quella route è sufficiente skip restoreState e lasciare che venga ricreata.
Lo stato oltre una singola schermata
Per i dati che devono durare più a lungo della scheda, li trasferisca in un ViewModel condiviso, così i flag di navigazione gestiscono solo l'interfaccia e non i dati reali.
Controllo rapido
Ha imparato a mantenere aggiornata ogni scheda. È il momento di verificare.
Riepilogo
Ha mantenuto persistenti le schede: saveState + restoreState + launchSingleTop conservano scorrimento e dati inseriti, mentre rememberSaveable salva i valori all'interno della schermata. Fluido! ✨
Impara Kotlin con un tutor IA — gratis
Scrivi ed esegui vero codice nel tuo browser, ricevi aiuto istantaneo da un tutor IA disponibile 24/7, e riprendi da dove hai lasciato sul web o nell'app.
- Corsi
- 30
- Lezioni
- 120
Domande Frequenti
La lezione «Preservare lo stato delle schede al cambio» è gratuita?
Sì — il testo completo di «Preservare lo stato delle schede al cambio» è gratuito qui sul web. Per esercitarvi in modo interattivo (un editor di codice integrato e un tutor IA 24/7) e sbloccare il resto del corso Jetpack Compose Academy, passa a CoddyKit PRO. Il corso Jetpack Compose Academy include 4 lezioni in totale.
Cosa imparerò in «Preservare lo stato delle schede al cambio»?
Mantenga lo scorrimento e lo stato di ogni scheda. Eserciti Jetpack Compose Academy con codice pratico che esegui direttamente nel browser, e un tutor IA 24/7 risponde alle tue domande mentre lavori sulla lezione.
Ho bisogno di esperienza per iniziare Jetpack Compose Academy?
Non è richiesta alcuna esperienza precedente. Jetpack Compose Academy su CoddyKit è strutturato per principianti e studenti avanzati, quindi puoi iniziare da qui o dall'inizio e procedere al tuo ritmo. Questa è la lezione 3 di 4.
Quanto tempo richiede la lezione «Preservare lo stato delle schede al cambio»?
La maggior parte delle lezioni CoddyKit richiede circa 5–10 minuti. Ogni lezione è breve e interattiva, quindi fai progressi costanti e riprendi esattamente da dove hai lasciato su web e app.
Posso scrivere ed eseguire codice in questa lezione Jetpack Compose Academy?
Sì. Ogni lezione Jetpack Compose Academy include un editor di codice integrato, quindi scrivi ed esegui codice reale direttamente nel tuo browser e ricevi feedback istantaneo dall'IA — nessuna configurazione locale necessaria.
Tutte le lezioni di questo corso
- NavigationBar con più schede
- Evidenziare la route selezionata
- Preservare lo stato delle schede al cambio
- TabRow e pagine scorrevoli