Utiliser Jetpack Compose sur Android TV

Nous vous recommandons d'utiliser Compose pour la télévision pour créer des interfaces utilisateur Android TV. Elle offre tous les avantages de Jetpack Compose d'Android pour vos applications TV, ce qui facilite grandement la création d'interfaces utilisateur attrayantes et fonctionnelles. Voici quelques avantages spécifiques de l'utilisation de Compose pour la télévision:

  • Flexibilité: Compose permet de créer n'importe quel type d'UI, des mises en page simples aux animations complexes. Les composants sont prêts à l'emploi, mais ils peuvent également être personnalisés et stylisés pour répondre aux besoins de votre application.
  • Développement simplifié et accéléré: Compose est compatible avec le code existant et permet aux développeurs de créer des applications plus efficacement avec moins de code.
  • Intuitif: Compose utilise une syntaxe déclarative qui vous permet de modifier votre interface utilisateur, de déboguer, de comprendre et d'examiner votre code.

Si vous ne savez pas comment utiliser le kit d'outils Jetpack Compose, consultez le parcours Compose. De nombreux principes de développement de Compose pour mobile s'appliquent également à la télévision. Pour en savoir plus sur les avantages généraux d'un framework d'interface utilisateur déclaratif, consultez la section Pourquoi choisir Compose. Pour en savoir plus, consultez également le dépôt d'exemples Compose pour la télévision sur GitHub.

Compatibilité

Compose pour la télévision fonctionne sur Android TV avec le niveau d'API 21 ou supérieur. L'utilisation de la version 1.0 de Compose pour la télévision nécessite la version 1.3.0 des bibliothèques androidx.compose et Kotlin 1.7.10.

Configurer

L'utilisation de Jetpack Compose sur Android TV est semblable à celle de Jetpack Compose pour tout autre projet Android. La principale différence est que Compose pour la télévision ajoute des bibliothèques qui offrent des composants optimisés pour la télévision et facilitent la création d'interfaces utilisateur adaptées à la télévision. Dans certains cas, ces composants portent le même nom que leurs homologues non TV, tels que androidx.tv.material3.Button et androidx.compose.material3.Button.

Dépendances du kit d'outils Jetpack Compose

Pour utiliser Compose pour la télévision, vous devez inclure les dépendances du kit d'outils Jetpack Compose dans le fichier build.gradle de votre application, comme suit:

Kotlin

dependencies {
   val composeBom = platform("androidx.compose:compose-bom:2024.04.01")
   implementation(composeBom)

   // General compose dependencies
   implementation("androidx.activity:activity-compose:1.8.2")

   implementation("androidx.compose.ui:ui-tooling-preview")
   debugImplementation("androidx.compose.ui:ui-tooling")

   // Compose for TV dependencies
   val tvCompose = "1.0.0-alpha10"
   implementation("androidx.tv:tv-foundation:$tvCompose")
   implementation("androidx.tv:tv-material:$tvCompose")
}

Groovy

dependencies {
   def composeBom = platform('androidx.compose:compose-bom:2024.04.01')
   implementation composeBom

   // General compose dependencies
   implementation 'androidx.activity:activity-compose:1.8.2'

   implementation 'androidx.compose.ui:ui-tooling-preview'
   debugImplementation 'androidx.compose.ui:ui-tooling'

   // Compose for TV dependencies
   def tvCompose = '1.0.0-alpha10'
   implementation 'androidx.tv:tv-foundation:$tvCompose'
   implementation 'androidx.tv:tv-material:$tvCompose'
}

Ce qui change

Utilisez la version TV des API dans la mesure du possible. Bien qu'il soit techniquement possible d'utiliser la version mobile de Compose Material, elle n'est pas optimisée pour le style unique des interactions sur Android TV. En outre, la combinaison de Compose Material avec Compose Material à partir de Compose pour la télévision peut entraîner un comportement inattendu. Par exemple, comme chaque bibliothèque possède son propre objet 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 TV et mobile:

Dépendance TV
(androidx.tv.*)
Comparatif Dépendance mobile
(androidx.compose.*)
androidx.tv:tv-material au lieu de androidx.compose.material3:material3
androidx.tv:tv-foundation en plus de androidx.compose.foundation:foundation

Complément d'informations

Parcourez ces guides pour découvrir comment créer des expériences optimisées pour la télévision dans les cas suivants: