informacion[arroba]academiaandroid.com +34 958084455
Layout Android Wear Smartwatches

Android Wear: diseño de layout para smartwatches

Post Series: Plataformas Android (II)

Comenzamos una nueva serie de tutoriales sobre Android Wear. En ella trataremos diversos aspectos sobre esta plataforma de desarrollo Android:

  • Diseño de layout para smartwatches
  • Clases de la biblioteca UI para Wearables.
  • Soporte para comandos de voz.
  • Ejercicio práctico con Android Wear

Diseño de layout

En esta primera publicación, se describirán los diferentes enfoques que se deben tener en cuenta a la hora de diseñar aplicaciones para la plataforma Android Wear, y en especial, la adaptación de apps a las pantallas de los relojes inteligentes o smartwatches.

Durante el diseño de interfaces de usuario sobre dispositivos corporales, se presentan una serie de limitaciones definidas por la forma en que se presentan las pantalla de cada dispositivo. Al desarrollar un proyecto destinado al sistema operativo Android Wear, es necesario tener muy presente el diseño físico del dispositivo, ya que este puede presentar formas cuadradas o redondas, impidiendo en determinados casos que la información que se muestre por pantalla no sea legible o de acceso difícil para determinadas funcionalidades.

Es muy común que a la hora de mostrar datos dentro de la aplicación, y al tratarse de dispositivos con una pantalla bastante reducida, se desee utilizar el total de la misma, mostrando texto, imágenes o incluso componentes para lanzar eventos cerca de las esquinas de la pantalla. Al utilizar un layout con forma redonda, parte de ese contenido no será visible completamente, y por lo tanto el uso de esta aplicación se verá limitada a dispositivos con pantalla cuadrada. Para evitar este problema, Android propone, dentro del uso de bibliotecas de interfaz de usuario para wearables, los siguientes enfoques para solucionar esta limitación o inconveniente:

Diseno Pantalla RedondaDiseño Pantalla Cuadrada

Como se puede apreciar en la imagen superior, el diseño creado en un dispositivo con forma cuadrada, no es óptimo para dispositivos con forma redonda, ya que parte del contenido no es visible.

  • Enfoque 1: Definir diferentes diseños en función de si la forma de la pantalla es redonda o cuadrada.
  • Enfoque 2: Utilizar la clase BoxInsetLayout, que define una vista personalizada, incluida en la biblioteca UI proporcionada. Esta vista permite, a partir de un diseño único, ser válido tanto para dispositivos con forma cuadrada como redonda.

De manera mayoritaria, se utilizan diferentes diseños en función de si la forma del dispositivo es cuadrada o redonda, debido a que si se desea definir un solo diseño que sea válido para ambas opciones, es recomendable tener en cuenta una serie de factores que deberán configurarse previamente para controlar su posicionamiento en pantallas redondas.

Tanto si se opta por la primera opción, como por la segunda, a continuación se describirán ambos procesos, que permitan utilizar el diseño que se adapte mejor a nuestras necesidades, sin renunciar al funcionamiento de la aplicación en ambas opciones.

Nota: Para las siguientes técnicas de diseño, se deberá añadir la siguiente dependencia al módulo “wear”:

Diferentes diseños para pantallas cuadradas y redondas

Al crear un proyecto para Android Wear, y más concretamente dentro de la Activity creada al generar un proyecto en el módulo “wear”, se aprecia como se ha declarado e inicializado una clase llamada WatchViewStub. Una vez se ha creado la estructura principal del proyecto, y desde el módulo “wear” destinado a dispositivos corporales, deberán tenerse en cuenta los siguientes puntos:


Contenido disponible para los usuarios Premium. ¡Únete a nosotros!

This Post Has One Comment

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Para evitar robots, por favor completa esta sencilla operación *