分隔符

分隔符分隔符是细线,用于分隔列表或其他容器中的项目。您可以使用HorizontalDividerVerticalDivider组合项在您的应用中实现分隔符。

API 表面

这两个组件都提供用于修改其外观的参数

  • 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")
    }
}

此实现会在两个文本组件之间呈现一条细水平线。

An Android app screen displaying two text items, 'First item in list' and 'Second item in list,' separated by a thin horizontal line.
图 1. 分隔两个文本组件的水平分隔符。

垂直分隔符示例

以下示例演示了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")
    }
}

此实现会在两个文本组件之间呈现一条细垂直线。

An Android app screen displaying two text items, 'First item in row' and 'Second item in row,' separated by a thin vertical line.
图 2. 分隔两个文本组件的垂直分隔符。

其他资源