Compose for Wear OS ähnelt dem Für Mobilgeräte erstellen Es gibt jedoch einige wesentliche Unterschiede. Dieser Leitfaden werden die Gemeinsamkeiten und Unterschiede erläutert.
Compose for Wear OS ist Teil von Android Jetpack, Bibliotheken, die Sie verwenden, können Sie schneller besseren Code schreiben. Dies ist unser empfohlener Ansatz zum Erstellen von Benutzeroberflächen für Wear OS-Apps.
Wenn Sie mit der Verwendung des Jetpack Compose-Toolkits nicht vertraut sind, sehen Sie sich die Erstellungspfad: Viele der Entwicklungsprinzipien für das Schreiben auf Mobilgeräten die für die Funktion „Compose“ für Wear OS gelten. Weitere Informationen zum Schreiben finden Sie unter Gründe für das Verfassen von Texten. die allgemeinen Vorteile eines deklarativen UI-Frameworks. Weitere Informationen zu „Schreiben“ Informationen zu Wear OS finden Sie in den Beispielen für Compose for Wear OS und Wear OS Repository auf GitHub.
Kompatibilität
Compose for Wear OS funktioniert auf Smartwatches, die Wear OS 3.0 (API-Level 30) unterstützen sowie Smartwatches mit Wear OS 2.0 (API-Level 25 und höher). Mit Für Version 1.0 von Compose für Wear OS ist Version 1.2 der androidx.compose-Bibliotheken und Kotlin 1.7.0.
Plattformen
Mit der Funktion „Compose for Wear OS“ kannst du noch einfacher Apps unter Wear OS erstellen. Weitere Informationen Weitere Informationen finden Sie unter Apps. Verwenden Sie unser integriertes Komponenten für eine Nutzererfahrung schaffen, die den Wear OS-Richtlinien entspricht. Weitere Informationen zu Komponenten finden Sie in unserer Tipps für das Design.
Wird eingerichtet
Die Verwendung von Jetpack Compose mit Wear OS ähnelt der Verwendung von Jetpack Compose für
in anderen Android-Projekten. Der Hauptunterschied ist, dass Jetpack Compose für Wear
Wear-spezifische Bibliotheken hinzufügen, die das Erstellen von Benutzeroberflächen vereinfachen
für Smartwatches. In einigen Fällen tragen diese Komponenten denselben Namen wie
nicht getragenen Artikeln wie
androidx.wear.compose.material.Button
und
androidx.compose.material.Button
Neue App in Android Studio erstellen
So erstellen Sie ein neues Projekt, das Jetpack Compose enthält:
- Wenn Sie sich im Fenster Welcome to Android Studio (Willkommen bei Android Studio) befinden, klicken Sie auf Start a new Android Studio-Projekt Wenn Sie bereits ein Android Studio-Projekt geöffnet haben, wählen Sie Datei > Neu > Import Sample (Beispiel importieren) aus.
- Suche nach Compose for Wear und wähle Compose for Wear OS Starter aus.
- Führen Sie im Fenster Projekt konfigurieren die folgenden Schritte aus:
<ph type="x-smartling-placeholder">
- </ph>
- Legen Sie den Anwendungsnamen fest.
- Wählen Sie den Projektspeicherort für das Beispiel aus.
- Klicken Sie auf Fertig.
- Prüfen Sie, ob die
build.gradle
-Datei des Projekts richtig konfiguriert ist: enthalten, wie unter Gradle properties files beschrieben.
Jetzt kannst du mit der Entwicklung einer App mit Compose für Wear OS beginnen.
Abhängigkeiten des Jetpack Compose-Toolkits
Wenn du Jetpack Compose unter Wear OS verwenden möchtest, musst du Jetpack Compose
Toolkit-Abhängigkeiten in der Datei build.gradle
Ihrer App, wie im
folgendes Snippet:
Kotlin
dependencies { val composeBom = platform("androidx.compose:compose-bom:2024.06.00") // General compose dependencies implementation(composeBom) implementation("androidx.activity:activity-compose:1.9.1") 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 die Methode
WearComposeMaterial
Version von APIs verwenden. Es ist zwar technisch möglich,
mobile Version von „Material verfassen“, ist sie nicht für den speziellen
Anforderungen von Wear OS. Die Kombination von „Compose Material“ und „Compose“
Material für Wear OS kann zu unerwartetem Verhalten führen. Zum Beispiel, weil
jede Bibliothek eine eigene MaterialTheme
-Klasse hat, können Sie
Farben, Typografie oder Formen uneinheitlich sind, wenn beide Versionen verwendet werden.
In der folgenden Tabelle sind die Unterschiede zwischen Wear OS und Mobilgeräte:
Wear OS-Abhängigkeit
(androidx.wear.*) |
Vergleich | Abhängigkeit von Mobilgeräten
(AndroidX.*) |
androidx.wear.compose:compose-material | anstelle von | androidx.compose.material:material |
androidx.wear.compose:compose-navigation | anstelle von | 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
Probiere „Compose“ für Wear OS aus und verwende die Problemverfolgung, um Vorschläge zu machen und Feedback zu geben.
Mach mit: #compose-wear-Kanal auf Kotlin Slack, um mit der Entwickler-Community in Kontakt zu treten und uns Ihre Nutzererfahrung.
Empfehlungen für dich
- Hinweis: Der Linktext wird angezeigt, wenn JavaScript deaktiviert ist.
- Ressourcen in „Compose“
- Material Design 3 in Compose
- Erste Schritte mit Jetpack Compose