Erste Schritte mit Jetpack Compose

Jetpack Compose ist das moderne Toolkit für die Entwicklung von Android-Benutzeroberflächen. Es vereinfacht die Entwicklung von Apps, die sich an jede Displaygröße anpassen.

  • Übersicht: Hier finden Sie die Ressourcen, die Compose-Entwicklern zur Verfügung stehen.
  • Tutorial: Erste Schritte mit Compose – Erstellen einer einfachen Benutzeroberfläche
  • Kurzanleitungen: Mit unseren schnellen und präzisen Anleitungen erreichen Sie Ihr Ziel so schnell wie möglich.

Foundation

  • Denken in Compose: Wie sich der deklarative Ansatz von Compose vom ansichtsbasierten Ansatz unterscheidet, den Sie möglicherweise in der Vergangenheit verwendet haben. Ein mentales Modell für die Arbeit mit Compose erstellen
  • Status verwalten: Status in Ihrer Compose-App festlegen und verwenden.
  • Lebenszyklus von Composables: Lebenszyklus eines Composables und wie Compose bestimmt, ob es neu gezeichnet werden muss.
  • Modifikatoren: Mit Modifikatoren können Sie Ihre Composables erweitern oder gestalten.
  • Nebeneffekte in Compose: Möglichkeiten zum Verwalten von Nebeneffekten.
  • Jetpack Compose-Phasen: Die Schritte, die Compose durchläuft, um die Benutzeroberfläche Ihrer App zu rendern, und wie Sie diese Informationen nutzen können, um effizienten Code zu schreiben.
  • Architektonische Schichtung: Die Architekturschichten, aus denen Jetpack Compose besteht, und die wichtigsten Prinzipien, die das Design von Compose beeinflusst haben.
  • Leistung: Vermeiden Sie die häufigen Programmierfehler, die die App-Leistung beeinträchtigen können.
  • Semantik in Compose: Der Semantikbaum, der Ihre Benutzeroberfläche so organisiert, dass sie von Barrierefreiheitsdiensten und Test-Frameworks verwendet werden kann.
  • Lokal begrenzte Daten mit CompositionLocal: Verwenden Sie CompositionLocal, um Daten durch die Komposition zu übergeben.

Adaptive Benutzeroberfläche

  • Adaptive Apps entwickeln: Hier erfahren Sie die wichtigsten Prinzipien für die Erstellung von Layouts, die für jede Displaygröße optimiert sind, einschließlich Smartphones, Tablets und faltbarer Geräte.
  • Bewährte Layouts verwenden: Verwenden Sie kanonische Layouts wie „Liste – Detail“ und „Unterstützungsbereich“ für optimierte Apps auf großen Bildschirmen.
  • Adaptive Navigation: Implementieren Sie Navigationsmuster, die sich automatisch an den verfügbaren Displaybereich anpassen.

Entwicklungsumgebung

Design

  • Layouts: Layoutkomponenten zusammenstellen und eigene Layouts entwerfen.
    • Layout-Grundlagen: Die Bausteine für eine einfache App-Benutzeroberfläche.
    • Material-Komponenten und -Layouts: Material-Komponenten und -Layouts in Compose.
    • Benutzerdefinierte Layouts: Sie können das Layout Ihrer App selbst bestimmen und ein eigenes benutzerdefiniertes Layout entwerfen.
    • Ausrichtungslinien: Erstellen Sie benutzerdefinierte Ausrichtungshilfen, um UI-Elemente präzise auszurichten und zu positionieren.
    • Intrinsische Messungen: So fragen Sie Informationen zu untergeordneten Elementen ab, bevor Sie sie messen, da Compose UI-Elemente nur einmal pro Durchlauf misst.
    • ConstraintLayout: Verwenden Sie ConstraintLayout in Ihrer Compose-Benutzeroberfläche.
  • Designsysteme: Implementieren Sie ein Designsystem, um Ihrer App ein einheitliches Erscheinungsbild zu verleihen.
  • Listen und Tabellen: Hier finden Sie Compose-Optionen zum Verwalten und Anzeigen von Datenlisten und ‑tabellen.
  • Text: Hauptoptionen in Compose zum Anzeigen und Bearbeiten von Text.
  • Grafiken: Funktionen zum Erstellen und Bearbeiten benutzerdefinierter Grafiken.
  • Animation: Hier können Sie Optionen zum Animieren Ihrer UI-Elemente festlegen.
  • Gesten: Erstellen Sie eine Compose-Benutzeroberfläche, die Nutzergesten erkennt und darauf reagiert.
  • Nutzerinteraktionen verarbeiten: Wie werden Eingaben auf niedriger Ebene in Compose in Interaktionen auf höherer Ebene abstrahiert, damit Sie anpassen können, wie Ihre Komponenten auf Nutzeraktionen reagieren?

Compose einführen

  • View-basierte Apps migrieren: Migrieren Sie Ihre view-basierte App zu Compose.
    • Migrationsstrategie: So führen Sie Compose sicher und schrittweise in Ihren Code ein.
    • Interoperabilitäts-APIs: Mit diesen APIs können Sie Compose mit einer auf Ansichten basierenden Benutzeroberfläche kombinieren.
    • Weitere Hinweise: Design, Architektur, Tests und andere Aspekte, die bei der Migration Ihrer View-basierten App zu Compose berücksichtigt werden sollten.
  • Compose und andere Bibliotheken: Hier erfahren Sie, wie Sie ansichtsbasierte Bibliotheken in Ihren Compose-Inhalten verwenden.
  • Compose-Architektur: Implementieren Sie das unidirektionale Flussmuster in Compose, implementieren Sie Ereignisse und Status-Holder und arbeiten Sie mit ViewModel in Compose.
  • Navigation: Verwenden Sie NavController, um die Navigationskomponente in Ihre Compose-Benutzeroberfläche einzubinden.
  • Ressourcen: Sie können die Ressourcen Ihrer App in Ihrem Compose-Code verwenden.
  • Barrierefreiheit: Berücksichtigen Sie Nutzer mit Anforderungen an die Barrierefreiheit.
  • Testen: Testen Sie Ihren Compose-Code.

Zusätzliche Ressourcen