Jetpack Compose Academy · Lekcja

Model pomiaru i rozmieszczania

Poznaj jednoprzebiegowy układ Compose

Lekcja 1 z 413 kroki

Model pomiaru i rozmieszczania to bezpłatna lekcja Jetpack Compose Academy na CoddyKit. To lekcja 1 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.

Gdy wbudowane układy nie wystarczają

Column, Row i Box obsługują większość ekranów. Czasami jednak potrzebna jest pełna kontrola nad rozmieszczeniem elementów potomnych. Wtedy należy zbudować niestandardowy układ. 🎨

Compose rozmieszcza elementy w jednym przebiegu

W przeciwieństwie do starego systemu View, Compose mierzy i rozmieszcza wszystko w jednym przebiegu. Nie ma tu kosztownego cyklu mierzenia, a następnie ponownego mierzenia.

Dwa kroki: zmierzenie, a następnie rozmieszczenie

Każdy układ wykonuje kolejno dwie czynności. Najpierw mierzy każdy element potomny, aby poznać jego rozmiar. Następnie umieszcza każdy element w wybranej pozycji.

Measurables to jeszcze niezmierzone elementy potomne

Rodzic otrzymuje elementy potomne jako obiekty measurables. Measurable to element potomny, którego jeszcze nie zmierzono — jak paczka przed zważeniem. 📦

Mierzenie tworzy obiekt placeable

Wywołanie measure na obiekcie measurable zwraca obiekt placeable. Zna on swoją ostateczną szerokość i wysokość oraz jest gotowy do umieszczenia.

val placeable = measurable.measure(constraints)
val w = placeable.width

Constraints określają limity rozmiaru

Podczas mierzenia przekazuje się obiekt constraints: minimalną i maksymalną szerokość oraz wysokość dozwoloną dla elementu potomnego. Element wybiera rozmiar mieszczący się w tych granicach.

Każdy element potomny mierz dokładnie raz

Reguła jednego przebiegu oznacza, że każdy element potomny trzeba zmierzyć tylko raz. Ponowne zmierzenie tego samego elementu powoduje błąd w czasie działania programu.

Rodzic decyduje o własnym rozmiarze

Po zmierzeniu elementów potomnych rodzic określa własną szerokość i wysokość. Zwykle dobiera rozmiar tak, aby wrap obejmował właśnie zmierzone elementy potomne.

layout(width, height) {
  // place children here
}

Rozmieszczenie określa pozycję każdego elementu potomnego

W bloku układu wywołuje się placeRelative dla każdego obiektu placeable, przekazując mu współrzędne x i y. To określa miejsce elementu potomnego na ekranie.

placeable.placeRelative(x = 0, y = 0)

placeRelative uwzględnia kierunek tekstu

Należy preferować placeRelative zamiast place. Automatycznie odbija pozycje dla języków pisanych od prawej do lewej, dzięki czemu układ działa wszędzie. 🌍

Ten model napędza każdy układ

Column, Row i wszystkie przyszłe niestandardowe układy stosują ten sam rytm: zmierzenie, a następnie rozmieszczenie. Wystarczy poznać go raz, aby zrozumieć cały system układów Compose.

Szybkie sprawdzenie

Co otrzymuje się po zmierzeniu obiektu measurable?

Podsumowanie: model mierzenia i rozmieszczania

Compose rozmieszcza elementy w jednym przebiegu: w ramach constraints mierzy każdy element potomny raz, aby uzyskać obiekty placeable, a następnie je rozmieszcza. Ten model napędza każdy tworzony układ. ✅

Bezpłatny start

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 „Model pomiaru i rozmieszczania” jest bezpłatna?

Tak — pełny tekst „Model pomiaru i rozmieszczania” 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 „Model pomiaru i rozmieszczania”?

Poznaj jednoprzebiegowy układ Compose Ć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 1 z 4.

Ile czasu zajmuje lekcja „Model pomiaru i rozmieszczania”?

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

  1. Model pomiaru i rozmieszczania
  2. Pisanie funkcji Composable Layout
  3. Ograniczenia i pomiary intrinsic
  4. FlowRow z zawijanymi chipami
← Powrót do Jetpack Compose Academy