Android Academy · Lektion

Exponera state från ViewModel

Styr Compose-UI från en ViewModel.

Lektion 2 av 413 steg

Exponera state från ViewModel är en gratis lektion i Android Academy på CoddyKit. Detta är lektion 2 av 4. Du kan läsa vilka 3 lektioner som helst i den här lärvägen kostnadsfritt i sin helhet – därefter låser CoddyKit PRO upp alla lektioner, plus praktisk övning med en inbyggd kodredigerare och en AI-lärare dygnet runt. Den ingår i lärvägen för Android Academy, och Era framsteg synkroniseras mellan webben och CoddyKit-appen. Kursen i Android Academy innehåller totalt 4 lektioner.

Exponera tillstånd för UI:t

En ViewModel innehåller tillstånd, men UI:t behöver kunna observera tillståndet och återrendera när det ändras.

I modern Android används två vanliga verktyg för detta: StateFlow och Compose-typen State.

Mönstret mutable kontra immutable

En bästa praxis är att behålla en privat muterbar backing-egenskap och exponera en publik skrivskyddad version.

Det hindrar UI:t från att av misstag ändra tillståndet direkt.

Exponera med StateFlow

Använd en MutableStateFlow internt och exponera den som en skrivskyddad StateFlow.

class CounterViewModel : ViewModel() {
    private val _count = MutableStateFlow(0)
    val count: StateFlow<Int> = _count.asStateFlow()

    fun increment() {
        _count.value++
    }
}

Samla in StateFlow i Compose

Composable-objektet omvandlar flödet till Compose-tillstånd med collectAsState() (eller den livscykelmedvetna variant som behandlas senare).

@Composable
fun CounterScreen(vm: CounterViewModel) {
    val count by vm.count.collectAsState()
    Text("Count: " + count)
}

Varför StateFlow behöver ett initialvärde

En StateFlow har alltid ett aktuellt värde. Därför måste Ni ange ett initialvärde när Ni skapar den.

Alla nya insamlare får omedelbart det senaste värdet, aldrig ett tomt flöde.

Alternativ: Compose mutableStateOf

För enkelt skärmlokalt tillstånd i ViewModel kan Ni även använda Compose mutableStateOf, som Compose observerar automatiskt.

class CounterViewModel : ViewModel() {
    var count by mutableStateOf(0)
        private set

    fun increment() { count++ }
}

StateFlow jämfört med Compose State

StateFlow är en del av Kotlin-coroutines och fungerar överallt, inte bara i Compose. Det passar bra för delade, livscykelmedvetna flöden.
mutableStateOf är specifikt för Compose och mycket kortfattat.

StateFlow föredras vanligtvis för ViewModels i större appar.

Modellera skärmtillstånd som ett objekt

I stället för många separata flöden grupperar Ni relaterade fält i en enda dataklass för UI-tillstånd. Det gör uppdateringarna atomära och förutsägbara.

data class ProfileUiState(
    val name: String = "",
    val isLoading: Boolean = false,
    val error: String? = null
)

Exponera UI-tillståndsobjektet

Exponera ett enda StateFlow med den tillståndsklassen. UI:t läser allt från en enda källa till sanning.

private val _uiState = MutableStateFlow(ProfileUiState())
val uiState: StateFlow<ProfileUiState> =
    _uiState.asStateFlow()

Uppdatera oföränderligt tillstånd

Uppdatera tillståndet genom att skapa en kopia med ändrade fält, aldrig genom att mutera det gamla objektet.

fun load() {
    _uiState.update { it.copy(isLoading = true) }
    // ... fetch, then:
    _uiState.update {
        it.copy(isLoading = false, name = "Ada")
    }
}

Händelser flödar uppåt, tillstånd flödar nedåt

Detta är grunden i enkelriktat dataflöde:

Tillstånd flödar nedåt från ViewModel till användargränssnittet.
Händelser flödar uppåt från användargränssnittet till ViewModel via funktionsanrop.

Snabbtest

Testa hur väl du förstår hur tillstånd exponeras.

Besvara frågan i den interaktiva lektionen

Sammanfattning

Du har lärt dig:

Behåll en privat MutableStateFlow och exponera en skrivskyddad StateFlow.
Gruppera relaterade fält i en data class för användargränssnittets tillstånd.
Uppdatera med copy() via update {}.
Tillstånd flödar nedåt och händelser flödar uppåt.

Gratis att börja

Lär dig Kotlin med en AI-lärare – gratis

Skriv och kör riktig kod i webbläsaren, få omedelbar hjälp av en AI-lärare dygnet runt och fortsätt där du slutade – på webben eller i appen.

Kurser: 36
Lektioner: 152

Börja lära dig gratis Visa hela kursen

Vanliga frågor

Är lektionen ”Exponera state från ViewModel” gratis?

Ja – du kan läsa vilka 3 lektioner som helst i lärvägen Android Academy, inklusive ”Exponera state från ViewModel”, kostnadsfritt i sin helhet här på webben. Därefter låser CoddyKit PRO upp alla lektioner, plus interaktiv övning med en inbyggd kodredigerare och en AI-lärare dygnet runt. Kursen i Android Academy innehåller totalt 4 lektioner.

Vad lär jag mig i ”Exponera state från ViewModel”?

Styr Compose-UI från en ViewModel. Ni övar på Android Academy med praktisk kod som körs direkt i webbläsaren, medan en AI-handledare som är tillgänglig dygnet runt svarar på Era frågor under lektionen.

Behöver jag någon erfarenhet för att börja lära mig Android Academy?

Du behöver inga förkunskaper. Utbildningen i Android Academy på CoddyKit är upplagd för allt från nybörjare till avancerade elever, så att du kan börja här eller från början och gå fram i din egen takt. Detta är lektion 2 av 4.

Hur lång tid tar lektionen ”Exponera state från ViewModel”?

De flesta CoddyKit-lektioner tar cirka 5–10 minuter. Varje lektion är kort och interaktiv, så att du gör stadiga framsteg och kan fortsätta precis där du slutade – på webben eller i appen.

Kan jag skriva och köra kod i den här Android Academy-lektionen?

Ja. Varje Android Academy-lektion innehåller en inbyggd kodredigerare, så att du kan skriva och köra riktig kod direkt i webbläsaren och få omedelbar AI-feedback – utan lokal installation.

Alla lektioner i den här kursen

← Tillbaka till Android Academy