Premiers pas avec l'UI basée sur Compose

Ajouter la dépendance

La bibliothèque Media3 inclut deux modules d'interface utilisateur basés sur Jetpack Compose. Vous n'avez pas besoin d'ajouter les deux, car le module Material3 dépend du module principal.

Kotlin

// Include only one of the following dependencies
implementation("androidx.media3:media3-ui-compose:1.10.1")
implementation("androidx.media3:media3-ui-compose-material3:1.10.1")

Groovy

// Include only one of the following dependencies
implementation "androidx.media3:media3-ui-compose:1.10.1"
implementation "androidx.media3:media3-ui-compose-material3:1.10.1"

Nous vous encourageons vivement à développer votre application en utilisant Compose en priorité ou à migrer depuis l'utilisation de vues.

Application de démonstration entièrement Compose

Bien que la bibliothèque media3-ui-compose n'inclue pas de composables prêts à l'emploi (tels que des boutons, des indicateurs, des images ou des boîtes de dialogue), vous pouvez trouver une application de démonstration entièrement écrite en Compose qui évite toute solution d'interopérabilité, comme l'encapsulation de PlayerView dans AndroidView. L'application de démonstration utilise les classes de conteneur d'état de l'interface utilisateur du module media3-ui-compose et la bibliothèque Compose Material3.

De quelle bibliothèque ai-je besoin ?

Selon le niveau de personnalisation dont vous avez besoin, vous pouvez choisir entre deux bibliothèques Media3 Compose. Pour comprendre la différence, il est utile de réfléchir à la chaîne de production d'état de l'interface utilisateur : Business logic → UI logic → UI.

Utilisez media3-ui-compose pour contrôler entièrement vos composants d'interface utilisateur.

Cette bibliothèque fournit la connexion Business logic → UI logic. Elle contient des composants de base tels que PlayerSurface et ContentFrame, ainsi que des classes de conteneur d'état (par exemple, PlayPauseButtonState, CurrentMediaItemState, PlaylistState, ErrorState) qui convertissent l'état Player en état d'interface utilisateur.

Cette bibliothèque ne fournit pas de composants Material Design prêts à l'emploi. Vous êtes responsable de la création de vos propres composants d'interface utilisateur et de leur style. Elle vous offre un contrôle maximal sur l'apparence, ce qui est idéal si vous disposez d'un système de conception hautement personnalisé.

Utilisez media3-ui-compose-material3 pour une intégration plus rapide à Material Design.

Cette bibliothèque fournit la partie UI finale du pipeline. Elle dépend de media3-ui-compose et inclut des fonctions composables prédéfinies dont le style est défini avec des composants Material3, y compris les composables Player et MiniController. Le composable Player offre une expérience de lecture multimédia complète avec une vidéo, des commandes et une barre de progression, que vous pouvez personnaliser davantage à l'aide de PlayerDefaults. Le MiniController composable fournit une fonctionnalité compacte pour contrôler le lecteur tout en affichant des informations sur l' élément multimédia actuel. Vous n'avez donc pas besoin de créer vos propres boutons et autres éléments d'interface utilisateur à partir de zéro. Vous pouvez toujours personnaliser le thème, les couleurs et les icônes de ces composants, mais l'implémentation de base vous est fournie.

En bref

Fonctionnalité media3-ui-compose media3-ui-compose-material3
Composants d'interface utilisateur Éléments de base tels que PlayerSurface et ContentFrame, mais aucun bouton ni commande préstylisés. Fournit les composables Player et MiniController, ainsi qu'un ensemble complet de composables prédéfinis de style Material3 tels que PlayPauseButton, SeekBackButton, PositionAndDurationText, ErrorText, etc.
Gestion des états Fournit des conteneurs remember...State pour gérer la logique. Gère l'état en interne, mais vous pouvez toujours accéder aux conteneurs d'état si nécessaire.
Dépendances androidx.compose.foundation media3-ui-compose, androidx.compose.material3, com.google.android.material
Cas d'utilisation principal Création d'une interface utilisateur de lecteur avec un système de conception personnalisé. Contrôle total sur l'apparence. Création rapide d'une interface utilisateur de lecteur conforme aux directives Material Design 3.