구분선

구분선은 목록이나 다른 항목에서의 항목을 구분하는 얇은 선입니다. 살펴보겠습니다 HorizontalDivider를 사용하여 앱에 구분선을 구현할 수 있습니다. VerticalDivider 컴포저블 함수를 사용합니다.

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")
    }
}
Divider.kt

이 구현은 두 텍스트 구성요소 사이에 얇은 가로 선을 렌더링합니다.

'목록의 첫 번째 항목'이라는 2개의 텍스트 항목이 표시된 Android 앱 화면 '목록의 두 번째 항목'을 입력하면 얇은 가로선으로 구분됩니다.
그림 1. 두 개의 텍스트 구성요소를 구분하는 가로 구분선

세로 구분선 예

다음 예는 VerticalDivider 구성요소. color 매개변수를 사용하여 맞춤 URL을 제공합니다. 선 색상:

@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")
    }
}
Divider.kt

이 구현은 두 텍스트 구성요소 사이에 가는 수직선을 렌더링합니다.

'행의 첫 번째 항목'이라는 2개의 텍스트 항목이 표시된 Android 앱 화면 '행의 두 번째 항목'을 입력하면 얇은 수직선으로 구분됩니다.
그림 2. 두 개의 텍스트 구성요소를 구분하는 세로 구분선

추가 리소스