Włączanie Compose Multiplatform
Dodawanie wtyczki i pierwszego współdzielonego composable
Włączanie Compose Multiplatform 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.
Części tej lekcji nie zostały jeszcze przetłumaczone i są wyświetlane po angielsku.
One UI, Every Screen
Compose Multiplatform lets you describe your UI once in Kotlin and render it on Android, iOS and desktop. The same screen code runs everywhere. 🎉
Built on Jetpack Compose
If you know Jetpack Compose, you already know most of this. Compose Multiplatform brings that same declarative toolkit to every target you support.
Add the Compose Plugin
You enable it by adding the Compose Gradle plugin alongside the Kotlin Multiplatform plugin in your shared module. That unlocks the composable APIs.
plugins {
kotlin("multiplatform")
id("org.jetbrains.compose")
}Pull In the Compose BOM
The Compose dependencies live behind a single accessor. You add the runtime, foundation and material libraries from the compose extension so versions stay aligned.
kotlin {
sourceSets {
commonMain.dependencies {
implementation(compose.material3)
}
}
}Your First Shared Composable
A composable is just a Kotlin function marked with @Composable. Put it in commonMain and it becomes available to every platform at once.
import androidx.compose.runtime.Composable
import androidx.compose.material3.Text
@Composable
fun Greeting(name: String) {
Text("Hello, " + name)
}A Root App Composable
Most projects expose one top-level App composable in shared code. Each platform simply calls into it, so the whole UI tree is shared.
@Composable
fun App() {
Greeting("KMP")
}Material Theming Comes Along
Compose Multiplatform ships Material components and theming, so buttons, text fields and colors look consistent across platforms out of the box.
@Composable
fun App() {
MaterialTheme {
Greeting("KMP")
}
}Android Hosts It Natively
On Android you mount the shared App inside an Activity using setContent, exactly like a normal Compose app. Nothing special is required.
class MainActivity : ComponentActivity() {
override fun onCreate(b: Bundle?) {
super.onCreate(b)
setContent { App() }
}
}iOS and Desktop Plug In Too
iOS and desktop each have a tiny entry point that hosts the same App composable. You write the screen once and host it from every target.
Live Previews Still Work
You keep fast iteration with @Preview in your IDE, so you see your shared composable render without launching a full device build each time.
What This Unlocks
With Compose enabled, your UI joins your logic in shared code. The result is one codebase driving pixel-identical screens on phones and desktops.
Quick Check
Where does a shared composable belong?
Recap: Compose Everywhere
You enabled the Compose plugin, wrote a shared composable in commonMain, wrapped it in MaterialTheme and saw how each platform hosts the same App. One UI, every screen. 🚀
Często zadawane pytania
Czy lekcja „Włączanie Compose Multiplatform” jest bezpłatna?
Tak — pełny tekst „Włączanie Compose Multiplatform” 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 „Włączanie Compose Multiplatform”?
Dodawanie wtyczki i pierwszego współdzielonego composable Ć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 „Włączanie Compose Multiplatform”?
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
- Włączanie Compose Multiplatform
- Układy, modyfikatory i motywy
- Stan i rekompozycja we współdzielonym interfejsie
- Osadzanie współdzielonego interfejsu na iOS i Desktop