分隔线是细线,用于分隔列表或其他容器中的项。您可以使用 HorizontalDivider
和 VerticalDivider
可组合项在应用中实现分隔线。
HorizontalDivider
:分隔同一列中的多项。VerticalDivider
:用于分隔一行中的多项内容。
API Surface
这两个组件都提供了用于修改其外观的参数:
thickness
:使用此参数指定分隔线的粗细。color
:使用此参数指定分隔线的颜色。
水平分隔线示例
以下示例演示了 HorizontalDivider
组件的实现。它使用 thickness
参数来控制线条的高度:
@Composable fun HorizontalDividerExample() { Column( verticalArrangement = Arrangement.spacedBy(8.dp), ) { Text("First item in list") HorizontalDivider(thickness = 2.dp) Text("Second item in list") } }
此实现会在两个文本组件之间渲染一条细横线:
![一个 Android 应用屏幕,显示了“列表中的第一项”和“列表中的第二项”,以一条细水平线分隔。](https://developer.android.google.cn/static/develop/ui/compose/images/components/divider-horizontal.png?hl=zh-cn)
垂直分隔线示例
以下示例演示了 VerticalDivider
组件的实现。它使用 color
参数为线条提供自定义颜色:
@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") } }
此实现会在两个文本组件之间渲染一条细竖线:
![一个 Android 应用界面,屏幕上显示了“第一项内容”和“第二行内容”两个文本项,这些内容之间以细竖线分隔。](https://developer.android.google.cn/static/develop/ui/compose/images/components/divider-vertical.png?hl=zh-cn)