Compose pour Wear OS est semblable à Compose pour mobile. Il existe toutefois quelques différences importantes. Ce guide décrit les similitudes et les différences.
Compose pour Wear OS fait partie d'Android Jetpack et, comme les autres bibliothèques Wear Jetpack que vous utilisez, elle vous permet d'écrire plus rapidement un meilleur code. Nous vous recommandons d'adopter cette approche pour créer des UI pour les applications Wear OS.
Si vous ne savez pas comment utiliser le kit d'outils Jetpack Compose, consultez le parcours Compose. De nombreux principes de développement concernant Compose pour mobile s'appliquent à Compose pour Wear OS. Pour en savoir plus sur les avantages généraux d'un framework d'interface utilisateur déclaratif, consultez la section Pourquoi adopter Compose. Pour en savoir plus sur Compose pour Wear OS, consultez le parcours Compose pour Wear OS et le dépôt d'exemples Wear OS sur GitHub.
Wear OS.Material Design dans Jetpack Compose sur Wear OS
Jetpack Compose sur Wear OS propose une implémentation de Material 2.5, qui vous aide à concevoir des expériences d'application plus attrayantes. Les composants Material Design sur Wear OS sont basés sur la thématisation Material Wear. Cette thématisation est un moyen systématique de personnaliser Material Design et de mieux refléter la marque de votre produit.
Compatibilité
Compose pour Wear OS fonctionne sur les montres compatibles avec Wear OS 3.0 (API de niveau 30) et les montres qui utilisent Wear OS 2.0 (API de niveau 25 ou supérieur). Pour utiliser la version 1.4 de Compose pour Wear OS, vous devez utiliser la version 1.7 des bibliothèques androidx.compose et Kotlin 1.9.0. Vous pouvez utiliser le mappage de la nomenclature et la carte de compatibilité entre Compose et Kotlin pour vérifier la compatibilité de Compose.
Surfaces
Compose pour Wear OS facilite la création d'applications sur Wear OS. Pour en savoir plus, consultez la section Applications. Utilisez nos composants intégrés pour créer des expériences utilisateur conformes aux consignes Wear OS. Pour en savoir plus sur ces composants, consultez nos conseils de conception.
Configuration
L'utilisation de Jetpack Compose avec Wear OS est semblable à celle de Jetpack Compose pour tout autre projet Android. La principale différence est que Jetpack Compose pour Wear ajoute des bibliothèques spécifiques à Wear qui facilitent la création d'interfaces utilisateur adaptées aux montres. Dans certains cas, ces composants portent le même nom que leurs homologues non-Wear, tels que androidx.wear.compose.material.Button
et androidx.compose.material.Button
.
Créer une application dans Android Studio
Pour inclure Jetpack Compose lors de la création de votre projet, procédez comme suit :
- Dans la fenêtre Welcome to Android Studio (Bienvenue dans Android Studio), cliquez sur Start a new Android Studio project (Démarrer un nouveau projet Android Studio). Si vous avez déjà ouvert un projet Android Studio, sélectionnez File > New > Import Sample (Fichier > Nouveau > Importer un exemple) dans la barre de menu.
- Recherchez Compose for Wear (Compose pour Wear) et sélectionnez Compose for Wear OS Starter (Démarrage avec Compose pour Wear OS).
- Dans la fenêtre Configure your project (Configurer votre projet), procédez comme suit :
- Définissez l'Application name (Nom de l'application).
- Choisissez le Project location (Emplacement du projet) pour votre exemple.
- Cliquez sur Finish (Terminer).
- Vérifiez que le fichier
build.gradle
du projet est correctement configuré, comme décrit dans la section Fichiers de propriétés Gradle.
Vous êtes maintenant prêt à développer une application à l'aide de Compose pour Wear OS.
Dépendances du kit d'outils Jetpack Compose
Pour utiliser Jetpack Compose avec Wear OS, vous devez inclure les dépendances du kit d'outils Jetpack Compose dans le fichier build.gradle
de votre application. La plupart des modifications de dépendances liées à Wear OS se trouvent dans les couches d'architecture supérieures, entourées d'un cadre rouge dans l'image suivante.
<img 'foundation',="" 'material',="" 'runtime'.="" 'ui',="" 2="" 4="" a="" alt="" and="" are="" bottom,="" box""="" by="" contain="" from="" rectangles="" rectangles.="" red="" src="/static/wear/images/components/ComposeDependencies.png" surrounded="" the="" to="" top="" />
Autrement dit, bon nombre des dépendances que vous utilisez déjà avec Jetpack Compose ne changeront pas pour Wear OS. Par exemple, les dépendances de l'UI, de l'environnement d'exécution, du compilateur et des animations restent les mêmes.
Cependant, Wear OS possède ses propres versions des bibliothèques material
, foundation
et navigation
. Assurez-vous donc d'utiliser les bibliothèques appropriées.
Utilisez la version d'API WearComposeMaterial
lorsque cela est possible. Bien qu'il soit techniquement possible d'utiliser la version mobile de Compose Material, elle n'est pas optimisée pour les exigences spéciales de Wear OS. Par ailleurs, la combinaison de Compose et de Compose pour Wear OS peut entraîner un comportement inattendu. Par exemple, comme chaque bibliothèque possède sa propre classe MaterialTheme
, il est possible que les couleurs, la typographie ou les formes soient incohérentes si les deux versions sont utilisées.
Le tableau suivant décrit les différences de dépendance entre Wear OS et Wear pour Mobile :
Dépendance Wear OS
(androidx.wear.*) |
Comparatif | Dépendance mobile
(androidx.*) |
androidx.wear.compose:compose-material | au lieu de | androidx.compose.material:material |
androidx.wear.compose:compose-navigation | au lieu de | androidx.navigation:navigation-compose |
androidx.wear.compose:compose-foundation | en plus de | androidx.compose.foundation:foundation |
L'extrait de code suivant montre un exemple de fichier build.gradle
qui inclut les dépendances suivantes:
Kotlin
dependencies { val composeBom = platform("androidx.compose:compose-bom:2024.10.01") // General compose dependencies implementation(composeBom) implementation("androidx.activity:activity-compose:1.9.3") implementation("androidx.compose.ui:ui-tooling-preview:1.7.5") // Other compose dependencies // Compose for Wear OS Dependencies implementation("androidx.wear.compose:compose-material:1.4.0") // Foundation is additive, so you can use the mobile version in your Wear OS app. implementation("androidx.wear.compose:compose-foundation:1.4.0") // Wear OS preview annotations implementation("androidx.wear.compose:compose-ui-tooling:1.4.0") // 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.4.0") // 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") }
Commentaires
Essayez Compose pour Wear OS et utilisez l'Issue Tracker pour envoyer des suggestions et des commentaires.
Rejoignez la chaîne #compose-wear sur le Slack de Kotlin pour échanger avec la communauté des développeurs et nous faire part de votre expérience.
Recommandations personnalisées
- Remarque : Le texte du lien s'affiche lorsque JavaScript est désactivé
- Ressources disponibles dans Compose
- Material Design 3 dans Compose
- Premiers pas avec Jetpack Compose