O Material Design é um guia abrangente para design visual, de movimento e de interação para várias plataformas e dispositivos. Para usar o Material Design nos seus apps Android, siga as diretrizes definidas na especificação do Material Design. Se o app usa o Jetpack Compose, você pode usar a biblioteca Compose Material 3. Caso seu app usa visualizações, use a biblioteca Android Material Components.
O Android oferece os seguintes recursos para ajudar você a criar apps do Material Design:
- Um tema de app do Material Design para estilizar todos os widgets de interface
- Widgets para visualizações complexas, como listas e cards
- APIs para sombras e animações personalizadas
Tema e widgets do Material Design
Para aproveitar os recursos do Material Design, como o estilo de widgets de interface padrão e simplificar a definição de estilo do app, aplique um tema baseado no Material Design ao app.
Se você usa o Android Studio para criar seu projeto Android, ele aplica um tema do Material Design por padrão. Para saber como atualizar o tema do seu projeto, consulte Estilos e temas.
Para oferecer uma experiência familiar aos usuários, use os padrões de UX mais comuns do Material Design:
- Promova a ação principal da interface com um botão de ação flutuante (FAB, na sigla em inglês).
- Mostre sua marca, navegação, pesquisa e outras ações usando a barra de apps.
- Mostre e oculte a navegação do app com a gaveta de navegação.
- Escolha entre muitos outros componentes do Material Design para o layout e a navegação do seu app, como barras de ferramentas recolhíveis, guias, uma barra de navegação inferior e muito mais. Para conferir todos eles, consulte o catálogo de componentes do Material Design para Android (link em inglês).
Sempre que possível, use ícones predefinidos do Material Design. Por exemplo, para o botão "menu" da gaveta de navegação, use o ícone de "hambúrguer" padrão. Consulte Ícones do Material Design (link em inglês) para conferir uma lista dos ícones disponíveis. Também é possível importar ícones SVG da biblioteca Material Icon com o Vector Asset Studio do Android Studio.
Sombras e cartões de elevação
Além das propriedades X e Y, as visualizações no Android têm uma propriedade Z. Essa propriedade representa a elevação de uma visualização, que determina o seguinte:
- O tamanho da sombra: visualizações com valores de Z mais altos lançam sombras maiores.
- A ordem do desenho: visualizações com valores de Z maiores aparecem sobre outras visualizações.
Você pode aplicar elevação a um layout baseado em cards, o que ajuda a mostrar informações importantes
dentro de cards que oferecem uma aparência do Material Design. Você pode usar o widget
CardView para
criar cards com uma elevação padrão. Para mais informações, consulte
Criar um layout baseado em cards.
Para ver informações sobre como adicionar elevação a outras visualizações, consulte Criar sombras e recortar visualizações.
Animações
As APIs Animation permitem criar animações personalizadas para feedback de toque em controles de interface, mudanças no estado da visualização e transições de atividade.
Essas APIs permitem:
- responder a eventos de toque nas suas visualizações com animações de feedback de toque;
- Ocultar e mostrar visualizações com animações de revelação circular.
- alternar entre atividades com animações de transição de atividade personalizadas;
- Criar animações mais naturais com movimento curvo.
- Animar mudanças em uma ou mais propriedades de visualização com as animações de mudança do estado de visualização.
- Mostre animações em drawables de lista de estado entre mudanças de estado de visualização.
As animações de feedback de toque são integradas a diversas visualizações padrão, como botões. As APIs Animation permitem personalizar essas animações e adicioná-las às visualizações personalizadas.
Para mais informações, consulte Introdução às animações.
Drawables
Esses recursos para drawables ajudam a implementar apps do Material Design:
- Drawables vetoriais são escalonáveis sem perder a definição e são perfeitos para ícones de uma única cor no app. Saiba mais sobre drawables vetoriais.
- Tonalidade de drawables: permite definir os bitmaps como uma máscara alfa e colori-los com uma cor no tempo de execução. Veja como adicionar tonalidade a drawables.
- Extração de cor: permite extrair automaticamente cores proeminentes de uma imagem de bitmap. Veja como selecionar cores com a API Palette.