Itens expansíveis

Ícone de item expansível

Os itens expansíveis permitem que os aplicativos incluam conteúdo de alta densidade em menos espaço na tela. Use esse componente quando quiser manter um app compacto e, ao mesmo tempo, permitir que os usuários tenham acesso rápido a conteúdos adicionais. Use esse componente para permitir que os usuários executem as seguintes tarefas:

• Mostrar mais itens da lista (ícones, cards)
• Mostrar mais texto

Lista de expansão
O ícone precisa estar alinhado ao centro.

A. Rótulo
O texto do rótulo pode ser personalizado. O padrão é "Mostrar mais".

B. Contêiner
O botão precisa incluir uma borda de contêiner.

C. Ícone "Expandir"
O ícone padrão é o chevron para baixo, que pode ser personalizado ou removido. O ícone é alinhado à direita para uma localidade de idioma LTR e à esquerda para uma localidade de idioma RTL.

Texto de expansão
O ícone precisa estar centralizado.

A. Rótulo
O texto do rótulo pode ser personalizado. O padrão é "Mais".

B. Contêiner
O botão tem duas variantes: com e sem contorno.

C. Ícone "Expandir"
O ícone padrão é o chevron para baixo, que pode ser personalizado ou removido. O ícone é alinhado à direita para uma localidade de idioma LTR e à esquerda para uma localidade de idioma RTL.

Expansão da lista

Toque no ícone para abrir e mostrar mais itens em uma lista. A ação de expansão é animada, ocultando o texto Mostrar mais e revelando os outros itens em um movimento suave. Você pode personalizar o número de itens exibidos no estado recolhido. O número recomendado de itens é três.

Texto de expansão

Toque no ícone para abrir e mostrar mais texto. A ação de expansão é animada, ocultando o texto Mais e revelando os outros itens em um movimento suave. Você pode personalizar o número de linhas de texto exibidas no estado recolhido. O número recomendado de linhas é oito.

A área de toque consiste em toda a área de texto, não apenas o botão.

Expansão da lista

Tamanho do ícone: 20 dp x 20 dp
Cor do ícone: na superfície
Altura: 32 dp
Largura: varia de acordo com o texto e o idioma
Traço: 1 dp
Estilo do marcador: Legenda 1
Cor do marcador: na superfície

Texto de expansão

Tamanho do ícone: 20 dp x 20 dp
Cor do ícone: na superfície
Altura: 32 dp
Largura: varia de acordo com o texto e o idioma
Traço: 0 ou 1 dp
Preenchimento: nenhum
Estilo do marcador: Legenda 1
Cor do marcador: na superfície

Para a variante da lista e a variante de texto do componente de item expansível, o ícone precisa ter os seguintes valores de padding:

• Padding superior: 8 dp
• Padding inferior: 16 dp