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 nas especificações do Material Design (link em inglês). Se o app usa o Jetpack Compose, pode usar a biblioteca Compose Material 3. Se o seu app usa visualizações, você pode usar a biblioteca Android Material Components.
O Android oferece os seguintes recursos para ajudar você a criar apps com 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 para widgets de interface padrão, e simplificar a definição de estilo do seu app, aplique um tema baseado no Material Design ao app.
Se você usar o Android Studio para criar um projeto Android, ele vai aplicar um tema do Material Design por padrão. Para saber como atualizar o tema do seu projeto, consulte Estilos e temas.
Para oferecer aos usuários uma experiência familiar, use os padrões de UX mais comuns do Material Design:
- Promova a principal ação 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 os 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.
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 (em inglês) para conferir uma lista dos ícones disponíveis. Você também pode 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 de desenho: visualizações com valores Z mais altos 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 saber mais, consulte
Criar um layout baseado em cards.
Para saber 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 atividades.
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;
- Crie animações mais naturais com movimento curvo.
- Anime mudanças em uma ou mais propriedades de visualização com animações de mudança do estado de visualização.
- Mostrar 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 de animação 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. Saiba como adicionar tonalidades a drawables.
- Extração de cor: permite extrair automaticamente as cores em destaque de uma imagem de bitmap. Confira como selecionar cores com a API Palette.