Divisores são linhas finas que separam itens em listas ou outros
contêineres. Você pode implementar divisores no seu app usando os elementos combináveis HorizontalDivider
e VerticalDivider
.
HorizontalDivider
: separe os itens em uma coluna.VerticalDivider
: separe os itens em uma linha.
Plataforma da API
Os dois componentes fornecem parâmetros para modificar a aparência deles:
thickness
: use esse parâmetro para especificar a espessura da linha divisor.color
: use esse parâmetro para especificar a cor da linha divisória.
Exemplo de divisor horizontal
O exemplo abaixo demonstra uma implementação do componente
HorizontalDivider
. Ele usa o parâmetro thickness
para controlar a
altura da linha:
@Composable fun HorizontalDividerExample() { Column( verticalArrangement = Arrangement.spacedBy(8.dp), ) { Text("First item in list") HorizontalDivider(thickness = 2.dp) Text("Second item in list") } }
Essa implementação renderiza uma linha horizontal fina entre dois componentes de texto:
![A tela de um app Android mostrando dois itens de texto, "Primeiro item na lista" e "Segundo item na lista", separados por uma linha horizontal fina.](https://developer.android.com/static/develop/ui/compose/images/components/divider-horizontal.png?hl=pt-br)
Exemplo de divisor vertical
O exemplo abaixo demonstra uma implementação do componente
VerticalDivider
. Ele usa o parâmetro color
para fornecer uma cor
personalizada para a linha:
@Composable fun VerticalDividerExample() { Row( modifier = Modifier .fillMaxWidth() .height(IntrinsicSize.Min), horizontalArrangement = Arrangement.SpaceEvenly ) { Text("First item in row") VerticalDivider(color = MaterialTheme.colorScheme.secondary) Text("Second item in row") } }
Essa implementação renderiza uma linha vertical fina entre dois componentes de texto:
![A tela de um app Android mostrando dois itens de texto, "Primeiro item na linha" e "Segundo item na linha", separados por uma linha vertical fina.](https://developer.android.com/static/develop/ui/compose/images/components/divider-vertical.png?hl=pt-br)