Los dispositivos de TV ofrecen una cantidad limitada de controles de navegación para las apps. Crear un esquema de navegación efectivo para tu app de TV depende del entendimiento de estos controles limitados y de los límites de percepción de los usuarios mientras usan tu app. A medida que compilas apps de Android para TV, debes prestar especial atención a la manera en que el usuario navega por tu app mediante los botones del control remoto en lugar de una pantalla táctil.
En esta lección, se explican los requisitos mínimos para crear esquemas de navegación efectivos para apps para TV y cómo implementarlos.
Cómo habilitar la navegación con el pad direccional
En un dispositivo de TV, los usuarios navegan con controles en un dispositivo de control remoto mediante un mando de dirección (pad direccional) o teclas de flechas. Este tipo de control limita los movimientos a arriba, abajo, izquierda y derecha. Para crear una buena app optimizada para TV, debes proporcionar un esquema de navegación en el que el usuario aprenda rápidamente cómo navegar por tu app con estos controles limitados.
El marco de trabajo de Android controla la navegación direccional entre los elementos de diseño de manera automática, por lo que, generalmente, no necesitas realizar ninguna acción adicional para tu app. Sin embargo, debes probar rigurosamente la navegación con un controlador de pad direccional para detectar si hay algún problema. Sigue estos lineamientos para probar que el sistema de navegación de tu app funciona correctamente con un pad direccional en un dispositivo de TV.
- Asegúrate de que un usuario con un controlador de pad direccional pueda navegar por todos los controles visibles en la pantalla.
- Para desplazarse en listas con enfoque, asegúrate de que las teclas arriba y abajo del pad direccional se desplacen por la lista, y que la tecla Intro seleccione un elemento de esta. Verifica que los usuarios puedan seleccionar un elemento de la lista y puedan seguir desplazándose luego de hacerlo.
- Asegúrate de que el cambio de un control a otro sea sencillo y predecible.
Cómo modificar la navegación direccional
El marco de trabajo de Android aplica automáticamente un esquema de navegación direccional basado en la posición relativa de los elementos enfocables en tus diseños. Deberías probar el esquema de navegación generado en tu app mediante un controlador de pad direccional. Una vez que lo hagas, si quieres que los usuarios se desplacen por tus diseños de una manera específica, puedes configurar una navegación direccional explícita para tus controles.
Nota: Solo debes usar estos atributos para modificar el orden de la navegación si el orden predeterminado que aplica el sistema no funciona correctamente.
En la siguiente muestra de código, se muestra cómo definir el próximo control para que se enfoque en un objeto de diseño TextView:
<TextView android:id="@+id/Category1"
android:nextFocusDown="@+id/Category2"\>
En la siguiente tabla, se enumeran todos los atributos de navegación disponibles para widgets de interfaz de usuario de Android:
| Atributo | Función |
|---|---|
nextFocusDown |
Define la siguiente vista que recibirá el enfoque cuando el usuario navegue hacia abajo. |
nextFocusLeft |
Define la siguiente vista que recibirá el enfoque cuando el usuario navegue hacia la izquierda. |
nextFocusRight |
Define la siguiente vista que recibirá el enfoque cuando el usuario navegue hacia la derecha. |
nextFocusUp |
Define la siguiente vista que recibirá el enfoque cuando el usuario navegue hacia arriba. |
Para usar uno de estos atributos de navegación explícitos, debes establecer el valor en el ID (valor android:id) de otro widget en el diseño. Deberías configurar el orden de navegación como un bucle, para que el último control dirija el enfoque al primero.
Cómo proporcionar enfoque y selección claros
El éxito del esquema de navegación de una app en dispositivos de TV depende de qué tan fácil sea para un usuario determinar qué elemento de la interfaz de usuario está enfocado en la pantalla. Si no proporcionas indicaciones claras de los elementos enfocados (ni en qué elemento el usuario puede realizar una acción), estos pueden frustrarse rápidamente y salir de la app. Por este motivo, es importante que siempre haya un elemento enfocado sobre el cual el usuario pueda realizar una acción inmediatamente después de que se inicie la app, o cuando esté inactiva.
El diseño y la implementación de tu app deberían usar color, tamaño, animación o una combinación de estos atributos para que los usuarios puedan determinar fácilmente qué acciones pueden realizar a continuación. Usa un esquema uniforme para indicar el enfoque dentro de tu app.
Android proporciona los recursos de la lista de estados de elementos de diseño para implementar una forma de destacar controles seleccionados y enfocados. En el siguiente ejemplo de código, se muestra cómo habilitar el comportamiento visual para que un botón indique que un usuario navegó al control y lo seleccionó:
<!-- 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>
En el siguiente código de muestra de diseño XML, se aplica el elemento de diseño de la lista de estados anterior en un Button:
<Button
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:background="@drawable/button" />
Asegúrate de proporcionar suficiente espacio de relleno entre los controles que pueden enfocarse y seleccionarse para que las zonas destacadas que los rodean puedan verse claramente.
Si quieres ver más recomendaciones sobre cómo diseñar de forma efectiva la selección y el enfoque en tu app para TV, consulta Diseño para Android TV.