I divisori sono linee sottili che separano gli elementi in elenchi o altri
contenitori. Puoi implementare i divisori nella tua app utilizzando i composable HorizontalDivider
e VerticalDivider.
HorizontalDivider: separa gli elementi in una colonna.VerticalDivider: separa gli elementi in una riga.
Piattaforma API
Entrambi i componenti forniscono parametri per modificare il loro aspetto:
thickness: utilizza questo parametro per specificare lo spessore della linea di divisione.color: utilizza questo parametro per specificare il colore della linea di separazione.
Esempio di divisore orizzontale
Il seguente esempio mostra un'implementazione del componente
HorizontalDivider. Utilizza il parametro thickness per controllare
l'altezza della linea:
@Composable fun HorizontalDividerExample() { Column( verticalArrangement = Arrangement.spacedBy(8.dp), ) { Text("First item in list") HorizontalDivider(thickness = 2.dp) Text("Second item in list") } }
Questa implementazione esegue il rendering di una sottile linea orizzontale tra due componenti di testo:
Esempio di divisore verticale
Il seguente esempio mostra un'implementazione del componente
VerticalDivider. Utilizza il parametro color per fornire un colore personalizzato
per la linea:
@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") } }
Questa implementazione esegue il rendering di una sottile linea verticale tra due componenti di testo: