Usar o Jetpack Compose no Android TV

O Compose para TV é a abordagem moderna para a criação de interfaces do usuário do Android TV. O Compose para TV oferece todos os benefícios do Jetpack Compose do Android para seus apps de TV, facilitando muito a criação de interfaces bonitas e funcionais para seu app.

Confira alguns benefícios específicos do uso do Compose para TV:

  • Flexibilidade: o Compose pode ser usado para criar qualquer tipo de interface, desde layouts simples a animações complexas. Os componentes funcionam imediatamente, mas também podem ser personalizados e estilizados para atender às necessidades do seu app.
  • Desenvolvimento simplificado e acelerado: o Compose é compatível com o código já existente e permite que os desenvolvedores criem apps de forma mais eficiente com menos código.
  • Intuitivo: o Compose usa uma sintaxe declarativa que permite fazer mudanças na interface, depurar, entender e revisar o código.

Se você não sabe usar o kit de ferramentas do Jetpack Compose, confira o Programa de treinamentos do Compose. Muitos dos princípios de desenvolvimento do Compose para dispositivos móveis também se aplicam à TV. Consulte Por que usar o Compose para mais informações sobre as vantagens gerais de usar um framework de interface declarativa. Para saber mais, consulte também o repositório de exemplos do Compose para TV no GitHub (link em inglês).

Compatibilidade

O Compose para TV funciona em Android TVs com o Android 5.0 (nível 21 da API) ou versões mais recentes. O uso da versão 1.0 do Compose para TV requer a versão 1.3.0 das bibliotecas androidx.compose e o Kotlin 1.7.10.

Configurar

O uso do Jetpack Compose no Android TV é semelhante ao uso do Jetpack Compose para qualquer outro projeto Android. A principal diferença é que o Compose para TV adiciona bibliotecas que oferecem componentes otimizados para TV e facilitam a criação de interfaces do usuário adaptadas para TV. Em alguns casos, esses componentes compartilham o mesmo nome que os que não são da TV, como androidx.tv.material3.Button e androidx.compose.material3.Button.

Dependências do kit de ferramentas do Jetpack Compose

Para usar o Compose para TV, inclua as dependências do kit de ferramentas do Jetpack Compose no arquivo build.gradle do app da seguinte maneira:

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")
}

Groovy

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'
}

O que mudou?

Use a versão para TV das APIs sempre que possível. Embora seja tecnicamente possível usar a versão para dispositivos móveis do Compose Material, ela não está otimizada para o estilo exclusivo de interações no Android TV. Além disso, misturar o Compose Material com o Compose Material do Compose para TV pode resultar em um comportamento inesperado. Por exemplo, como cada biblioteca tem o próprio objeto MaterialTheme, é possível que cores, tipografias ou formas sejam inconsistentes se as duas versões forem usadas.

A tabela a seguir descreve as diferenças de dependência entre TV e dispositivos móveis:

Dependência de TV
(androidx.tv.*)
Comparação Dependência de dispositivos móveis
(androidx.compose.*)
androidx.tv:tv-material (em inglês) em vez de androidx.compose.material3:material3
androidx.tv:tv-foundation (link em inglês) além de androidx.compose.foundation:foundation

Outros recursos

Leia mais

Consulte estes guias para saber como criar ótimas experiências otimizadas para TV nos seguintes produtos: