Jetpack Compose unter Wear OS verwenden

Compose für Wear OS ähnelt der Composer-App für Mobilgeräte. Es gibt jedoch einige wichtige Unterschiede. In diesem Leitfaden werden die Gemeinsamkeiten und Unterschiede erläutert.

Compose für Wear OS ist Teil von Android Jetpack. Wie die anderen Wear Jetpack-Bibliotheken, die Sie verwenden, können Sie damit schneller besseren Code schreiben. Dies ist unser empfohlener Ansatz zum Erstellen von Benutzeroberflächen für Wear OS-Apps.

Wenn Sie mit dem Jetpack Compose-Toolkit nicht vertraut sind, lesen Sie den Compose-Pfad. Viele der Prinzipien für die Entwicklung von Compose auf Mobilgeräten gelten auch für Compose für Wear OS. Weitere Informationen zu den allgemeinen Vorteilen eines deklarativen UI-Frameworks finden Sie unter Gründe für das Schreiben. Weitere Informationen zu Compose für Wear OS findest du im Compose for Wear OS-Pfad und im Wear OS-Beispiel-Repository auf GitHub.

Kompatibilität

Compose für Wear OS funktioniert auf Smartwatches, die Wear OS 3.0 (API-Level 30) unterstützen sowie auf Smartwatches mit Wear OS 2.0 (API-Level 25 und höher). Für Version 1.0 von Compose für Wear OS sind Version 1.2 der androidx.compose-Bibliotheken und Kotlin 1.7.0 erforderlich.

Plattformen

Mit Compose für Wear OS wird das Erstellen von Apps unter Wear OS einfacher. Weitere Informationen finden Sie unter Apps. Mit unseren integrierten Komponenten kannst du eine Umgebung schaffen, die den Wear OS-Richtlinien entspricht. Weitere Informationen zu Komponenten finden Sie in unseren Designleitfäden.

Wird eingerichtet

Die Verwendung von Jetpack Compose mit Wear OS ähnelt der Verwendung von Jetpack Compose für jedes andere Android-Projekt. Der Hauptunterschied besteht darin, dass Jetpack Compose for Wear Wear-spezifische Bibliotheken hinzufügt, die die Erstellung von auf Smartwatches zugeschnittenen Benutzeroberflächen vereinfachen. In einigen Fällen haben diese Komponenten denselben Namen wie die anderen Komponenten, die keine Wearables tragen, z. B. androidx.wear.compose.material.Button und androidx.compose.material.Button.

Neue App in Android Studio erstellen

Gehen Sie wie folgt vor, um ein neues Projekt zu erstellen, das Jetpack Compose enthält:

  1. Wenn das Fenster Willkommen bei Android Studio angezeigt wird, klicken Sie auf Neues Android Studio-Projekt starten. Wenn Sie bereits ein Android Studio-Projekt geöffnet haben, wählen Sie in der Menüleiste File > New > Import Sample (Datei > Neu > Beispiel importieren) aus.
  2. Suchen Sie nach Compose for Wear und wählen Sie Compose for Wear OS Starter aus.
  3. Führen Sie im Fenster Projekt konfigurieren die folgenden Schritte aus:
    1. Legen Sie den Namen der Anwendung fest.
    2. Wählen Sie den Projektspeicherort für Ihr Beispiel aus.
  4. Klicken Sie auf Fertig.
  5. Prüfen Sie, ob die Datei build.gradle des Projekts richtig konfiguriert ist, wie unter Gradle-Attributdateien beschrieben.

Jetzt können Sie mit Compose für Wear OS eine App entwickeln.

Abhängigkeiten des Jetpack Compose-Toolkits

Wenn Sie Jetpack Compose mit Wear OS verwenden möchten, müssen Sie die Abhängigkeiten des Jetpack Compose-Toolkits in die Datei build.gradle Ihrer App aufnehmen, wie im folgenden Snippet gezeigt:

Kotlin

dependencies {

    val composeBom = platform("androidx.compose:compose-bom:2024.05.00")

    // General compose dependencies
    implementation(composeBom)
    implementation("androidx.activity:activity-compose:1.9.0")
    implementation("androidx.compose.ui:ui-tooling-preview:1.6.8")
    // Other compose dependencies

    // Compose for Wear OS Dependencies
    implementation("androidx.wear.compose:compose-material:1.3.1")

    // Foundation is additive, so you can use the mobile version in your Wear OS app.
    implementation("androidx.wear.compose:compose-foundation:1.3.1")

    // Wear OS preview annotations
    implementation("androidx.wear.compose:compose-ui-tooling:1.3.1")

    // If you are using Compose Navigation, use the Wear OS version (NOT THE MOBILE VERSION).
    // Uncomment the line below and update the version number.
    // implementation("androidx.wear.compose:compose-navigation:1.3.1")

    // Testing
    testImplementation("junit:junit:4.13.2")
    androidTestImplementation("androidx.test.ext:junit:1.1.3")
    androidTestImplementation("androidx.test.espresso:espresso-core:3.4.0")
    androidTestImplementation("androidx.compose.ui:ui-test-junit4:1.0.3")
    debugImplementation("androidx.compose.ui:ui-tooling:1.0.3")
}

Was ist anders?

Verwenden Sie nach Möglichkeit die API-Version WearComposeMaterial. Es ist zwar technisch möglich, die mobile Version von Compose Material zu verwenden, sie ist jedoch nicht für die besonderen Anforderungen von Wear OS optimiert. Wenn Sie Compose Material mit Compose Material für Wear OS kombinieren, kann das außerdem zu unerwartetem Verhalten führen. Da jede Bibliothek eine eigene MaterialTheme-Klasse hat, besteht beispielsweise die Möglichkeit, dass Farben, Typografie oder Formen uneinheitlich sind, wenn beide Versionen verwendet werden.

In der folgenden Tabelle sind die Abhängigkeitsunterschiede zwischen Wear OS und Mobilgeräten aufgeführt:

Wear OS-Abhängigkeit

(androidx.wear.*)

Vergleich Abhängig von Mobilgeräten

(androidx.*)

androidx.wear.compose:compose-material anstatt androidx.compose.material:material
androidx.wear.compose:compose-navigation anstatt androidx.navigation:navigation-compose
androidx.wear.compose:compose-foundation zusätzlich zu androidx.compose.foundation:foundation

Hier ist eine Beispieldatei für build.gradle:

// Example project in app/build.gradle file
dependencies {
    // Standard Compose dependencies...

    // Wear specific Compose Dependencies
    implementation "androidx.wear.compose:compose-material:$rootProject.wearVersion"
    implementation "androidx.wear.compose:compose-foundation:$rootProject.wearVersion"

    // For navigation within your app...
    implementation "androidx.wear.compose:compose-navigation:$rootProject.wearVersion"

    // Other dependencies...
}

Feedback

Testen Sie Compose für Wear OS und nutzen Sie den Issue Tracker, um Vorschläge und Feedback zu geben.

Treten Sie dem #compose-wear-Kanal auf Kotlin bei Slack bei, um sich mit der Entwickler-Community auszutauschen und uns Ihre Erfahrungen mitzuteilen.