LazyRow in Jetpack Compose — what it is, properties and how it works

What is LazyRow in Jetpack Compose

LazyRow — is a composable function implementing a horizontal scrollable list with lazy loading of elements. Unlike Row, which renders all child elements simultaneously, LazyRow creates only elements visible in the viewport.

LazyRow works on the same principle as LazyColumn, but arranges elements horizontally. When scrolling left or right, elements that exit the viewport are reused to display new ones. This is critically important for galleries with many images or long category lists.

According to Android Developers Blog, 2024, LazyRow uses the same LazyList architecture as LazyColumn, including LazyListState, a reuse mechanism via Pool, and support for different element types. Maximum efficiency is achieved with fixed element height.

Basic LazyRow signature

LazyRow accepts parameters modifier, state, contentPadding, reverseLayout, horizontalArrangement and verticalAlignment. Content is defined via DSL functions items and item, similar to LazyColumn.

@Composable
fun SimpleLazyRow() {
    val items = (1..50).toList()
    LazyRow(
        modifier = Modifier.fillMaxWidth().height(100.dp),
        horizontalArrangement = Arrangement.spacedBy(8.dp),
        contentPadding = PaddingValues(start = 16.dp, end = 16.dp)
    ) {
        items(items) { item ->
            Box(
                modifier = Modifier.size(80.dp).background(Color.Gray)
            ) {
                Text(text = "$item", modifier = Modifier.align(Alignment.Center))
            }
        }
    }
}

LazyRow properties: horizontalArrangement and contentPadding

horizontalArrangement manages the distribution of elements along the horizontal axis inside LazyRow. The same Arrangement values are available as in Row: Start, Center, End, SpaceBetween, SpaceEvenly, SpaceAround and spacedBy with custom spacing.

contentPadding adds padding at the edges of the LazyRow container. Unlike Modifier.padding, contentPadding is taken into account during scrolling: the first element will have padding from the left edge, the last — from the right edge. According to Material Design Guidelines, 2025, contentPadding is required for carousels and galleries so that the first and last elements do not stick to the screen edge.

verticalAlignment aligns elements vertically inside LazyRow. By default, Alignment.Top is used. To center elements of different heights, use Alignment.CenterVertically, which is useful for carousels with images of different aspect ratios.

LazyRow parameters table

Horizontal scroll management with LazyListState

LazyListState for LazyRow works identically to LazyColumn: it tracks the first visible element, offset and overall scroll position. The state is created via rememberLazyListState() and passed to the state parameter.

Programmatic scroll control of LazyRow is done with the same methods: animateScrollToItem for smooth animation and scrollToItem for instant scrolling. Both are called inside a coroutine. This is useful for carousels with "Left/Right" buttons or for automatic scrolling.

According to Android Developers, 2024, LazyRow also supports SnapFlingBehavior — behavior for fast scrolling that stops at the nearest element rather than between elements. This creates a "snap" effect familiar to carousels and galleries.

@Composable
fun CarouselWithSnap() {
    val listState = rememberLazyListState()
    val scope = rememberCoroutineScope()
    val items = listOf("A", "B", "C", "D", "E")

    Column {
        LazyRow(
            state = listState,
            flingBehavior = SnapFlingBehavior(listState),
            horizontalArrangement = Arrangement.spacedBy(8.dp)
        ) {
            items(items) { item ->
                Card(modifier = Modifier.width(150.dp)) {
                    Text(text = item, modifier = Modifier.padding(16.dp))
                }
            }
        }

        Row(modifier = Modifier.fillMaxWidth()) {
            Button(onClick = {
                scope.launch {
                    listState.animateScrollToItem(0)
                }
            }) { Text("To start") }
        }
    }
}

Use cases of LazyRow in interfaces

The first example — LazyRow for an image gallery with previews. Each element is a Box with an image and a caption. LazyRow efficiently handles dozens and hundreds of images, loading only visible ones.

@Composable
fun ImageGallery(images: List<String>) {
    LazyRow(
        contentPadding = PaddingValues(start = 16.dp, end = 16.dp),
        horizontalArrangement = Arrangement.spacedBy(12.dp)
    ) {
        items(images, key = { it }) { url ->
            AsyncImage(
                model = url,
                contentDescription = "Image",
                modifier = Modifier.size(120.dp)
            )
        }
    }
}

The second example — LazyRow for a category list with icons. Categories are displayed as chips, and the user can scroll them horizontally. LazyRow with spacedBy and contentPadding creates spacing between categories and at the edges.

@Composable
fun CategoryChips(categories: List<String>) {
    LazyRow(
        contentPadding = PaddingValues(horizontal = 16.dp),
        horizontalArrangement = Arrangement.spacedBy(8.dp)
    ) {
        items(categories, key = { it }) { category ->
            AssistChip(
                onClick = {},
                label = { Text(category) }
            )
        }
    }
}

LazyRow vs Row: when to choose which

The choice between LazyRow and Row depends on the number of elements. Row is suitable for 5–10 elements that are always visible on screen. LazyRow is essential when there are many elements or their count is dynamic.

Row renders all elements at once, causing delays with a large number of elements. LazyRow renders only visible ones, making it preferable for scrollable lists. According to Android Developers Blog, 2024, the threshold is approximately 10 elements: if there are more elements, use LazyRow.

LazyRow also supports animations, SnapFlingBehavior and grouping via separators, making it more flexible for complex interfaces. Row is simpler and does not require LazyListState, but is not optimized for long lists.

• Row — for 5–10 static elements without scrolling
• LazyRow — for 10+ elements with horizontal scrolling
• LazyRow — for carousels, galleries, dynamic lists