Aktiverede, deaktiverede og indlæsnings-tilstande
Afspejl tilgængeligheden i dine knapper.
Aktiverede, deaktiverede og indlæsnings-tilstande er en gratis Jetpack Compose Academy-lektion på CoddyKit. Dette er lektion 3 af 4. Du kan læse hele lektionen gratis nedenfor — og derefter øve dig praktisk i browseren med en indbygget kodeeditor og en AI-vejleder, der er tilgængelig døgnet rundt. Den er en del af læringsforløbet i Jetpack Compose Academy, og dine fremskridt synkroniseres på tværs af nettet og CoddyKit-appen. Jetpack Compose Academy-kurset indeholder 4 lektioner i alt.
Knapper har forskellige tilstande
En god knap afspejler virkeligheden: klar, blokeret eller i gang. Compose lader dig udtrykke disse tilstande, så brugerne altid ved, hvad der er muligt. 🚦
Parametret enabled
Alle knapper modtager et enabled-flag. Sæt det til false, så bliver knappen automatisk grå og ignorerer tryk.
Button(
onClick = { submit() },
enabled = false
) { Text("Submit") }Styr enabled fra tilstanden
Den virkelige styrke ligger i at binde enabled til en tilstand. Knyt det til validering, så knappen kun aktiveres, når inputtet er klar.
Button(
onClick = { submit() },
enabled = name.isNotBlank()
) { Text("Submit") }Deaktiveret betyder blokeret
En deaktiveret knap vises stadig, så brugerne kan se, at handlingen findes. Det afdæmpede udseende signalerer hvorfor ikke endnu uden en fejlmeddelelse.
Vis fremgang, mens arbejdet udføres
Vis en indlæsningstilstand ved langsomme handlinger. Hold styr på en boolsk værdi, og erstat teksten med en spinner, mens arbejdet udføres.
var loading by remember { mutableStateOf(false) }Deaktivér under indlæsning
Mens der indlæses, skal du sætte enabled = !loading, så brugerne ikke kan trykke to gange og starte den samme handling igen.
Button(
onClick = { loading = true },
enabled = !loading
) { Text("Save") }Indsæt en spinner
Lav en forgrening på flaget i indholdet: vis en lille CircularProgressIndicator, når der indlæses, og ellers teksten.
Button(onClick = { }, enabled = !loading) {
if (loading) CircularProgressIndicator(Modifier.size(18.dp))
else Text("Save")
}Gør spinneren mindre
Standardspinneren er stor. Begræns dens størrelse med en Modifier.size, så den passer pænt dér, hvor teksten tidligere stod.
CircularProgressIndicator(
modifier = Modifier.size(18.dp),
strokeWidth = 2.dp
)Nulstil, når du er færdig
Når arbejdet er færdigt, skal du sætte loading tilbage til false. Teksten kommer tilbage, og der kan trykkes på knappen igen.
onResult = { loading = false }Tilstande forebygger fejl
Tilsammen beskytter enabled og loading dine handlinger: ingen tryk, før inputtet er gyldigt, og ingen gentagne tryk, mens arbejdet udføres.
Kommunikér, skjul ikke
Foretræk at deaktivere en knap frem for at skjule den. En synlig, men deaktiveret kontrol lærer brugerne, hvordan de kan låse den op.
Hurtigt tjek
Det tager to sekunder at gemme, og brugerne bliver ved med at trykke to gange på knappen.
Opsummering: Knapper med tilstand
Du har lært at afspejle virkeligheden: enabled begrænser handlingen efter gyldighed, mens et indlæsningsflag viser fremgang og forhindrer gentagelser. Ærlige knapper giver tilfredse brugere. 🎯
Lær Kotlin med en AI-underviser — gratis
Skriv og kør rigtig kode i din browser, få øjeblikkelig hjælp fra en AI-underviser døgnet rundt, og fortsæt, hvor du slap, på web eller i appen.
- Kurser
- 30
- Lektioner
- 120
Ofte stillede spørgsmål
Er lektionen “Aktiverede, deaktiverede og indlæsnings-tilstande” gratis?
Ja — hele teksten til “Aktiverede, deaktiverede og indlæsnings-tilstande” kan læses gratis her på nettet. Hvis du vil øve dig interaktivt med en indbygget kodeeditor og en AI-vejleder døgnet rundt og få adgang til resten af Jetpack Compose Academy-kurset, skal du opgradere til CoddyKit PRO. Jetpack Compose Academy-kurset indeholder 4 lektioner i alt.
Hvad lærer jeg i “Aktiverede, deaktiverede og indlæsnings-tilstande”?
Afspejl tilgængeligheden i dine knapper. Du øver dig i Jetpack Compose Academy med praktisk kode, som du kører direkte i browseren, og en AI-vejleder døgnet rundt besvarer dine spørgsmål, mens du arbejder dig gennem lektionen.
Skal jeg have erfaring for at begynde på Jetpack Compose Academy?
Der kræves ingen tidligere erfaring. Jetpack Compose Academy på CoddyKit er tilrettelagt for både begyndere og øvede, så du kan starte her eller fra begyndelsen og lære i dit eget tempo. Dette er lektion 3 af 4.
Hvor lang tid tager lektionen “Aktiverede, deaktiverede og indlæsnings-tilstande”?
De fleste CoddyKit-lektioner tager cirka 5–10 minutter. Hver lektion er kort og interaktiv, så du gør løbende fremskridt og kan fortsætte, hvor du slap – på både web og app.
Kan jeg skrive og køre kode i denne Jetpack Compose Academy-lektion?
Ja. Alle Jetpack Compose Academy-lektioner har en indbygget kodeeditor, så du kan skrive og køre rigtig kode direkte i din browser og få øjeblikkelig feedback fra AI – uden lokal opsætning.
Alle lektioner i dette kursus
- Button og onClick
- Text-, Outlined- og Icon-knapper
- Aktiverede, deaktiverede og indlæsnings-tilstande
- clickable på enhver Composable