Criar uma tela de detalhes

Muitos apps de TV incluem páginas de detalhes do conteúdo com metadados relevantes para um determinado conteúdo (ou seja, um filme específico). As páginas de detalhes podem ser implementadas como uma função combinável, usando os metadados do conteúdo selecionado como argumento.

O código a seguir é uma implementação típica da tela de detalhes. Ele carrega uma imagem do filme fornecido com o título e a descrição. O usuário pode fazer uma transição de tela para a tela do player, que pode ser acionada clicando em um botão para iniciar a reprodução do filme. É possível processar essa ação para fazer a transição da tela definindo uma função de callback.

@Composable
fun DetailsScreen(
  movie: Movie,
  modifier: Modifier = Modifier,
  onStartPlayback: (Movie) -> Unit = {}
) {
  Box(modifier = modifier.fillMaxSize()){
     AsyncImage(
       modifier = Modifier.fillMaxSize()
       model = movie.image,
       contentDescription = null,
       contentScale = ContentScale.Crop,
     )
     Column(modifier = Modifier.padding(32.dp)){
       Text(
         text = movie.title,
         style = MaterialTheme.typeography.heading2
       )
       Text(text = movie.description)
       Button(onClick = { onStartPlayBack(movie) }){
         Text(text = R.string.startPlayback)
       }
     }
  }
}