Kotlin Multiplatform Academy · Lekcja

Nawigowanie między współdzielonymi ekranami

Podpinanie grafu nawigacji w Compose Multiplatform

Lekcja 1 z 413 kroki

Nawigowanie między współdzielonymi ekranami to bezpłatna lekcja Kotlin Multiplatform 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 Kotlin Multiplatform Academy, a Twój postęp synchronizuje się między webem a aplikacją CoddyKit. Kurs Kotlin Multiplatform Academy zawiera 4 lekcji w sumie.

Więcej niż jeden ekran

Prawdziwe aplikacje mają wiele ekranów: listę, szczegóły i stronę ustawień. Nawigacja umożliwia przemieszczanie się między nimi we współdzielonym kodzie Compose. 🧭

Jeden graf dla każdej platformy

Definiujesz jeden graf nawigacji w commonMain, a Android, iOS i komputer korzystają z tej samej mapy tras.

Dodaj bibliotekę nawigacji

Compose Multiplatform zawiera własny artefakt navigation-compose. Dodaj go do commonMain, aby otrzymać cały zestaw narzędzi do routingu.

commonMain.dependencies {
    implementation(libs.navigation.compose)
}

Ekrany to po prostu trasy

Każde miejsce docelowe jest identyfikowane za pomocą ciągu znaków route. Możesz myśleć o nim jak o małym adresie jednego ekranu w aplikacji.

Utwórz NavController

NavController pamięta, gdzie się znajdujesz, i pozwala się przemieszczać. Tworzysz go, a następnie przekazujesz do grafu.

val navController = rememberNavController()

Zadeklaruj NavHost

NavHost przechowuje ekrany i wyświetla trasę, która jest aktualnie wybrana. Przekazujesz mu kontroler oraz miejsce docelowe startowe.

NavHost(navController, startDestination = "home") {
    composable("home") { HomeScreen() }
    composable("details") { DetailsScreen() }
}

Wybierz miejsce docelowe startowe

startDestination to pierwszy ekran widoczny dla użytkowników. Jest to po prostu jeden z ciągów tras, wybrany jako punkt wejścia.

Przejdź dalej

Aby otworzyć inny ekran, wywołujesz navigate z jego trasą. NavHost sam podmienia ekran na wskazane miejsce docelowe.

Button(onClick = { navController.navigate("details") }) {
    Text("Open details")
}

Wracaj w uporządkowany sposób

Wywołanie popBackStack przenosi do poprzedniego ekranu. Compose śledzi historię, dzięki czemu przycisk Wstecz działa tak, jak oczekują tego użytkownicy.

navController.popBackStack()

Stos powrotu

Każdy otwierany ekran jest umieszczany na stosie powrotu. Cofnięcie usuwa element ze szczytu, podobnie jak ze stosu kart.

Współdzielony routing, natywny hosting

Graf jest współdzielony, ale każda platforma nadal hostuje go we własnym punkcie wejścia. Jedna mapa tras, dwa natywne kontenery. 🙂

Szybkie sprawdzenie

Który komponent faktycznie wykonuje przejście z jednego ekranu do drugiego?

Podsumowanie: współdzielona mapa ekranów

Dodano nawigację, utworzono NavHost z trasami oraz użyto NavController do przechodzenia dalej i wracania. Jeden graf, każda platforma. 🚀

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 „Nawigowanie między współdzielonymi ekranami” jest bezpłatna?

Tak — pełny tekst „Nawigowanie między współdzielonymi ekranami” 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 Kotlin Multiplatform Academy, przejdź na CoddyKit PRO. Kurs Kotlin Multiplatform Academy zawiera 4 lekcji w sumie.

Co nauczysz się w „Nawigowanie między współdzielonymi ekranami”?

Podpinanie grafu nawigacji w Compose Multiplatform Ćwiczysz Kotlin Multiplatform 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ąć Kotlin Multiplatform Academy?

Nie wymagamy żadnego doświadczenia. Kotlin Multiplatform 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 „Nawigowanie między współdzielonymi ekranami”?

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 Kotlin Multiplatform Academy?

Tak. Każda lekcja Kotlin Multiplatform 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. Nawigowanie między współdzielonymi ekranami
  2. Przekazywanie argumentów i deep linków
  3. Współdzielone obrazy, czcionki i napisy
  4. Lokalizowanie tekstów współdzielonego interfejsu
← Powrót do Kotlin Multiplatform Academy