Cross-Plattform: UI-Framework Compose Multiplatform erreicht stabilen Stand

JetBrains hat Version 1.0 von Compose Multiplatform veröffentlicht. Das Framework verwendet den deklarativen Ansatz des Android-UI-Toolkits Jetpack Compose und setzt es plattformübergreifend für Desktop-, Web- und Android-Anwendungen um. Als Programmiersprache kommt wenig überraschend Kotlin zum Einsatz.

Google hat Jetpack Compose Ende Juli in der stabilen Version 1.0 veröffentlicht. Das UI-Toolkit für Android verfolgt einen deklarativen Ansatz und setzt auf die Programmiersprache Kotlin sowie ein reaktives Programmiermodell. Sogenannte Composable Functions definieren die einzelnen Bedienelemente – oder Teile davon. Über @Composable dekorierte Funktionen lassen sich ineinander verschachteln, um letztlich die Oberfläche zu erzeugen. Der Code beschreibt das grundlegende Aussehen der Oberfläche, und unter der Haube kümmert sich das Toolkit um die Umsetzung in der Baumstruktur des UI und um das Aktualisieren der Inhalte.

Von Android zu Multiplattformprojekten

Compose Multiplatform, das im August als Alpha-Version gestartet war, bringt den Ansatz nun auf den Desktop und ins Web. Bisher fehlten UI-Toolktis für Desktop-Anwendungen mit Kotlin, sodass Entwicklerinnen und Entwickler auf Java-UI-Frameworks zurückgreifen mussten. Dank des deklarativen Ansatzes sind bei Compose alle UI-Elemente über den Code definiert. Folgendes einfache Beispiel aus dem JetBrains-Blog zeigt ein Text-Label, das beim Ändern eines Textfelds aktualisiert wird:

var text by remember { mutableStateOf("Hello, World!") }
Column {
   Text(text) //text label
   TextField(text, {text = it}) //text field
}

Ein kostenloses Plug-in für IntelliJ IDEA und Android Studio bietet eine Live-Vorschau des deklarierten UI. Es übernimmt Änderungen im Code und zeigt deren Auswirkungen wohl ohne frischen Build-Prozess und Neustart direkt an.

Als Basis für die grafische Darstellung dient Googles quelloffene 2D-Grafikbibliothek Skia, die unter anderem in Chrome, Firefox, Flutter, Android und LibreOffice zum Einsatz kommt. Sie bildet die Schnittstelle zu der plattformspezifischen Hardwarebeschleunigung, beispielsweise über DirectX oder Metal.

Das Gradle-Plug-in von Compose Multiplatform kann Anwendungen im Debian-Paket-Format (.deb), als Windows-Installer (.msi) und als Disk-Image-Dateien (.dmg) erstellen.

Web und Multiplattform

Die Grundlage für Webanwendungen bildet Kotlin/JS. Das Framework bietet eine API zum Zugriff auf das DOM und CSS-in-JS, um CSS-Elemente zu generieren. Darüber hinaus kann es unter anderem das SVG-Format (Scalable Vector Graphics) direkt verarbeiten.

Eine Android-Komponente bringt Compose Multiplatform zwar nicht mit, aber es verwendet laut JetBrains dieselben APIs wie Jetpack Compose, sodass sich der Code für die Web- und Desktopkomponenten direkt in Android-Anwendungen mit Googles UI-Framework übertragen lassen soll. Umgekehrt können Entwicklerinnen und Entwickler ohne großen Aufwand mit Jetpack Compose deklarierte UIs auf Web und/oder Desktop nach Compose Multiplatform portieren.

Weitere Details lassen sich dem JetBrains-Blog entnehmen. Demnach setzt das Unternehmen Compose Multiplatform bereits seit Anfang des Jahres für die Toolbox-App zum Verwalten von IDEs ein. Auf GitHub finden sich einige Tutorials, die beim Einstieg in das Framework helfen sollen.

(rme)