Compose Multiplatform für Kotlin: Das vollständige Handbuch
Willkommen zum ausführlichsten Leitfaden zu Compose Multiplatform (CMP) – der modernen Technologie von JetBrains, mit der Sie native Benutzeroberflächen für Android, iOS, Desktop (Windows, macOS, Linux) und Web erstellen können – und das mit einem einheitlichen Code in Kotlin. In diesem Artikel behandeln wir alles: von der Installation bis hin zu fortgeschrittenen Techniken und Best Practices.
1. Was ist Compose Multiplatform und warum brauchen Sie es?
Compose Multiplatform ist ein deklaratives Framework zur Erstellung von Benutzeroberflächen, das auf Jetpack Compose von Google basiert, aber für den Einsatz auf mehreren Plattformen erweitert wurde. Im Gegensatz zu traditionellen Ansätzen (z. B. separate XML-Layouts für Android und SwiftUI für iOS) ermöglicht CMP, die UI-Logik einmal zu schreiben und für jede Zielplattform in nativen Code zu kompilieren.
Warum ist das sinnvoll? Erstens bedeutet es eine drastische Reduzierung der Entwicklungszeit: Statt zwei oder mehr Codebasen zu pflegen, arbeiten Sie mit einer einzigen. Zweitens sorgt es für UI-Konsistenz: Die Geschäftslogik und das Erscheinungsbild der App sind auf allen Plattformen identisch, was Tests und Wartung vereinfacht. Drittens ermöglicht es den Zugriff auf native APIs: Sie können plattformspezifischen Code (z. B. Kamera oder Standortdienste) über den expect/actual-Mechanismus nutzen, ohne die Kotlin-Ökosystem zu verlassen.
Compose Multiplatform ist ideal für Startups, Produktteams und Entwickler, die ein maximales Publikum erreichen möchten, ohne doppelte Arbeit zu leisten. Die Bibliothek wird aktiv von JetBrains und der Community weiterentwickelt und gilt im Jahr 2025 als eine der vielversprechendsten Lösungen im Bereich der plattformübergreifenden Entwicklung.
2. Installation
Da Compose Multiplatform keine Bibliothek im herkömmlichen Sinne ist (wie ein pip-Paket), sondern eher eine Sammlung von Plugins und Konfigurationen für Gradle, erfolgt die Installation über das Build-System von Kotlin Multiplatform. Hier ist die genaue Schritt-für-Schritt-Anleitung zur Erstellung eines neuen Projekts:
Schritt 1: Projekt mit IntelliJ IDEA erstellen (empfohlen)
Öffnen Sie IntelliJ IDEA (Community oder Ultimate), wählen Sie Datei → Neu → Projekt. Wählen Sie im Assistenten die Vorlage Compose Multiplatform aus. Geben Sie einen Projektnamen ein und klicken Sie auf "Fertigstellen". Die IDE generiert automatisch die Projektstruktur und alle erforderlichen Abhängigkeiten.
Schritt 2: Manuelle Konfiguration (für bestehende Projekte)
Fügen Sie in der build.gradle.kts-Datei (Projekt-Root) folgenden Code hinzu:
plugins {
kotlin("multiplatform") version "2.0.21"
id("org.jetbrains.compose") version "1.7.1"
id("org.jetbrains.kotlin.plugin.compose") version "2.0.21"
}
kotlin {
androidTarget()
listOf(
iosX64(),
iosArm64(),
iosSimulatorArm64()
).forEach { iosTarget ->
iosTarget.binaries.framework {
baseName = "ComposeApp"
isStatic = true
}
}
sourceSets {
val commonMain by getting {
dependencies {
implementation(compose.runtime)
implementation(compose.foundation)
implementation(compose.material3)
implementation(compose.ui)
}
}
val androidMain by getting {
dependencies {
implementation("androidx.activity:activity-compose:1.9.3")
}
}
}
}
Wichtig: Die Versionen der Plugins und von Kotlin müssen kompatibel sein. Aktuelle Versionen finden Sie jederzeit im GitHub-Repository von Compose Multiplatform.
3. Schnellstart – ein minimales funktionierendes Beispiel
Nach der Projekterstellung öffnen Sie die Datei commonMain/kotlin/App.kt und ersetzen Sie deren Inhalt durch den folgenden Code:
import androidx.compose.foundation.layout.*
import androidx.compose.material3.*
i Auch in der Bibliothek
Objektserialisierung in Java: Vollständiger Leitfaden für Anfänger
Cheerio für JavaScript (Node.js): Komplettguide mit Beispielen
Boost für C++: Vollständiger Leitfaden mit Beispielen
Redis-Client für TypeScript: ioredis und redis (node-redis)
Dependency Injection Container für JavaScript (Node.js): Awilix