Os dispositivos de TV oferecem um conjunto limitado de controles de navegação para apps. A criação de um esquema de navegação eficiente para o app de TV depende da compreensão desses controles limitados e dos limites da percepção do usuário ao operar o app. Conforme você cria o app para Android para TVs, preste atenção especialmente em como o usuário navega usando botões do controle remoto em vez de uma touchscreen.
Esta lição explica os requisitos mínimos para a criação de esquemas de navegação de apps para TV e como aplicar esses requisitos ao app.
Ativar a navegação D-pad
Em um dispositivo de TV, os usuários navegam com controles em um dispositivo de controle remoto usando um teclado direcional (D-pad) ou teclas de seta. Esse tipo de controle limita a movimentação para cima, para baixo, para a esquerda e para a direita. Para criar um app excelente e otimizado, você precisa oferecer um esquema de navegação em que o usuário possa aprender rapidamente a navegar pelo app usando esses controles limitados.
O framework do Android processa a navegação direcional entre elementos de layout automaticamente, portanto, normalmente não é preciso fazer nada extra no app. Ainda assim, teste a navegação com um controlador D-pad para detectar problemas. Siga estas orientações para testar se o sistema de navegação do app funciona bem com um D-pad em um dispositivo de TV:
- Confirme se um usuário com controlador D-pad pode navegar para todos os controles visíveis na tela.
- Para listas de rolagem com foco, confirme se o D-pad e as teclas para cima e para baixo rolam na lista e se a tecla Enter seleciona um item na lista. Confira se os usuários podem selecionar um elemento na lista e se ela ainda rola quando um elemento é selecionado.
- Confirme se a mudança entre controles é simples e previsível.
Modificação da navegação direcional
A estrutura de trabalho do Android aplica um esquema de navegação direcional baseado na posição relativa de elementos focalizáveis nos layouts. É necessário testar o esquema de navegação gerado no app usando um controlador D-pad. Após o teste, se você decidir que quer que os usuários se movimentem pelos layouts de maneira específica, poderá definir navegação direcional explícita para os controles.
Observação: você só precisa usar esses atributos para modificar a ordem da navegação se a ordem padrão aplicada pelo sistema não funcionar bem.
A amostra de código a seguir ilustra como definir o controle seguinte para receber foco para um objeto de layout TextView
:
<TextView android:id="@+id/Category1" android:nextFocusDown="@+id/Category2"\>
A tabela a seguir lista todos os atributos de navegação para widgets da interface do usuário do Android:
Atributo | Função |
---|---|
nextFocusDown |
Define a próxima exibição a receber foco quando o usuário navega para baixo. |
nextFocusLeft |
Define a próxima exibição a receber foco quando o usuário navega para a esquerda. |
nextFocusRight |
Define a próxima exibição a receber foco quando o usuário navega para a direita. |
nextFocusUp |
Define a próxima exibição a receber foco quando o usuário navega para cima. |
Para usar um desses atributos de navegação explícitos, defina o valor para o ID (valor android:id
) de outro widget no layout. É necessário definir a ordem da navegação como um ciclo para que o último controle direcione o foco de volta para o primeiro.
Oferecer foco e seleção claros
O sucesso de um esquema de navegação de app em dispositivos de TV depende da facilidade de um usuário em determinar qual elemento de interface do usuário está em foco na tela. Se você não oferecer indicações claras de itens com foco (e, portanto, em que item o usuário pode agir), os usuários podem se frustrar rapidamente e sair do app. Pelo mesmo motivo, é importante ter sempre um item em foco em que um usuário pode agir imediatamente após o início do app ou a sempre que ele estiver inativo.
O layout e a implementação do app precisam usar cores, tamanhos, animações ou uma combinação desses atributos para ajudar os usuários a determinar facilmente as ações que podem ser tomadas em seguida. Use um esquema uniforme para indicar o foco no aplicativo.
O Android oferece Recursos de lista de estado de drawables para implementar realces para controles com foco e selecionados. O exemplo de código a seguir demonstra como ativar o comportamento visual para um botão indicar que o usuário navegou para o controle e selecionou-o em seguida:
<!-- res/drawable/button.xml --> <?xml version="1.0" encoding="utf-8"?> <selector xmlns:android="http://schemas.android.com/apk/res/android"> <item android:state_pressed="true" android:drawable="@drawable/button_pressed" /> <!-- pressed --> <item android:state_focused="true" android:drawable="@drawable/button_focused" /> <!-- focused --> <item android:state_hovered="true" android:drawable="@drawable/button_focused" /> <!-- hovered --> <item android:drawable="@drawable/button_normal" /> <!-- default --> </selector>
A amostra de código XML de layout a seguir aplica o drawable de lista de estados anterior a um Button
:
<Button android:layout_height="wrap_content" android:layout_width="wrap_content" android:background="@drawable/button" />
Não deixe de oferecer preenchimento suficiente dentro dos controles selecionáveis e focalizáveis para que os realces em torno deles sejam claramente visíveis.
Para mais recomendações sobre como projetar seleção e foco eficientes para o app para TV, consulte Criar para Android TV.