Estilizar widgets de forma eficaz é crucial para alcançar um visual atraente experiência do usuário consistente. Esta seção se aprofunda nos principais conceitos e técnicas para definir a cor e a tipografia para criar a melhor e interessantes widgets do Android.
Cor
Usar cores para expressar estilo e comunicar significado. Definir as cores apropriadas para as cores do widget são cruciais para a legibilidade, personalização e de como expressar a identidade da marca do seu aplicativo.
Usar tokens e funções de cor do Material Design para atender às diretrizes de contraste de acessibilidade e oferecer suporte a recursos de cor dinâmica, como cores geradas pelo usuário e cores escuras temas claros.
Para saber mais, consulte as orientações de cor do Material Design (link em inglês).
Temas dinâmicos
No Android 12 e versões mais recentes, um widget pode usar as cores do tema do dispositivo para botões, planos de fundo e outros componentes. Isso proporciona consistência visual entre widgets, ícones da tela inicial e papéis de parede, oferecendo aos usuários do Android uma experiência do usuário mais coesa. O uso dos tokens de cor fornecidos garante que seu o widget será integrado em todos os temas de dispositivos fornecidos por diferentes fabricantes e temas dinâmicos definidos pelo usuário.
![](https://developer.android.com/static/images/design/ui/mobile/widgets/01_Dynamic_theme.jpg?authuser=6&hl=pt)
Modo claro e escuro
O modo escuro é uma versão com pouca luz da interface do dispositivo que aparece principalmente escura cores da superfície. Os usuários estão mudando cada vez mais para o modo escuro para melhorar a experiência do usuário. duração da bateria e conforto ocular. Caso seu widget não se adapte ao modo escuro, ele aparecem fora do lugar e podem frustrar os usuários.
![](https://developer.android.com/static/images/design/ui/mobile/widgets/02_Light_and_Dark.jpg?authuser=6&hl=pt)
Tipografia
A tipografia ajuda a tornar a escrita legível e bonita. Use tamanhos de fonte e para estabelecer uma hierarquia clara, direcionando o olhar do usuário para os pontos elementos importantes. Preste atenção ao espaçamento entre linhas e ao espaçamento entre letras (kerning) para melhorar a legibilidade, especialmente para exibições de texto menores dentro do espaço restrito de um widget.
Hierarquia
A hierarquia é comunicada pelas diferenças na espessura da fonte, no tamanho, na altura da linha, e espaçamento entre letras. A escala de tipografia atualizada organiza estilos de texto em cinco funções nomeados para descrever suas finalidades. Os cinco estilos de texto são display, cabeçalho, título, subtítulo e corpo. As novas funções não dependem de dispositivos, permitindo uma aplicação mais fácil em diversos casos de uso.
![](https://developer.android.com/static/images/design/ui/mobile/widgets/03_Typography.jpg?authuser=6&hl=pt)