Keys til stabile, hurtige lister
Hjælp Compose med at følge elementer gennem ændringer.
Keys til stabile, hurtige lister 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.
Sådan holder Compose styr på rækker
Som standard identificerer Compose hver række ud fra dens position på listen. Element nul er element nul, element ét er element ét og så videre.
Positionen bryder sammen ved ændringer
Når du indsætter eller fjerner en række, ændrer alle elementer nedenunder position. Compose tror nu, at disse rækker er anderledes, og bygger dem unødvendigt igen.
Prisen for forvirring
Rækker, der bygges igen, mister deres tilstand og animationer. Et fjernet element kan få hele listen til at flimre, mens Compose omarrangerer alt nedenunder.
Giv hvert element en nøgle
En key er en stabil, unik værdi, der navngiver hvert element ud fra dets identitet, ikke dets position. Derefter kan Compose følge elementerne, selv når de flyttes.
items(users, key = { it.id }) { user ->
Text(user.name)
}Brug et ægte unikt id
Den bedste nøgle er et ægte unikt id fra dine data, f.eks. et database-id. Det forbliver det samme, uanset hvor elementet befinder sig.
Nøgler skal være unikke
Hver nøgle på listen skal være forskellig. Duplikate nøgler udløser en kørselsfejl, så brug aldrig en værdi som nøgle, hvis to rækker kan dele den.
Brug ikke indekset som nøgle
At bruge index som nøgle modarbejder formålet, fordi indekser flytter sig ligesom positioner. Brug det kun, når du virkelig ikke har et id.
Tilstanden bliver hos elementet
Med stabile nøgler følger en rækkes gemte tilstand med den. Et afkrydsningsfelt forbliver markeret, selv efter at elementer over det er blevet slettet.
Nøgler driver animationer
Stabile nøgler gør det muligt for Compose at animere elementer, der flyttes, vises eller forlader listen. Uden dem kan Compose ikke skelne en flytning fra en genopbygning.
items(items, key = { it.id }) { item ->
Text(item.label, Modifier.animateItem())
}itemsIndexed tager også nøgler
Builderen itemsIndexed accepterer også en key-lambda. Du får stadig indekset samt en stabil identitet for hver række.
itemsIndexed(data, key = { _, item -> item.id }) { i, item ->
Text("$i: ${item.name}")
}Nøgler er næsten altid indsatsen værd
På alle lister, der kan ændre sig, er det en lille indsats at tilføje nøgler med stor gevinst: korrekt tilstand, jævne animationer og færre genopbygninger.
Hurtigt tjek
Hvad kendetegner en god nøgle til en liste?
Opsummering: stabile nøgler, stabile lister
Nøgler giver elementer en identitet ud over positionen. Brug et ægte unikt id, sørg for at nøglerne er unikke, så fungerer tilstand og animationer bare. ✨
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 “Keys til stabile, hurtige lister” gratis?
Ja — hele teksten til “Keys til stabile, hurtige lister” 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 “Keys til stabile, hurtige lister”?
Hjælp Compose med at følge elementer gennem ændringer. 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 “Keys til stabile, hurtige lister”?
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
- LazyColumn kontra scrollbar Column
- items og itemsIndexed
- Keys til stabile, hurtige lister
- Fastgjorte headers og sektionslister