LazyRow - Jetpack Compose

June 6th, 2022

For this tutorial, we will be looking at another Lazy Composable and create a horizontal scrollable list inside a LazyRow

In my previous post, we explored an example of LazyColumn. In this post let’s look at LazyRow.

A LazyRow is a horizontal scrolling list that only composes and lays out the currently visible items.

Lets Look at Some Code


Here I have created a composable that produces a horizontal scrollable list of 100 items, contained in a LazyRow. 

@Composable
fun scrollList() {
    LazyRow (
        modifier = Modifier
            .fillMaxSize()
            .background(colorResource(id = R.color.black))
            .wrapContentSize(Alignment.Center))
    {
        items(100) {
            Text(
                text = "Item $it",
                fontWeight = FontWeight.Bold,
                color = Color.White,
                textAlign = TextAlign.Center,
                fontSize = 25.sp,
                modifier = Modifier
                    .fillParentMaxWidth()
                    .padding(horizontal = 24.dp),
            )
        }
    }
}



Let's See It in Action



Russell Morley

Test Lead | Software Developer In Test | Automation Enthusiast