Compose per TV è l'approccio moderno per creare interfacce utente di Android TV. Compose per TV sblocca tutti i vantaggi di Jetpack Compose di Android per le tue app TV, rendendo molto più semplice la creazione di UI belle e funzionali per la tua app.
Ecco alcuni vantaggi specifici dell'utilizzo di Compose per la TV:
- Flessibilità: Compose può essere utilizzato per creare qualsiasi tipo di UI, da semplici layout ad animazioni complesse. I componenti sono subito pronti all'uso, ma possono anche essere personalizzati e adattati alle esigenze della tua app.
- Sviluppo semplificato e accelerato: Compose è compatibile con il codice esistente e consente agli sviluppatori di creare app in modo più efficiente con meno codice.
- Intuitivo: Compose utilizza una sintassi dichiarativa che ti consente di apportare modifiche alla UI, eseguire il debug, comprendere e rivedere il codice.
Se non hai dimestichezza con l'utilizzo del toolkit di Jetpack Compose, consulta il percorso di Compose. Molti dei principi di sviluppo per Compose per dispositivi mobili si applicano anche alla TV. Per ulteriori informazioni sui vantaggi generali di un framework di UI dichiarativo, consulta Perché scrivere. Per scoprire di più, consulta anche il repository di esempi di Compose per TV su GitHub.
Compatibilità
Compose per TV funziona su Android TV con Android 5.0 (livello API 21) o versioni successive. L'utilizzo della versione 1.0 di Compose per TV richiede la versione 1.3.0 delle librerie androidx.compose e Kotlin 1.7.10.
Configura
L'utilizzo di Jetpack Compose su Android TV è simile all'utilizzo di Jetpack Compose per
qualsiasi altro progetto Android. La differenza principale è che Compose per TV aggiunge librerie che offrono componenti ottimizzati per la TV e semplifica la creazione di interfacce utente su misura per la TV. In alcuni casi, questi componenti hanno lo stesso
nome delle controparti non TV, ad esempio
androidx.tv.material3.Button
e
androidx.compose.material3.Button.
Dipendenze del toolkit di Jetpack Compose
Per utilizzare Compose per la TV, includi le dipendenze del toolkit di Jetpack Compose
nel file build.gradle della tua app come segue:
Kotlin
dependencies {
val composeBom = platform("androidx.compose:compose-bom:2024.06.00")
implementation(composeBom)
// General compose dependencies.
implementation("androidx.activity:activity-compose:1.9.0")
implementation("androidx.compose.ui:ui-tooling-preview")
debugImplementation("androidx.compose.ui:ui-tooling")
// Compose for TV dependencies.
implementation("androidx.tv:tv-foundation:1.0.0-alpha10")
implementation("androidx.tv:tv-material:1.0.0-beta01")
}
Alla moda
dependencies {
def composeBom = platform('androidx.compose:compose-bom:2024.06.00')
implementation composeBom
// General compose dependencies.
implementation 'androidx.activity:activity-compose:1.9.0'
implementation 'androidx.compose.ui:ui-tooling-preview'
debugImplementation 'androidx.compose.ui:ui-tooling'
// Compose for TV dependencies.
implementation 'androidx.tv:tv-foundation:1.0.0-alpha10'
implementation 'androidx.tv:tv-material:1.0.0-beta01'
}
Differenze
Se possibile, utilizza la versione TV delle API.
Sebbene sia tecnicamente possibile utilizzare la versione mobile di Compose Material,
non è ottimizzata per lo stile unico delle interazioni su Android TV. Inoltre, il mix di Compose Material con Compose Material di
Compose per TV può causare comportamenti imprevisti. Ad esempio,
poiché ogni libreria ha il proprio oggetto MaterialTheme, se vengono utilizzate entrambe le versioni, esiste la possibilità che
colori, forme o elementi tipografici non siano coerenti.
La seguente tabella illustra le differenze di dipendenza tra TV e dispositivo mobile:
| Dipendenza TV (androidx.tv.*) |
Confronto | Dipendenza da dispositivi mobili (androidx.compose.*) |
|---|---|---|
| androidx.tv:materiale-tv | invece di | androidx.compose.material3:material3 |
| androidx.tv:fondazione-tv | oltre a | androidx.compose.foundation:foundation |
Risorse aggiuntive
Esempio di TV Material Catalog
Un'app di catalogo che mostra come implementare i principi di Material Design utilizzando Compose per la TV.Esempio di JetStream
Un'app di streaming multimediale che dimostra l'utilizzo di TV Compose con una tipica app Material e un'architettura reale.Introduzione a Compose per la TV
Questo codelab illustra la creazione di un'app per video player con una schermata di browser per catalogo e una schermata dei dettagli.
Continua a leggere
Esplora queste guide per scoprire come creare esperienze ottimizzate per la TV in modo da: