Estilizar widgets de maneira eficaz é crucial para alcançar uma experiência do usuário visualmente atraente e consistente. Esta seção analisa os principais conceitos e técnicas para definir a cor e a tipografia e criar os widgets Android mais úteis e envolventes.
Cor
Use a cor para expressar estilo e comunicar significado. Definir cores adequadas para as cores do seu widget é essencial para garantir legibilidade, personalização e, é claro, para expressar a identidade da marca do seu app.
Use tokens e funções de cor do Material Design para atender às diretrizes de contraste de acessibilidade e oferecer suporte a recursos de cores dinâmicas, como cores geradas pelo usuário e temas escuros ou claros.
Para saber mais, consulte as orientações de cores 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 em diferentes widgets, ícones de tela inicial e planos de fundo, oferecendo aos usuários do Android uma experiência mais coesa. O uso dos tokens de cor fornecidos garante que o widget seja integrado a todos os temas do dispositivo fornecidos por diferentes fabricantes e os temas dinâmicos definidos pelo usuário.
Modo claro e escuro
Um modo escuro é uma versão da interface do dispositivo com pouca luz, que mostra principalmente cores de superfície escuras. Os usuários estão trocando cada vez mais para o modo escuro para melhor duração da bateria e conforto para os olhos. Se o widget não se adaptar ao modo escuro, ele vai aparecer fora do lugar e pode frustrar os usuários.
Tipografia
A tipografia ajuda a tornar a escrita legível e bonita. Use tamanhos e pesos de fonte para estabelecer uma hierarquia clara, orientando o olhar do usuário para os elementos mais 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 por diferenças no peso, tamanho, altura da linha e espaçamento entre letras da fonte. A escala de tipografia atualizada organiza estilos de texto em cinco papéis que são nomeados para descrever as finalidades. Os cinco estilos de texto são exibição, título, título, subtítulo e corpo. Os novos papéis são independentes de dispositivo, o que facilita a aplicação em diversos casos de uso.
