Opções de tela

Mantenha tudo organizado com as coleções Salve e categorize o conteúdo com base nas suas preferências.

Depois de entender como processar diferentes formatos de smartwatch, decida qual tipo de sobreposição você quer usar.

A lista a seguir descreve os tipos de tela de sobreposição. Caso precise de várias telas, você pode usar mais de uma opção.

  • Tela única (mais simples): os elementos da IU são limitados ao que é visualizado em uma só tela, sem rolagem.
  • Contêiner vertical (mais comum): há mais conteúdo, além do que é visualizado no momento, que pode ser acessado ao rolar a tela.
  • Outras opções: listas, paginação ou movimentos 2D.

Observação: o tipo de sobreposição da atividade precisa ser herdado de uma ComponentActivity ou FragmentActivity (se estiver usando fragmentos). Os outros tipos de atividade usam elementos de IU específicos para dispositivos móveis, que não são necessários para o Wear OS.

Tela única

O usuário vê todos os elementos em uma única visualização, sem precisar rolar a tela. Isso significa que é possível incluir poucos elementos.

Figura 1. Exemplos de tela única.

As telas únicas funcionam bem com um BoxInsetLayout combinado a um ConstraintLayout para posicionar os elementos.

O BoxInsetLayout é um widget da IU do Wear OS que permite definir um único layout que funcione para telas quadradas, retangulares e redondas. Essa classe aplica os encartes de janela necessários, dependendo do formato do dispositivo, e permite alinhar facilmente as visualizações no centro da tela. No entanto, se você não vê problemas em criar layouts separados para aproveitar melhor o espaço de cada formato de tela, use layout-round e layout-notround. Para saber mais, consulte Usar layouts diferentes para telas quadradas e redondas.

Contêiner vertical

O contêiner vertical é o tipo mais comum de sobreposição. Ele adiciona outros conteúdos que não estão visíveis na tela, mas podem ser acessados por rolagem.

As imagens a seguir mostram vários exemplos de sobreposições completas, sendo que apenas uma parte do conteúdo ficaria visível em um smartwatch de tela redonda. O conteúdo principal fica na parte de cima do contêiner. Nos exemplos, as demais jornadas ideais do usuário (CUJs, na sigla em inglês) e configurações ficam na parte de baixo.

Diferentemente do que ocorre no caso de uma única sobreposição de tela, não use BoxInsetLayout. Em vez disso, coloque um ConstraintLayout dentro de uma NestedScrollView. Isso permite que você aproveite o espaço extra nas laterais da tela redonda.

Dentro do ConstraintLayout você pode posicionar os widgets da maneira que funciona melhor para o app.

Os conteúdos nas partes de cima e de baixo do contêiner vertical precisam ser pequenos o suficiente para caber em uma tela redonda, como no exemplo anterior.

Observação: sempre que possível, adicione um indicador de rolagem à NestedScrollView, definindo android:scrollbars="vertical" no XML. Isso ajuda o usuário a identificar que há mais conteúdo disponível e mostra o ponto em que ele se encontra em relação a todo o conteúdo.

Outras opções de telas de sobreposição

  • Listas: para mostrar grandes conjuntos de dados, use o widget WearableRecyclerView otimizado para superfícies wearable. Para ver mais informações, consulte Criar listas no Wear OS.
  • Paginação horizontal: para casos de uso com várias telas irmãs, use a opção de deslizar na horizontal. Caso o app use a paginação horizontal, ele precisará oferecer suporte ao recurso de deslizar para a esquerda para dispensar.
  • Movimento 2D: em casos de uso como mapas, os usuários podem arrastar para mover em diferentes direções. Ative o recurso deslizar para dispensar caso a atividade ocupe a tela inteira.