Jetpack Compose LazyHorizontalStaggeredGrid in Foundation

Horizontal staggered grid layout that composes and lays out only items currently visible on screen.

Sample:

Overloads

LazyHorizontalStaggeredGrid

@Composable
fun LazyHorizontalStaggeredGrid(
    rows: StaggeredGridCells,
    modifier: Modifier = Modifier,
    state: LazyStaggeredGridState = rememberLazyStaggeredGridState(),
    contentPadding: PaddingValues = PaddingValues(0.dp),
    reverseLayout: Boolean = false,
    verticalArrangement: Arrangement.Vertical = Arrangement.spacedBy(0.dp),
    horizontalItemSpacing: Dp = 0.dp,
    flingBehavior: FlingBehavior = ScrollableDefaults.flingBehavior(),
    userScrollEnabled: Boolean = true,
    content: LazyStaggeredGridScope.() -> Unit
)

Parameters

Name	Description
`rows`	description of the size and number of staggered grid columns.
`modifier`	modifier to apply to the layout.
`state`	state object that can be used to control and observe staggered grid state.
`contentPadding`	padding around the content.
`reverseLayout`	reverse the direction of scrolling and layout. When `true`, items are laid out in the reverse order and LazyStaggeredGridState.firstVisibleItemIndex == 0 means that grid is scrolled to the end.
`verticalArrangement`	arrangement specifying vertical spacing between items. The item arrangement specifics are ignored for now.
`horizontalItemSpacing`	horizontal spacing between items.
`flingBehavior`	logic responsible for handling fling.
`userScrollEnabled`	whether scroll with gestures or accessibility actions are allowed. It is still possible to scroll programmatically through state when userScrollEnabled is set to false
`content`	a lambda describing the staggered grid content. Inside this block you can use LazyStaggeredGridScope.items to present list of items or LazyStaggeredGridScope.item for a single one