Esta seção descreve como a navegação pelo conteúdo funciona em apps de mídia, incluindo como os usuários navegam para visualizações de nível inferior com mais detalhes.
O processo de procurar conteúdo em um app de mídia envolve:
- Como visualizar grades ou listas de conteúdo
- Selecionar itens de conteúdo navegáveis (ou seja, itens que representam uma coleção de itens, em vez de serem reproduzíveis) para navegar para visualizações mais detalhadas desses itens
A visualização detalhada de um item de conteúdo existe em um nível inferior do espaço do conteúdo, também formatada como grade ou lista. Os usuários podem navegar para os níveis inferiores usando uma funcionalidade de retorno no cabeçalho do app.
Visualizações de conteúdo em grade e lista
O conteúdo de mídia pode ser apresentado em grade, lista ou uma combinação de ambos no mesmo espaço de conteúdo. O conteúdo pode ser organizado em categorias separadas por subcabeçalhos. Os usuários navegam pelas grades ou listas rolando verticalmente.
![](https://developers.google.cn/cars/design/automotive-os/apps/media/interaction-model/images/secondarynav-1.png?authuser=0&hl=pt-br)
Navegação para os níveis com mais detalhes
Conforme os usuários navegam no espaço de conteúdo, eles podem selecionar um item de conteúdo navegável (como um álbum ou uma playlist) para navegar para uma visualização mais detalhada desse item (músicas do álbum ou itens individuais na playlist). Quando um usuário começa a se aprofundar no espaço do conteúdo dessa forma, um cabeçalho de aplicativo é exibido na parte superior da tela, incluindo uma funcionalidade que permite ao usuário retornar ao nível anterior.
![](https://developers.google.cn/cars/design/automotive-os/apps/media/interaction-model/images/spec-app-header-switch.gif?authuser=0&hl=pt-br)
À medida que os usuários rolam por uma grade ou lista de conteúdo, uma barra de apps (ou cabeçalho) na parte de cima da tela permanece fixa no lugar, com o conteúdo rolando atrás dela.
![](https://developers.google.cn/cars/design/automotive-os/apps/media/interaction-model/images/scrolling.gif?authuser=0&hl=pt-br)