Desenvolver mostradores de relógio

Os mostradores de relógio personalizados aproveitam uma tela digital dinâmica que pode incluir cores, animações e informações contextuais.

Criar um mostrador do relógio para o Wear OS by Google envolve uma visualização clara da hora, assim como você teria em um mostrador de relógio tradicional. Os dispositivos Wear OS oferecem recursos avançados para mostradores de relógio que você pode usar nos seus designs, como cores vibrantes, planos de fundo dinâmicos, animações e integração de dados. No entanto, há também muitas considerações de design a serem levadas em consideração.

Para projetar um mostrador do relógio sem programação, consulte Watch Face Studio (link em inglês).

Para começar a projetar um mostrador do relógio, consulte outros exemplos. Faça o download do app complementar do Wear OS para navegar em uma grande seleção de mostradores de relógio.

Planejar a implementação do mostrador do relógio

Depois de finalizar o design do mostrador do relógio, é preciso determinar como coletar os dados necessários e desenhar o mostrador no dispositivo wearable. A maioria das implementações consiste nos seguintes componentes:

  • Uma ou mais imagens de plano de fundo
  • Código do aplicativo que recupera os dados necessários.
  • É um código do aplicativo que desenha texto e formas sobre as imagens de plano de fundo.

Normalmente, os apps exibem imagens de plano de fundo diferentes para os modos interativo e ambiente. Pode ser difícil criar uma imagem de boa aparência para o modo ambiente. Os planos de fundo desse modo costumam ser totalmente pretos ou cinza, sem imagens.

As imagens de plano de fundo dos dispositivos Wear OS com densidade de tela de hdpi precisam ser de 320 x 320 pixels. Os cantos da imagem de plano de fundo não são visíveis em dispositivos redondos. No seu código, você poderá detectar o tamanho da tela do dispositivo e reduzir a imagem de plano de fundo se o dispositivo tiver uma resolução menor que a imagem. Para melhorar a performance, escalone a imagem de plano de fundo apenas uma vez e armazene o bitmap resultante.

Execute o código do aplicativo para extrair dados contextuais somente quando necessário e armazene os resultados para reutilizar os dados sempre que renderizar o mostrador do relógio. Por exemplo, você não precisa buscar atualizações de clima a cada minuto.

Mantenha o código do aplicativo que desenha o mostrador do relógio no modo ambiente relativamente simples para aumentar a duração da bateria. Em geral, desenhe contornos de formas usando um conjunto limitado de cores nesse modo. No modo interativo, você pode usar cores, formas complexas, gradientes e animações para desenhar o mostrador do relógio.

As lições restantes nesta aula mostram com mais detalhes como implementar mostradores de relógio.

Confira estes recursos relacionados: