En esta guía, se describen los componentes que componen una tarea en forma de cronómetro. Una tarea en curso muestra una tarjeta en vivo en el cronograma mientras el usuario está involucrado en una tarea y le permite entrar y salir de la tarjeta en vivo a medida que necesita información.
Durante el proceso, también aprenderás sugerencias de diseño, desarrollo y distribución que son importantes para la compilación de tu propia Glassware.
Antes de comenzar
La fuente completa del cronómetro está disponible en GitHub. Impórtala a Android Studio antes de comenzar, ya que esta guía hace referencia a ella en gran medida.
- En la pantalla de inicio rápido, haz clic en Revisar desde el control de versiones > Git.
- Copia la URL de clonación del cronómetro.
- Pega la URL de clonación en la URL del repositorio de Vcs y haz clic en Clone (Clonar).
- Haz clic en Sí en la siguiente pantalla.
- Haz clic en Aceptar en la siguiente pantalla.
- Para compilar el proyecto y ejecutarlo en tu Glass conectado, haz clic en el botón Play (Reproducir). Asegúrate de verificar el
READMEde la muestra para obtener los detalles de invocación.
Qué aprenderás
Aprenderás a usar componentes del SDK de Android para compilar la mayor parte de la tarea en curso del cronómetro y, luego, GDK para conectarse a la experiencia de Glass. A continuación, le presentamos una lista de los temas sobre los que aprenderá:
- Cómo crear una vista personalizada para dibujar en la tarjeta publicada
- Crea un servicio para administrar la tarjeta publicada
- Proporcionar un menú que permita a los usuarios quitar la tarjeta publicada del cronograma
- Cómo declarar un activador de voz para iniciar el cronómetro desde el menú de voz principal
Diseño
Antes de empezar a programar, tómate un tiempo y diseña tu Glassware. De esta manera, podrás saber qué flujos de la IU funcionan mejor en Glass, qué comando por voz usarás y cómo se verán tus tarjetas.
Por supuesto, diseñar Glassware es un proceso iterativo y algunas de las cosas que diseñes ahora cambiarán, pero tener una buena parte de este trabajo al principio es fundamental para crear una experiencia excelente.
Flujo de IU
Diseñar el flujo de la IU es un ejercicio simple y te permite visualizar tu Glassware antes de escribir una línea de código. Lo hacemos todo el tiempo para los vasos que creamos.
Analicemos los principales elementos de la IU del cronómetro para que tengas una idea de cómo funciona la IU y lo útil que puede ser este proceso cuando creas tu propia Glassware.
IU principal
El cronómetro contiene un solo flujo principal, porque es una experiencia bastante simple.
Cuando los usuarios invocan Glassware, se les muestra un anuncio intersticial de cuenta regresiva de 3 segundos antes de que comience el cronómetro real. Luego, el cronómetro cuenta hasta que el usuario lo quita de la línea de tiempo con un elemento de menú Stop.
Comando por voz
Debes comprender un comando por voz apenas comienza el proceso de diseño. Los comandos por voz permiten a los usuarios iniciar Glassware desde el menú de voz de la pantalla principal (tarjeta de reloj) si es necesario, y son una parte importante del diseño de Glassware.
Por ejemplo, el comando Publicar una actualización funciona bien en un modelo que activa y olvida, en el que los usuarios hablan un texto y Glassware lo procesa sin ninguna intervención adicional. Esto permite que los usuarios regresen a lo que están haciendo con rapidez.
Por otro lado, para algo como Jugar un juego, normalmente querrás dirigir a los usuarios a una pantalla de presentación para que puedan orientarse primero. Debido a que lo más probable es que este comando por voz inicie una inmersión, puedes esperar que los usuarios estén de acuerdo con ver pantallas y menús adicionales para iniciar el juego. Colocarlos de inmediato en una experiencia de juego justo después de que el comando por voz suele ser una mala experiencia para juegos.
El cronómetro usa el comando por voz Iniciar un cronómetro. Después de que los usuarios invocan el comando por voz, el cronómetro se inicia inmediatamente después de una breve pantalla de cuenta regresiva intersticial. Esto es mejor que proporcionar un elemento de menú para comenzar. Por lo general, para las tareas en curso, es posible que desees enfocarte en llevar a los usuarios a la experiencia lo más rápido posible, cuando sea conveniente.
Diseños de tarjetas
Ya sea que compiles inmersiones o tarjetas en vivo, debes usar CardBuilder o diseños XML siempre que sea posible.
A menudo, deberás compilar tu propio diseño, por lo que debes seguir nuestros lineamientos de IU para tener la apariencia de Glassware más atractiva.
El cronómetro sigue los lineamientos de diseño generales, pero tiene diseños personalizados de la IU con componentes estándar de Android, como vistas y diseños.
Desarrollo
A fin de desarrollar tarjetas en vivo, usa las mismas herramientas que usarías para el desarrollo de Android a fin de compilar la mayoría de los componentes de Glassware y, luego, usa las API del complemento de GDK a fin de acceder a funciones específicas de Glass, como las tarjetas en vivo y los comandos por voz.
Con frecuencia, usarás componentes comunes de Android para crear Glassware, pero ten en cuenta que algunos conceptos a veces son diferentes. Por ejemplo, procesas y administras tarjetas en vivo con un servicio de Android, que no es una forma típica de usar servicios en apps para Android tradicionales. Otro ejemplo es que las tarjetas activas no poseen su propio contexto de IU, por lo que debes usar una actividad de shell que muestre un menú para la tarjeta publicada. Aprenderás cómo se compilan estos componentes más adelante en esta guía.
En el resto de las secciones de Desarrollo, se explica cómo se estructura el cronómetro y los componentes principales del proyecto que importaste antes. Es útil contar con Android Studio ahora mismo para que puedas seguir el camino. Se comenta el código fuente, por lo que esta sección revisa el propósito de alto nivel de cada archivo y sugerencias útiles que puedes aplicar a tu propia Glassware.
Comando por voz
Creas comandos por voz con un archivo de recursos XML que especifique el comando que usas y, luego, especifica el recurso XML en el archivo AndroidManifest.xml.
Los siguientes archivos están asociados con el comando por voz del cronómetro:
res/xml/voice_trigger_start.xml: declara el comando por voz que se usará.AndroidManifest.xml: Declara el servicio de tarjeta en vivo que se inicia cuando se pronuncia el comando por voz.
Vista de cuenta regresiva
En el cronómetro, se muestra una cuenta regresiva antes de que se grabe el tiempo para que los usuarios noten que está a punto de pasar.
Los siguientes archivos están asociados con la vista de cuenta regresiva:
res/layout/card_countdown.xml: Define el diseño del visor de cuenta regresivasrc/com/google/android/glass/sample/stopwatch/CountDownView.java: Define la vista para la cuenta regresiva.
Vista del cronómetro
Esta es la vista principal del cronómetro. Muestra el tiempo transcurrido desde que se completa el anuncio intersticial de cuenta regresiva. Los siguientes archivos están asociados con la vista de cronómetro:
res/layout/card_chronometer.xml: Define el diseño de la vista del cronómetro.src/com/google/android/glass/sample/stopwatch/ChronometerDrawer.java: Define cómo renderizar la vista. Este servicio llama a esta clase para dibujar al servicio de tarjetas activas.src/com/google/android/glass/sample/stopwatch/ChronometerView.java: Es la vista del cronómetro que usa el diseño anterior como su IU.
Servicio de cronómetro
Este es el servicio que administra el ciclo de vida y el procesamiento de la tarjeta en vivo. Los siguientes archivos están asociados con este servicio:
src/com/google/android/glass/sample/stopwatch/StopwatchService.java: Administra la tarjeta en vivo del cronómetro y controla el ciclo de vida del servicio.
Actividad del menú
Las tarjetas en vivo no tienen su propio contexto de IU para mostrar un menú porque renderizan sus IU en el contexto del cronograma.
Para evitar esta limitación, creas una actividad translúcida que aparece en la parte superior del cronograma y, luego, muestras el menú de esa actividad inmediatamente después de que los usuarios presionen la tarjeta publicada.
src/com/google/android/glass/sample/stopwatch/MenuActivity.java: Declara la actividad translúcida del menú que muestra el menú de inmediato cuando la actividad es visible.res/values/styles.xml: Define el estilo translúcido que se aplica al menú.res/menu/stopwatch.xml: Es el recurso de menú que contiene el elemento de menú obligatorio Stop.
Manifiesto de Android
El archivo AndroidManifest.xml describe los componentes principales de tu Glassware para que el sistema sepa cómo ejecutarlo. El manifiesto de Charades declara lo siguiente:
- El ícono y el nombre de Glassware Glass muestra esta información en el menú táctil principal si más de un Glassware responde al mismo comando de voz.
- Todos los servicios y actividades asociados con el cronómetro. Esto es necesario para que el sistema sepa cómo iniciar los componentes de Glassware.
- El comando por voz y un filtro de intents que inicia el servicio de tarjetas en vivo cuando se pronuncia el comando por voz.
- Un código de versión para Glassware. Este código se debe actualizar (y, por lo general, también el nombre de la versión) cada vez que se sube una versión nueva de este APK a MyGlass.