Jetpack Compose, Googles neues UI-Toolkit für Android, befindet sich jetzt in der Alpha-Phase

Jetpack Compose, Googles UI-Toolkit zur Entwicklung von Android-Apps, befindet sich jetzt in der Alpha-Phase. Es ist vollständig mit den Standardansichten von Android kompatibel.

Bei der Entwicklung einer App gibt es viele Möglichkeiten. Sie können wählen, für welche Plattform(en) Sie entwickeln möchten, welche Programmiersprache(n) Sie verwenden möchten und vieles mehr.

Bereits im Herbst 2019 Google eingeführt ein neues Framework zum Erstellen von Benutzeroberflächen in Android mit Kotlin. Bisher befand es sich in einem Entwicklungsstadium mit häufigen bahnbrechenden Änderungen und zahlreichen fehlenden Funktionen. Aber heute hat Google Jetpack Compose in den Alpha-Release-Status gebracht, was bedeutet, dass es der Verwendung in Projekten in Produktionsqualität einen Schritt näher gekommen ist.

Was ist Jetpack Compose?

Beim Erstellen einer Android-App müssen Sie sich normalerweise mit zwei Hauptkomponenten befassen: dem Code für logikbasierte Dinge; und das XML für Layouts. Standardmäßig verwendet Android Java für Code und einen eigenen Satz XML-Tags für Layouts.

Für viele sind Java und XML völlig ausreichend, insbesondere für einfachere Apps. Aber beide Systeme haben ihre Grenzen und Ärgernisse. Mit der Einführung von Kotlin als offiziell Mit der neuen (und empfohlenen) Sprache für die Android-Entwicklung ist die Codierung bei der Erstellung einer Android-App wohl viel einfacher geworden. Mit den praktischen Funktionen von Kotlin wie dem integrierten Nullschutz und den Erweiterungsfunktionen sieht der Code sauberer aus und ist leichter zu lesen.

Aber Kotlin hat an den Android-Layouts nichts geändert. Um ein komplexes Layout zu erstellen, mussten Sie noch eine XML-Datei erstellen und dort entwerfen. Dies hat einige bemerkenswerte Nachteile, einschließlich der inhärenten Trennung zwischen Code und XML. Wenn Ihr Code beispielsweise eine konstante Zeichenfolge enthält, können Sie diese nicht einfach aus XML referenzieren. Wenn sich diese Zeichenfolge also im Code ändert, müssen Sie daran denken, sie auch in XML zu aktualisieren.

Geben Sie Jetpack Compose ein. Dies ist Googles Antwort auf den immer umständlicher werdenden XML-Layout-Designprozess in Android. Anstatt die Benutzeroberfläche Ihrer App in XML zu entwerfen, können Sie dies direkt aus Ihrem Code heraus tun. Obwohl Code-basierte Layouts erstellt werden können, sind sie in der Regel weniger wartbar als XML und beinhalten leicht kaputte Bibliotheken. Compose hingegen ist so konzipiert, dass es direkt in Kotlin funktioniert: kein XML mehr.

Jetpack Compose ist auch eine ziemlich radikale Abkehr vom standardmäßigen zwingenden Design von XML-Layouts. Stattdessen ähnelt es eher React oder Flutter, mit deklarativen Layouts, die sich selbst aktualisieren, wenn sich Daten ändern, anstatt sich darauf zu verlassen, dass der Entwickler diese Logik implementiert.

Was wird unterstützt?

Daher befindet sich Jetpack Compose jetzt in der Alpha-Phase. Was bedeutet das? Nun ja, viele Dinge.

Interoperabilität mit Ansichten

So wie Kotlin vollständig mit Java kompatibel ist, ist Jetpack Compose vollständig mit den Standardansichten von Android kompatibel. Das bedeutet einiges.

Zum einen wird es viel einfacher sein, zu Jetpack Compose zu migrieren, wenn Sie möchten. Anstatt alle Ihre benutzerdefinierten Ansichten und Layouts in Composables konvertieren zu müssen, können Sie Ihre neuen Layouts und Komponenten einfach in Compose erstellen. Sie verfügen über eine Bibliothek, die „alte“ Ansichten verwendet, aber Ihre App wurde mit Compose entwickelt? Kein Problem. Sie können die Ansicht direkt zu Ihrer Composable-Funktion hinzufügen. Sie haben den Sprung zu Compose noch nicht gewagt, möchten aber eine Bibliothek verwenden, die auf Composables basiert? Auch hier kein Problem. Fügen Sie das Composable einfach direkt in Ihr Layout ein.

Was das Theme angeht, ist es nicht ganz so Plug-and-Play wie die Layout-Interoperabilität. Jedoch, Google hat eine Bibliothek erstellt um Ihre Standard-XML-Themen in Compose-kompatible Themen anzupassen und so die Zentralisierung zu gewährleisten und Duplikate zu vermeiden.

Animationen

Hier gibt es nicht wirklich viel zu sagen, außer dass Jetpack Compose Animationen unterstützt, genau wie das View-Framework von Android. Sie können nach Herzenslust verschieben, die Größe ändern und drehen.

Faule Listen

Eine Lazy List ist im Wesentlichen die Compose-Version einer RecyclerView. Elemente werden nur nach Bedarf angeordnet, wodurch RAM gespart und die Leistung gesteigert wird. Da es sich hierbei um Compose handelt, sind Listen natürlich wesentlich einfacher zu implementieren.

ConstraintLayout

Eine der leistungsstärkeren Ansichten in Android ist das ConstraintLayout. Dadurch können Sie untergeordnete Ansichten relativ zueinander positionieren, vergrößern und gewichten und gleichzeitig bestimmte Animationen einfacher gestalten. Wenn Sie Angst hatten, diese Funktionalität in Compose zu verlieren, sollten Sie sich darüber keine Sorgen machen, denn sie ist auch hier vorhanden.

Material-UI-Komponenten

Ein weiterer Satz leistungsstarker Ansichten ist die Material Components-Bibliothek von Google. Das meiste, was hier enthalten ist, sind Standardansichten und -layouts, die Sie im nativen View-Framework finden. Aber sie wurden optimiert oder umschlossen, um zusätzliche Funktionalität bereitzustellen und die Themengestaltung zu vereinfachen, und sie haben auch ihren Weg in Compose gefunden.

Testen

Ein wichtiger Teil der Entwicklung einer App ist das Testen. Bei einer einfachen App können Sie dies manuell tun, indem Sie sie installieren und verwenden. Komplexere Projekte können jedoch stark von automatisierten Test-Frameworks profitieren, die Ihnen den Großteil der harten Arbeit abnehmen. Jetpack Compose unterstützt automatisierte Tests, damit Sie Ihre App so stabil wie möglich machen können.

Barrierefreiheitsfunktionen

Barrierefreiheit ist ein wichtiger Teil unserer Gesellschaft. Ohne Barrierefreiheitsfunktionen in unserer Technologie wären viele Menschen einfach von den Vorteilen ausgeschlossen, die unsere Telefone, Fernseher und alles andere bieten. Jetpack Compose befindet sich noch in der Alpha-Phase, daher ist die Unterstützung für Barrierefreiheit noch nicht vollständig, aber Google berücksichtigt dies bei der Entwicklung und eine rudimentäre Unterstützung ist bereits vorhanden.

Android Studio

Allerdings sind nicht alle Funktionen von Jetpack Compose in Jetpack Compose selbst enthalten. Android Studio und Kotlin verfügen außerdem über Plugins und Erweiterungen zum einfacheren Komponieren.

Kotlin-Compiler-Plugin

Wie bei Kotlin JVM gibt es in Android Studio ein Compiler-Plugin, mit dem Sie Ihre Compose-Funktionen ordnungsgemäß in Code konvertieren können, den Android tatsächlich verstehen und befolgen kann.

Interaktive Vorschauen

Genau wie Ihre Standard-XML-Layouts verfügt Android Studio über eine Layoutvorschau für Jetpack Compose. Obwohl es derzeit in einigen Aspekten nicht ganz so praktisch ist wie die XML-Vorschau, müssen Sie Ihr Projekt dafür erstellen Aktualisieren Sie die Vorschau und erstellen Sie eine spezielle Vorschaufunktion – sie bietet jedoch einen bemerkenswerten Vorteil: Interaktiv Vorschauen.

Eine interaktive Vorschau ist nur eine normale Vorschau, aber interaktiv. Verrückt, ich weiß. Das bedeutet jedoch, dass Sie tatsächlich Text in Textfelder eingeben, auf Schaltflächen klicken und, nun ja, mit Ihren Composables interagieren können, ohne sie überhaupt bereitstellen zu müssen.

Einzelne zusammensetzbare Bereitstellung

Wenn Sie Ihr Layout tatsächlich bereitstellen (d. h. installieren) möchten, um zu sehen, wie es auf einem echten Gerät funktioniert, kann Ihnen diese Funktion hilfreich sein. Um bei normalen XML-Layouts zu sehen, wie ein Layout in der realen Welt funktioniert, müssen Sie die gesamte App erstellen und installieren. Wenn das Layout, das Sie testen möchten, nicht auf dem Hauptbildschirm angezeigt wird, müssen Sie möglicherweise viel tippen, um dorthin zu gelangen.

Und hier kommt die Möglichkeit ins Spiel, nur ein einziges Composable bereitzustellen. Anstatt Ihre App zu erstellen und zu installieren und dann zu dem Layout zu navigieren, das Sie testen, können Sie das Layout einfach bereitstellen. Android Studio generiert und öffnet eine Wrapper-Aktivität, die lediglich das von Ihnen bereitgestellte Composable anzeigt. Dies kann das Testen und Entwerfen erheblich beschleunigen und sogar dazu beitragen, Probleme im Zusammenhang mit der Elementinteraktion zu isolieren.

Code-Vervollständigung

Wenn Ihre IDE keine Code-Vervollständigung bietet, handelt es sich dann überhaupt um eine IDE? Nein. Nein, das ist es nicht. Daher unterstützt Android Studio natürlich die vollständige Code-Vervollständigung für Jetpack Compose.


Das ist zwar nicht alles, was Jetpack Compose bietet, aber die oben genannten Funktionen und Verhaltensweisen zeigen, wie leistungsstark Google dieses Framework haben möchte. Und obwohl es sich noch in der Alpha-Phase befindet, ist es seinem vorherigen „Entwicklungs“-Status einen Schritt voraus. Wenn Sie bisher damit gezögert haben, Jetpack Compose wirklich zu verwenden (wie ich es getan habe), ist es vielleicht an der Zeit, es noch einmal zu versuchen.