Cómo comenzar a usar la IU basada en Compose

Agrega la dependencia

La biblioteca de Media3 incluye dos módulos de IU basados en Jetpack Compose. No es necesario que agregues ambos, ya que el de Material3 depende del principal.

Kotlin

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

Groovy

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

Te recomendamos que desarrolles tu app con Compose como prioridad o que migres desde el uso de Views.

App de demostración completamente en Compose

Si bien la biblioteca media3-ui-compose no incluye elementos Composables listos para usar (como botones, indicadores, imágenes o diálogos), puedes encontrar una app de demostración escrita completamente en Compose que evita cualquier solución de interoperabilidad, como envolver PlayerView en AndroidView. La app de demostración utiliza las clases de titulares del estado de la IU del módulo media3-ui-compose y usa la biblioteca Compose Material3.

¿Qué biblioteca necesito?

Según el nivel de personalización que necesites, puedes elegir entre dos bibliotecas de Media3 Compose. Para comprender la diferencia, es útil pensar en la canalización de producción del estado de la IU: Business logic → UI logic → UI.

Usa media3-ui-compose para tener control total sobre tus componentes de la IU.

Esta biblioteca proporciona la conexión Business logic → UI logic. Contiene componentes fundamentales, como PlayerSurface y ContentFrame, junto con clases de titulares de estado (p.ej., PlayPauseButtonState) que convierten el estado de Player en estado de la IU.

Esta biblioteca no proporciona componentes de Material Design listos para usar. Eres responsable de crear tus propios componentes de IU y darles estilo. Te brinda el máximo control sobre la apariencia, lo que lo hace ideal si tienes un sistema de diseño muy personalizado.

Usa media3-ui-compose-material3 para una integración más rápida con Material Design.

Esta biblioteca proporciona la parte final UI de la canalización. Depende de media3-ui-compose y contiene funciones de componibilidad prediseñadas con el estilo de los componentes de Material 3. Elimina la necesidad de que crees tus propios botones y otros elementos de la IU desde cero. Aun así, puedes personalizar el tema, los colores y los íconos de estos componentes, pero la implementación principal se proporciona para ti.

De un vistazo

Función media3-ui-compose media3-ui-compose-material3
Componentes de la IU Elementos básicos, como PlayerSurface y ContentFrame, pero sin botones ni controles prediseñados Proporciona un conjunto completo de Composables prediseñados con el estilo de Material3, como PlayPauseButton, SeekBackButton, PositionAndDurationText, etcétera.
Administración del estado Proporciona titulares de remember...State para administrar la lógica. Administra el estado de forma interna, pero aún puedes acceder a los titulares del estado si lo necesitas.
Dependencias androidx.compose.foundation media3-ui-compose, androidx.compose.material3, com.google.android.material
Caso de uso principal Compilación de una IU de reproductor con un sistema de diseño personalizado Control total sobre la apariencia. Compilar rápidamente una IU del reproductor que siga los lineamientos de Material Design 3