Kotlin with Jetpack Compose -List View
3 min readMay 20, 2023
A List View is a basic component that we need in mobile development. In order to create a list view that scroll vertically, we can use LazyColumn
with Jetpack compose. We can use a LazyRow
to create a horizontal item list view.
When displaying a large number of items with an unknown length, using Column or Row will cause performance issues.
Compose provides a set of components which only compose and lay out items which are visible in the component’s viewport. These components include LazyColumn and LazyRow.
Properties of a lazy column.
@Composable
fun LazyColumn(
modifier: Modifier = Modifier,
state: LazyListState = rememberLazyListState(),
contentPadding: PaddingValues = PaddingValues(0.dp),
reverseLayout: Boolean = false,
verticalArrangement: Arrangement.Vertical =
if (!reverseLayout) Arrangement.Top else Arrangement.Bottom,
horizontalAlignment: Alignment.Horizontal = Alignment.Start,
flingBehavior: FlingBehavior = ScrollableDefaults.flingBehavior(),
userScrollEnabled: Boolean = true,
content: LazyListScope.() -> Unit
) {
Lets see an example.
Creating a Data class and a list of data
data class ListItem(
val id: Int,
val title: String,
val subtitle: String,
val…