Modelowanie klasy danych UiState
Reprezentuj ekran za pomocą jednego obiektu stanu
Modelowanie klasy danych UiState 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.
Jeden obiekt dla ekranu
Zamiast zarządzać wieloma osobnymi polami, zamodeluj cały ekran za pomocą pojedynczej klasy danych UiState, która dokładnie opisuje to, co należy narysować.
data class ProfileUiState(
val name: String = "",
val isLoading: Boolean = false
)Dlaczego jeden obiekt stanu
Grupowanie pól zapobiega niemożliwym kombinacjom i sprawia, że interfejs jest czystą funkcją jednej wartości: ten sam stan na wejściu daje ten sam ekran na wyjściu.
Zadbaj o niezmienność
Używaj właściwości val, aby UiState nigdy nie mógł być modyfikowany w miejscu. Zawsze tworzysz nowy stan, dzięki czemu aktualizacje Compose są przewidywalne.
Aktualizowanie za pomocą copy
Klasy danych automatycznie udostępniają copy(), dzięki czemu możesz zbudować kolejny stan, zmieniając tylko różniące się pola.
val next = state.copy(isLoading = false)Modelowanie ładowania
Rejestruj postęp za pomocą flagi takiej jak isLoading, aby interfejs mógł wyświetlać wskaźnik ładowania podczas wykonywania operacji — wszystko w ramach tego samego obiektu stanu.
Modelowanie błędów
Dodaj pole nullable errorMessage. Gdy ma ono wartość inną niż null, ekran wyświetla błąd; gdy ma wartość null, wszystko jest w porządku. ⚠️
data class UiState(
val items: List<Item> = emptyList(),
val errorMessage: String? = null
)Klasy sealed dla etapów
W przypadku wzajemnie wykluczających się etapów czytelniejsza jest hierarchia sealed: Loading, Success i Error stają się odrębnymi typami, które obsługujesz wyczerpująco.
sealed interface UiState {
object Loading : UiState
data class Success(val data: List<Item>) : UiState
}Rozsądne wartości domyślne
Nadaj każdej właściwości wartość domyślną, aby stan początkowy był jednym prostym wyrażeniem, a nowe ekrany zaczynały działanie w czystym i znanym stanie.
private val _state = MutableStateFlow(ProfileUiState())Udostępnianie tylko do odczytu
Przechowuj zmienny stan wewnątrz ViewModel, ale udostępniaj go jako typ tylko do odczytu, aby tylko ViewModel mógł zmieniać stan ekranu.
val state: StateFlow<ProfileUiState> = _state.asStateFlow()Renderowanie na jego podstawie
Twój Composable odczytuje jeden UiState i rozgałęzia działanie na podstawie jego pól. Logika renderowania pozostaje niewielka, ponieważ stan już określa, co należy wyświetlić.
Jedno źródło prawdy
Klasa UiState staje się jedynym źródłem prawdy dla ekranu, dzięki czemu interfejs i logika nigdy nie rozminą się po cichu. ✨
Szybkie sprawdzenie
Sprawdź swoją intuicję dotyczącą modelowania stanu ekranu.
Podsumowanie
Modeluj ekran za pomocą jednej niezmiennej klasy danych UiState, aktualizuj ją za pomocą copy(), udostępniaj ją tylko do odczytu i pozwól interfejsowi renderować się wyłącznie na podstawie tego jednego źródła.
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 „Modelowanie klasy danych UiState” jest bezpłatna?
Tak — pełny tekst „Modelowanie klasy danych UiState” 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 „Modelowanie klasy danych UiState”?
Reprezentuj ekran za pomocą jednego obiektu stanu Ć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 „Modelowanie klasy danych UiState”?
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
- Dlaczego ViewModel przetrwa obracanie ekranu
- viewModel() w funkcji Composable
- Modelowanie klasy danych UiState
- collectAsStateWithLifecycle