Jetpack Compose - List View & Divider

Jetpack Compose Lazy Column with Divider in Android

A divider is a thin line that groups content in lists and layouts.

This example demonstrates how to make a Jetpack Compose RecyclerView (LazyColumn) with Material Design Divider.


LazyColumn {
items(25) {

// * Card
Card(
modifier = Modifier
.fillMaxWidth()
,
content = {
Text("Card ", modifier = Modifier.padding(16.dp),style = MaterialTheme.typography.labelLarge)
}
)

// * Dividers
ListDivider()

}
}

/**
* Full-width divider with padding
*/

@Composable
fun ListDivider() {
Divider(
modifier = Modifier.padding(horizontal = 14.dp),
color = MaterialTheme.colors.onSurface.copy(alpha = 0.08f)
)
}

..

Comments