Iniziare a utilizzare l'interfaccia utente basata su Compose

Aggiungi la dipendenza

La libreria Media3 include due moduli UI basati su Jetpack Compose. Non devi aggiungerli entrambi perché quello Material3 dipende da quello principale.

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"

Ti consigliamo vivamente di sviluppare la tua app in modo da dare la priorità a Compose o di eseguire la migrazione dall'utilizzo di View.

App demo Fully Compose

Sebbene la libreria media3-ui-compose non includa composable predefiniti (come pulsanti, indicatori, immagini o dialoghi), puoi trovare un'app demo scritta interamente in Compose che evita qualsiasi soluzione di interoperabilità come il wrapping di PlayerView in AndroidView. L'app demo utilizza le classi di gestione dello stato dell'interfaccia utente del modulo media3-ui-compose e si avvale della libreria Compose Material3.

Di quale libreria ho bisogno?

A seconda del livello di personalizzazione richiesto, puoi scegliere tra due librerie Media3 Compose. Per capire la differenza, è utile pensare alla pipeline di produzione dello stato dell'interfaccia utente: Business logic → UI logic → UI.

Utilizza media3-ui-compose per controllare completamente i componenti dell'interfaccia utente.

Questa libreria fornisce la connessione Business logic → UI logic. Contiene componenti di base come PlayerSurface e ContentFrame, insieme a classi di detentori di stato (ad es. PlayPauseButtonState) che convertono lo stato Player nello stato UI.

Questa libreria non fornisce componenti Material Design pronti all'uso. Sei responsabile della creazione e dello stile dei tuoi componenti UI. Ti offre il massimo controllo sull'aspetto, il che lo rende ideale se hai un sistema di progettazione altamente personalizzato.

Utilizza media3-ui-compose-material3 per un'integrazione più rapida con Material Design.

Questa libreria fornisce la parte finale UI della pipeline. Dipende da media3-ui-compose e include funzioni componibili predefinite con stile con componenti Material 3. Elimina la necessità di creare da zero pulsanti e altri elementi dell'interfaccia utente. Puoi comunque personalizzare il tema, i colori e le icone di questi componenti, ma l'implementazione di base viene fornita per te.

Riepilogo

Funzionalità media3-ui-compose media3-ui-compose-material3
Componenti UI Elementi di base come PlayerSurface e ContentFrame, ma nessun pulsante o controllo predefinito. Fornisce un set completo di Composables predefiniti in stile Material 3, come PlayPauseButton, SeekBackButton, PositionAndDurationText e così via.
Gestione dello stato Fornisce i titolari di remember...State per gestire la logica. Gestisce lo stato internamente, ma puoi comunque accedere ai titolari dello stato, se necessario.
Dipendenze androidx.compose.foundation media3-ui-compose, androidx.compose.material3 e com.google.android.material
Caso d'uso principale Creazione di un'interfaccia utente del player con un sistema di progettazione personalizzato. Controllo completo dell'aspetto. Creare rapidamente un'interfaccia utente del player che rispetti le linee guida di Material Design 3.