Resolver problemas de mostradores do relógios

A criação de um mostrador do relógio personalizado para o Wear OS by Google é bastante diferente da criação de notificações e de atividades específicas de wearable. Esta aula mostra como resolver alguns problemas que você pode encontrar ao implementar os primeiros mostradores de relógio.

Confira os seguintes recursos relacionados:

Detectar o formato da tela

Alguns dispositivos Wear OS têm telas quadradas, enquanto outros têm telas redondas. Dispositivos com telas redondas podem conter uma inserção (ou "queixo") na parte inferior da tela. O mostrador do relógio deve se adaptar e aproveitar o formato particular da tela, conforme descrito nas diretrizes de design.

O Wear OS permite que o mostrador do relógio determine o formato da tela no tempo de execução. Para detectar se a tela é quadrada ou redonda, modifique o método onApplyWindowInsets() na classe CanvasWatchFaceService.Engine da seguinte maneira:

Kotlin

    private inner class Engine : CanvasWatchFaceService.Engine() {
        internal var mIsRound: Boolean = false
        internal var chinSize: Int = 0

        override fun onApplyWindowInsets(insets: WindowInsets) {
            super.onApplyWindowInsets(insets)
            mIsRound = insets.isRound
            chinSize = insets.systemWindowInsetBottom
        }
        ...
    }
    

Java

    private class Engine extends CanvasWatchFaceService.Engine {
        boolean mIsRound;
        int chinSize;

        @Override
        public void onApplyWindowInsets(WindowInsets insets) {
            super.onApplyWindowInsets(insets);
            mIsRound = insets.isRound();
            chinSize = insets.getSystemWindowInsetBottom();
        }
        ...
    }
    

Para adaptar seu projeto ao desenhar o mostrador do relógio, verifique o valor das variáveis de membro mIsRound e mChinSize.

Acomodar peek cards

Observação: os peek cards só aparecem nos apps do Wear 1.x.

Quando o usuário recebe uma notificação, o cartão de notificação pode cobrir uma parte significativa da tela, dependendo do estilo da IU do sistema. O mostrador do relógio deve se adaptar a essas situações, garantindo que o usuário ainda possa ver as horas enquanto o cartão de notificação está presente.

Os mostradores analógicos podem fazer ajustes quando um cartão de notificação está presente, como reduzir o mostrador do relógio para caber na parte da tela que não está coberta pelo peek card. Os mostradores de relógio digitais que exibem a hora na área da tela não coberta por peek cards geralmente não exigem ajustes. Para determinar o espaço livre acima do peek card e adaptar seu mostrador do relógio, use o método WatchFaceService.Engine.getPeekCardPosition().

No modo ambiente, os peek cards têm um plano de fundo transparente. Se o mostrador do relógio tiver detalhes próximos do cartão no modo ambiente, desenhe um retângulo preto sobre eles para que o usuário consiga ler o conteúdo do cartão.

Configurar os indicadores do sistema

Para que os indicadores do sistema permaneçam visíveis, configure a posição deles na tela e determine se eles precisarão de proteção em segundo plano quando você criar uma instância de WatchFaceStyle:

  • Para definir a posição da barra de status, use o método setStatusBarGravity().
  • Para definir a posição da hotword, use o método setHotwordIndicatorGravity().
  • Para proteger a barra de status e a hotword com um plano de fundo cinza semitransparente, use o método setViewProtection(). Isso geralmente é necessário quando o mostrador do relógio tem um plano de fundo claro, uma vez que os indicadores do sistema são brancos.

Para mais informações sobre os indicadores do sistema, consulte Configurar a IU do sistema e leia as diretrizes de design.

Usar medições relativas

Os dispositivos Wear OS de diferentes fabricantes possuem telas com diversos tamanhos e resoluções. O mostrador do relógio deve se adaptar a essas variações usando medidas relativas em vez de valores absolutos de pixels.

Ao desenhar o mostrador do relógio, descubra o tamanho da tela com os métodos Canvas.getWidth() e Canvas.getHeight() e defina as posições dos seus elementos gráficos usando valores correspondentes a uma fração do tamanho da tela detectado. Se você redimensionar os elementos do mostrador do relógio em resposta a um peek card, use valores que sejam uma fração do espaço restante acima do cartão para redesenhar o mostrador do relógio.