Opciones de pantalla

Organiza tus páginas con colecciones Guarda y categoriza el contenido según tus preferencias.

Después de comprender cómo manejar diferentes formas de reloj, decide qué tipo de superposición quieres usar.

En la siguiente lista, se describen los tipos de pantalla superpuesta. Puedes usar una combinación de estas si necesitas varias pantallas.

  • Pantalla única (más simple): Los elementos de la IU se limitan a lo que es visible en un momento dado sin desplazamiento.
  • Contenedor vertical (más común): El contenido existe más allá de la parte visible de la pantalla (accesible con desplazamiento).
  • Otras opciones (listas, paginación o desplazamiento en 2D).

Nota: Para tu actividad, debes heredar de ComponentActivity o FragmentActivity (si usas fragmentos). Los otros tipos de actividad usan elementos de IU específicos para dispositivos móviles que no necesitas para Wear OS.

Pantalla única

El usuario ve todos los elementos en una sola pantalla sin desplazarse. Esto significa que puedes incluir solo una pequeña cantidad de elementos.

Figura 1: Varios ejemplos de pantallas individuales

Las pantallas individuales funcionan bien con BoxInsetLayout en combinación con un ConstraintLayout para organizar tus elementos.

Un BoxInsetLayout es un widget de IU de Wear OS que te permite definir un diseño único que funciona para pantallas cuadradas, rectangulares y redondas. Esta clase aplica las inserciones de ventana requeridas, según la forma de la pantalla, y te permite alinear fácilmente las vistas en el centro de la pantalla. Sin embargo, si no te importa crear diseños separados para aprovechar cada forma de pantalla, usa layout-round y layout-notround. Para obtener más información, consulta Usa diferentes diseños para pantallas cuadradas y redondas.

Contenedor vertical

Un contenedor vertical es el tipo de superposición más común y tiene contenido adicional que no se ve en la pantalla, pero que es accesible con el desplazamiento.

En las siguientes imágenes, se muestran varios ejemplos completos de superposiciones, en los que solo se puede ver una parte del contenido en la pantalla circular de un reloj. El contenido principal se encuentra en la parte superior del contenedor. En estos ejemplos, se muestran otros recorridos críticos del usuario (CUJ) y parámetros de configuración en la parte inferior.

A diferencia de una sola superposición de pantalla, no uses BoxInsetLayout. En su lugar, coloca un ConstraintLayout dentro de una NestedScrollView. De esta manera, puedes aprovechar el espacio adicional a los lados de una pantalla circular.

Dentro de ConstraintLayout, coloca los widgets que sean más convenientes para tu app.

Asegúrate de que el contenido de las partes inferior y superior del contenedor vertical sea lo suficientemente pequeño como para caber en la parte inferior y superior de una pantalla circular, como en el ejemplo anterior.

Nota: Siempre que sea posible, agrega un indicador de desplazamiento a tu NestedScrollView estableciendo android:scrollbars="vertical" en el XML. Eso ayuda a los usuarios a identificar que hay más contenido disponible y a ver dónde se encuentran en relación con todo el contenido.

Otras opciones para pantallas superpuestas

  • Listas: Muestra grandes conjuntos de datos con el widget WearableRecyclerView optimizado para plataformas wearables. Si quieres obtener más información, consulta Cómo crear listas en Wear OS.
  • Paginación horizontal: Para casos prácticos con varias pantallas relacionadas, usa un deslizamiento horizontal. Si usas la paginación horizontal, debes admitir la opción de deslizar para descartar en el borde izquierdo.
  • Desplazamiento en 2D: Para casos de uso como mapas, los usuarios pueden arrastrar para desplazarse en diferentes direcciones. Habilita deslizar para descartar si tu actividad ocupa toda la pantalla.