Habilite Compose Multiplatform
Añada el plugin y su primer composable compartido
Habilite Compose Multiplatform es una lección gratuita de Kotlin Multiplatform Academy en CoddyKit. Esta es la lección 1 de 4. Puedes leer la lección completa abajo gratuitamente — luego la practicas en el navegador con un editor de código integrado y un tutor de IA 24/7. Forma parte de la ruta de aprendizaje de Kotlin Multiplatform Academy, y tu progreso se sincroniza en la web y la app de CoddyKit. El curso de Kotlin Multiplatform Academy incluye 4 lecciones en total.
Partes de esta lección aún no han sido traducidas y se muestran en inglés.
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. 🚀
Preguntas frecuentes
¿La lección «Habilite Compose Multiplatform» es gratis?
Sí — el texto completo de «Habilite Compose Multiplatform» es gratis para leer aquí en la web. Para practicarla de forma interactiva (editor de código integrado y tutor de IA 24/7) y desbloquear el resto del curso de Kotlin Multiplatform Academy, actualiza a CoddyKit PRO. El curso de Kotlin Multiplatform Academy incluye 4 lecciones en total.
¿Qué aprenderé en «Habilite Compose Multiplatform»?
Añada el plugin y su primer composable compartido Practicas Kotlin Multiplatform Academy con código real que ejecutas directamente en el navegador, y un tutor de IA 24/7 responde tus preguntas mientras trabajas en la lección.
¿Necesito experiencia previa para empezar Kotlin Multiplatform Academy?
No se requiere experiencia previa. Kotlin Multiplatform Academy en CoddyKit está estructurado para principiantes hasta estudiantes avanzados, así que puedes empezar aquí o desde el inicio y avanzar a tu ritmo. Esta es la lección 1 de 4.
¿Cuánto tiempo toma la lección «Habilite Compose Multiplatform»?
La mayoría de las lecciones de CoddyKit toman alrededor de 5–10 minutos. Cada una es compacta e interactiva, así que avanzas constantemente y retomas exactamente por donde dejaste en la web y la app.
¿Puedo escribir y ejecutar código en esta lección de Kotlin Multiplatform Academy?
Sí. Cada lección de Kotlin Multiplatform Academy incluye un editor de código integrado, así que escribes y ejecutas código real directamente en tu navegador y obtienes retroalimentación instantánea de IA — sin configuración local necesaria.
Todas las lecciones de este curso
- Habilite Compose Multiplatform
- Diseños, modificadores y tematización
- Estado y recomposición en la interfaz compartida
- Aloje la interfaz compartida en iOS y Desktop