Klucze dla stabilnych i szybkich list
Pomóż Compose śledzić elementy podczas zmian
Klucze dla stabilnych i szybkich list to bezpłatna lekcja Jetpack Compose Academy na CoddyKit. To lekcja 3 z 4. Możesz przeczytać całą lekcję poniżej za darmo — a potem ćwiczyć ją interaktywnie w przeglądarce z wbudowanym edytorem kodu i tutorem AI dostępnym 24/7. To część ścieżki edukacyjnej Jetpack Compose Academy, a Twój postęp synchronizuje się między webem a aplikacją CoddyKit. Kurs Jetpack Compose Academy zawiera 4 lekcji w sumie.
Jak Compose śledzi wiersze
Domyślnie Compose identyfikuje każdy wiersz na podstawie jego pozycji na liście. Element zero to element zero, element jeden to element jeden i tak dalej.
Zmiana pozycji powoduje problemy
Po wstawieniu lub usunięciu wiersza każdy element znajdujący się poniżej zmienia pozycję. Compose uznaje wtedy te wiersze za inne i niepotrzebnie tworzy je ponownie.
Koszt nieporozumień
Ponownie utworzone wiersze tracą swój stan i animacje. Usunięcie jednego elementu może sprawić, że cała lista zacznie migotać, gdy Compose przestawia wszystkie elementy poniżej.
Nadaj każdemu elementowi klucz
key to stabilna, unikalna wartość, która identyfikuje każdy element na podstawie jego tożsamości, a nie pozycji. Dzięki temu Compose śledzi elementy nawet wtedy, gdy zmieniają miejsce.
items(users, key = { it.id }) { user ->
Text(user.name)
}Użyj prawdziwego unikalnego identyfikatora
Najlepszym kluczem jest prawdziwy unique id pochodzący z danych, na przykład identyfikator z bazy danych. Pozostaje taki sam niezależnie od pozycji elementu.
Klucze muszą być unikalne
Każdy klucz na liście musi być inny. Duplikaty kluczy powodują błąd w czasie działania, dlatego nigdy nie należy opierać kluczy na wartości, którą mogą mieć dwa wiersze.
Nie używaj index jako klucza
Użycie index jako klucza niweczy cały cel, ponieważ indeksy zmieniają się tak samo jak pozycje. Należy sięgać po to rozwiązanie tylko wtedy, gdy naprawdę nie ma żadnego identyfikatora.
Stan pozostaje przy elemencie
Przy stabilnych kluczach zapamiętany stan wiersza przemieszcza się razem z nim. Pole wyboru pozostanie zaznaczone nawet po usunięciu elementów znajdujących się wyżej.
Klucze umożliwiają animacje
Stabilne klucze pozwalają Compose animować elementy, które się przemieszczają, pojawiają lub znikają. Bez nich nie można odróżnić przeniesienia od ponownego utworzenia.
items(items, key = { it.id }) { item ->
Text(item.label, Modifier.animateItem())
}itemsIndexed również przyjmuje klucze
Mechanizm itemsIndexed również przyjmuje lambdę key. Nadal otrzymuje Pan index, a dodatkowo stabilną tożsamość każdego wiersza.
itemsIndexed(data, key = { _, item -> item.id }) { i, item ->
Text("$i: ${item.name}")
}Klucze prawie zawsze się opłacają
W przypadku każdej zmiennej listy dodanie kluczy wymaga niewielkiego wysiłku, a przynosi duże korzyści: poprawny stan, płynne animacje i mniej ponownych kompozycji.
Szybkie sprawdzenie
Co sprawia, że klucz listy jest dobry?
Podsumowanie: stabilne klucze, stabilne listy
Klucze nadają elementom tożsamość niezależną od pozycji. Należy używać prawdziwego unikalnego id i pilnować unikalności kluczy, a stan oraz animacje będą działać poprawnie. ✨
Ucz się Kotlin dzięki korepetycjom AI — za darmo
Pisz i uruchamiaj kod w przeglądarce, otrzymuj natychmiastową pomoc od korepetytora AI dostępnego 24/7 i kontynuuj naukę w sieci lub w aplikacji.
- Kursy
- 30
- Lekcje
- 120
Często zadawane pytania
Czy lekcja „Klucze dla stabilnych i szybkich list” jest bezpłatna?
Tak — pełny tekst „Klucze dla stabilnych i szybkich list” jest dostępny za darmo tutaj w sieci. Aby ćwiczyć ją interaktywnie (wbudowany edytor kodu i tutor AI dostępny 24/7) i odblokować resztę kursu Jetpack Compose Academy, przejdź na CoddyKit PRO. Kurs Jetpack Compose Academy zawiera 4 lekcji w sumie.
Co nauczysz się w „Klucze dla stabilnych i szybkich list”?
Pomóż Compose śledzić elementy podczas zmian Ćwiczysz Jetpack Compose Academy z praktycznym kodem, który uruchamiasz bezpośrednio w przeglądarce, a tutor AI dostępny 24/7 odpowiada na Twoje pytania podczas pracy nad lekcją.
Czy potrzebuję doświadczenia, aby zacząć Jetpack Compose Academy?
Nie wymagamy żadnego doświadczenia. Jetpack Compose Academy w CoddyKit jest strukturyzowany dla początkujących i zaawansowanych użytkowników, więc możesz zacząć tutaj lub od początku i uczyć się w swoim tempie. To lekcja 3 z 4.
Ile czasu zajmuje lekcja „Klucze dla stabilnych i szybkich list”?
Większość lekcji CoddyKit trwa około 5–10 minut. Każda lekcja to mały, interaktywny krok, dzięki czemu robisz systematyczne postępy i zawsze wracasz dokładnie do tego samego miejsca — na webie i w aplikacji.
Czy mogę pisać i uruchamiać kod w tej lekcji Jetpack Compose Academy?
Tak. Każda lekcja Jetpack Compose Academy zawiera wbudowany edytor kodu, więc piszesz i uruchamiasz prawdziwy kod bezpośrednio w przeglądarce i od razu otrzymujesz sprzężenie zwrotne od AI — bez konfiguracji na komputerze.
Wszystkie lekcje w tym kursie
- LazyColumn a przewijalna Column
- items i itemsIndexed
- Klucze dla stabilnych i szybkich list
- Przyklejane nagłówki i listy sekcji