{% setvar book_path %}/reference/androidx/_book.yaml{% endsetvar %} {% include "_shared/_reference-head-tags.html" %}

LazyGridDslKt

public final class LazyGridDslKt


Summary

Public methods

static final void
@Composable
LazyHorizontalGrid(
    @NonNull GridCells rows,
    @NonNull Modifier modifier,
    @NonNull LazyGridState state,
    @NonNull PaddingValues contentPadding,
    boolean reverseLayout,
    @NonNull Arrangement.Horizontal horizontalArrangement,
    @NonNull Arrangement.Vertical verticalArrangement,
    @NonNull FlingBehavior flingBehavior,
    boolean userScrollEnabled,
    @ExtensionFunctionType @NonNull Function1<@NonNull LazyGridScopeUnit> content
)

A lazy horizontal grid layout.

static final void
@Composable
LazyVerticalGrid(
    @NonNull GridCells columns,
    @NonNull Modifier modifier,
    @NonNull LazyGridState state,
    @NonNull PaddingValues contentPadding,
    boolean reverseLayout,
    @NonNull Arrangement.Vertical verticalArrangement,
    @NonNull Arrangement.Horizontal horizontalArrangement,
    @NonNull FlingBehavior flingBehavior,
    boolean userScrollEnabled,
    @ExtensionFunctionType @NonNull Function1<@NonNull LazyGridScopeUnit> content
)

A lazy vertical grid layout.

static final void
<T extends Object> items(
    @NonNull LazyGridScope receiver,
    @NonNull T[] items,
    Function1<@NonNull item, @NonNull Object> key,
    @ExtensionFunctionType Function2<@NonNull LazyGridItemSpanScope, @NonNull item, @NonNull GridItemSpan> span,
    @NonNull Function1<@NonNull item, Object> contentType,
    @Composable @ExtensionFunctionType @NonNull Function2<@NonNull LazyGridItemScope, @NonNull item, Unit> itemContent
)

Adds an array of items.

static final void
<T extends Object> items(
    @NonNull LazyGridScope receiver,
    @NonNull List<@NonNull T> items,
    Function1<@NonNull item, @NonNull Object> key,
    @ExtensionFunctionType Function2<@NonNull LazyGridItemSpanScope, @NonNull item, @NonNull GridItemSpan> span,
    @NonNull Function1<@NonNull item, Object> contentType,
    @Composable @ExtensionFunctionType @NonNull Function2<@NonNull LazyGridItemScope, @NonNull item, Unit> itemContent
)

Adds a list of items.

static final void
<T extends Object> itemsIndexed(
    @NonNull LazyGridScope receiver,
    @NonNull T[] items,
    Function2<@NonNull Integer, @NonNull item, @NonNull Object> key,
    @ExtensionFunctionType Function3<@NonNull LazyGridItemSpanScope, @NonNull Integer, @NonNull item, @NonNull GridItemSpan> span,
    @NonNull Function2<@NonNull Integer, @NonNull item, Object> contentType,
    @Composable @ExtensionFunctionType @NonNull Function3<@NonNull LazyGridItemScope, @NonNull Integer, @NonNull item, Unit> itemContent
)

Adds an array of items where the content of an item is aware of its index.

static final void
<T extends Object> itemsIndexed(
    @NonNull LazyGridScope receiver,
    @NonNull List<@NonNull T> items,
    Function2<@NonNull Integer, @NonNull item, @NonNull Object> key,
    @ExtensionFunctionType Function3<@NonNull LazyGridItemSpanScope, @NonNull Integer, @NonNull item, @NonNull GridItemSpan> span,
    @NonNull Function2<@NonNull Integer, @NonNull item, Object> contentType,
    @Composable @ExtensionFunctionType @NonNull Function3<@NonNull LazyGridItemScope, @NonNull Integer, @NonNull item, Unit> itemContent
)

Adds a list of items where the content of an item is aware of its index.

Public methods

LazyHorizontalGrid

@Composable
public static final void LazyHorizontalGrid(
    @NonNull GridCells rows,
    @NonNull Modifier modifier,
    @NonNull LazyGridState state,
    @NonNull PaddingValues contentPadding,
    boolean reverseLayout,
    @NonNull Arrangement.Horizontal horizontalArrangement,
    @NonNull Arrangement.Vertical verticalArrangement,
    @NonNull FlingBehavior flingBehavior,
    boolean userScrollEnabled,
    @ExtensionFunctionType @NonNull Function1<@NonNull LazyGridScopeUnit> content
)

A lazy horizontal grid layout. It composes only visible columns of the grid.

Sample:

import androidx.compose.foundation.border
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.width
import androidx.compose.foundation.layout.wrapContentSize
import androidx.compose.foundation.lazy.grid.GridCells
import androidx.compose.foundation.lazy.grid.LazyHorizontalGrid
import androidx.compose.foundation.lazy.grid.items
import androidx.compose.foundation.lazy.grid.itemsIndexed
import androidx.compose.material.Text
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.unit.dp

val itemsList = (0..5).toList()
val itemsIndexedList = listOf("A", "B", "C")

val itemModifier = Modifier.border(1.dp, Color.Blue).width(80.dp).wrapContentSize()

LazyHorizontalGrid(
    rows = GridCells.Fixed(3),
    horizontalArrangement = Arrangement.spacedBy(16.dp),
    verticalArrangement = Arrangement.spacedBy(16.dp)
) {
    items(itemsList) {
        Text("Item is $it", itemModifier)
    }

    item {
        Text("Single item", itemModifier)
    }

    itemsIndexed(itemsIndexedList) { index, item ->
        Text("Item at index $index is $item", itemModifier)
    }
}

Sample with custom item spans:

import androidx.compose.foundation.border
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.width
import androidx.compose.foundation.layout.wrapContentSize
import androidx.compose.foundation.lazy.grid.GridCells
import androidx.compose.foundation.lazy.grid.GridItemSpan
import androidx.compose.foundation.lazy.grid.LazyHorizontalGrid
import androidx.compose.foundation.lazy.grid.items
import androidx.compose.material.Text
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.unit.dp

val sections = (0 until 25).toList().chunked(5)
LazyHorizontalGrid(
    rows = GridCells.Fixed(3),
    horizontalArrangement = Arrangement.spacedBy(16.dp),
    verticalArrangement = Arrangement.spacedBy(16.dp)
) {
    sections.forEachIndexed { index, items ->
        item(span = { GridItemSpan(maxLineSpan) }) {
            Text(
                "This is section $index",
                Modifier.border(1.dp, Color.Gray).width(80.dp).wrapContentSize()
            )
        }
        items(
            items,
            // not required as it is the default
            span = { GridItemSpan(1) }
        ) {
            Text(
                "Item $it",
                Modifier.border(1.dp, Color.Blue).width(80.dp).wrapContentSize()
            )
        }
    }
}
Parameters
@NonNull GridCells rows

a class describing how cells form rows, see GridCells doc for more information

@NonNull Modifier modifier

the modifier to apply to this layout

@NonNull LazyGridState state

the state object to be used to control or observe the list's state

@NonNull PaddingValues contentPadding

specify a padding around the whole content

boolean reverseLayout

reverse the direction of scrolling and layout. When true, items are laid out in the reverse order and LazyGridState.firstVisibleItemIndex == 0 means that grid is scrolled to the end. Note that reverseLayout does not change the behavior of horizontalArrangement, e.g. with 123### becomes 321###.

@NonNull Arrangement.Horizontal horizontalArrangement

The horizontal arrangement of the layout's children

@NonNull Arrangement.Vertical verticalArrangement

The vertical arrangement of the layout's children

@NonNull FlingBehavior flingBehavior

logic describing fling behavior

boolean userScrollEnabled

whether the scrolling via the user gestures or accessibility actions is allowed. You can still scroll programmatically using the state even when it is disabled.

@ExtensionFunctionType @NonNull Function1<@NonNull LazyGridScopeUnit> content

the LazyGridScope which describes the content

LazyVerticalGrid

@Composable
public static final void LazyVerticalGrid(
    @NonNull GridCells columns,
    @NonNull Modifier modifier,
    @NonNull LazyGridState state,
    @NonNull PaddingValues contentPadding,
    boolean reverseLayout,
    @NonNull Arrangement.Vertical verticalArrangement,
    @NonNull Arrangement.Horizontal horizontalArrangement,
    @NonNull FlingBehavior flingBehavior,
    boolean userScrollEnabled,
    @ExtensionFunctionType @NonNull Function1<@NonNull LazyGridScopeUnit> content
)

A lazy vertical grid layout. It composes only visible rows of the grid.

Sample:

import androidx.compose.foundation.border
import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.wrapContentSize
import androidx.compose.foundation.lazy.grid.GridCells
import androidx.compose.foundation.lazy.grid.LazyVerticalGrid
import androidx.compose.foundation.lazy.grid.items
import androidx.compose.foundation.lazy.grid.itemsIndexed
import androidx.compose.material.Text
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.unit.dp

val itemsList = (0..5).toList()
val itemsIndexedList = listOf("A", "B", "C")

val itemModifier = Modifier.border(1.dp, Color.Blue).height(80.dp).wrapContentSize()

LazyVerticalGrid(
    columns = GridCells.Fixed(3)
) {
    items(itemsList) {
        Text("Item is $it", itemModifier)
    }
    item {
        Text("Single item", itemModifier)
    }
    itemsIndexed(itemsIndexedList) { index, item ->
        Text("Item at index $index is $item", itemModifier)
    }
}

Sample with custom item spans:

import androidx.compose.foundation.border
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.wrapContentSize
import androidx.compose.foundation.lazy.grid.GridCells
import androidx.compose.foundation.lazy.grid.GridItemSpan
import androidx.compose.foundation.lazy.grid.LazyVerticalGrid
import androidx.compose.foundation.lazy.grid.items
import androidx.compose.material.Text
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.unit.dp

val sections = (0 until 25).toList().chunked(5)
LazyVerticalGrid(
    columns = GridCells.Fixed(3),
    horizontalArrangement = Arrangement.spacedBy(16.dp),
    verticalArrangement = Arrangement.spacedBy(16.dp)
) {
    sections.forEachIndexed { index, items ->
        item(span = { GridItemSpan(maxLineSpan) }) {
            Text(
                "This is section $index",
                Modifier.border(1.dp, Color.Gray).height(80.dp).wrapContentSize()
            )
        }
        items(
            items,
            // not required as it is the default
            span = { GridItemSpan(1) }
        ) {
            Text(
                "Item $it",
                Modifier.border(1.dp, Color.Blue).height(80.dp).wrapContentSize()
            )
        }
    }
}
Parameters
@NonNull GridCells columns

describes the count and the size of the grid's columns, see GridCells doc for more information

@NonNull Modifier modifier

the modifier to apply to this layout

@NonNull LazyGridState state

the state object to be used to control or observe the list's state

@NonNull PaddingValues contentPadding

specify a padding around the whole content

boolean reverseLayout

reverse the direction of scrolling and layout. When true, items will be laid out in the reverse order and LazyGridState.firstVisibleItemIndex == 0 means that grid is scrolled to the bottom. Note that reverseLayout does not change the behavior of verticalArrangement, e.g. with Arrangement.Top (top) 123### (bottom) becomes (top) 321### (bottom).

@NonNull Arrangement.Vertical verticalArrangement

The vertical arrangement of the layout's children

@NonNull Arrangement.Horizontal horizontalArrangement

The horizontal arrangement of the layout's children

@NonNull FlingBehavior flingBehavior

logic describing fling behavior

boolean userScrollEnabled

whether the scrolling via the user gestures or accessibility actions is allowed. You can still scroll programmatically using the state even when it is disabled.

@ExtensionFunctionType @NonNull Function1<@NonNull LazyGridScopeUnit> content

the LazyGridScope which describes the content

items

public static final void <T extends Object> items(
    @NonNull LazyGridScope receiver,
    @NonNull T[] items,
    Function1<@NonNull item, @NonNull Object> key,
    @ExtensionFunctionType Function2<@NonNull LazyGridItemSpanScope, @NonNull item, @NonNull GridItemSpan> span,
    @NonNull Function1<@NonNull item, Object> contentType,
    @Composable @ExtensionFunctionType @NonNull Function2<@NonNull LazyGridItemScope, @NonNull item, Unit> itemContent
)

Adds an array of items.

Parameters
@NonNull T[] items

the data array

Function1<@NonNull item, @NonNull Object> key

a factory of stable and unique keys representing the item. Using the same key for multiple items in the grid is not allowed. Type of the key should be saveable via Bundle on Android. If null is passed the position in the grid will represent the key. When you specify the key the scroll position will be maintained based on the key, which means if you add/remove items before the current visible item the item with the given key will be kept as the first visible one.

@ExtensionFunctionType Function2<@NonNull LazyGridItemSpanScope, @NonNull item, @NonNull GridItemSpan> span

define custom spans for the items. Default is 1x1. It is good practice to leave it null when this matches the intended behavior, as providing a custom implementation impacts performance

@NonNull Function1<@NonNull item, Object> contentType

a factory of the content types for the item. The item compositions of the same type could be reused more efficiently. Note that null is a valid type and items of such type will be considered compatible.

@Composable @ExtensionFunctionType @NonNull Function2<@NonNull LazyGridItemScope, @NonNull item, Unit> itemContent

the content displayed by a single item

items

public static final void <T extends Object> items(
    @NonNull LazyGridScope receiver,
    @NonNull List<@NonNull T> items,
    Function1<@NonNull item, @NonNull Object> key,
    @ExtensionFunctionType Function2<@NonNull LazyGridItemSpanScope, @NonNull item, @NonNull GridItemSpan> span,
    @NonNull Function1<@NonNull item, Object> contentType,
    @Composable @ExtensionFunctionType @NonNull Function2<@NonNull LazyGridItemScope, @NonNull item, Unit> itemContent
)

Adds a list of items.

Parameters
@NonNull List<@NonNull T> items

the data list

Function1<@NonNull item, @NonNull Object> key

a factory of stable and unique keys representing the item. Using the same key for multiple items in the grid is not allowed. Type of the key should be saveable via Bundle on Android. If null is passed the position in the grid will represent the key. When you specify the key the scroll position will be maintained based on the key, which means if you add/remove items before the current visible item the item with the given key will be kept as the first visible one.

@ExtensionFunctionType Function2<@NonNull LazyGridItemSpanScope, @NonNull item, @NonNull GridItemSpan> span

define custom spans for the items. Default is 1x1. It is good practice to leave it null when this matches the intended behavior, as providing a custom implementation impacts performance

@NonNull Function1<@NonNull item, Object> contentType

a factory of the content types for the item. The item compositions of the same type could be reused more efficiently. Note that null is a valid type and items of such type will be considered compatible.

@Composable @ExtensionFunctionType @NonNull Function2<@NonNull LazyGridItemScope, @NonNull item, Unit> itemContent

the content displayed by a single item

itemsIndexed

public static final void <T extends Object> itemsIndexed(
    @NonNull LazyGridScope receiver,
    @NonNull T[] items,
    Function2<@NonNull Integer, @NonNull item, @NonNull Object> key,
    @ExtensionFunctionType Function3<@NonNull LazyGridItemSpanScope, @NonNull Integer, @NonNull item, @NonNull GridItemSpan> span,
    @NonNull Function2<@NonNull Integer, @NonNull item, Object> contentType,
    @Composable @ExtensionFunctionType @NonNull Function3<@NonNull LazyGridItemScope, @NonNull Integer, @NonNull item, Unit> itemContent
)

Adds an array of items where the content of an item is aware of its index.

Parameters
@NonNull T[] items

the data array

Function2<@NonNull Integer, @NonNull item, @NonNull Object> key

a factory of stable and unique keys representing the item. Using the same key for multiple items in the grid is not allowed. Type of the key should be saveable via Bundle on Android. If null is passed the position in the grid will represent the key. When you specify the key the scroll position will be maintained based on the key, which means if you add/remove items before the current visible item the item with the given key will be kept as the first visible one.

@ExtensionFunctionType Function3<@NonNull LazyGridItemSpanScope, @NonNull Integer, @NonNull item, @NonNull GridItemSpan> span

define custom spans for the items. Default is 1x1. It is good practice to leave it null when this matches the intended behavior, as providing a custom implementation impacts performance

@NonNull Function2<@NonNull Integer, @NonNull item, Object> contentType

a factory of the content types for the item. The item compositions of the same type could be reused more efficiently. Note that null is a valid type and items of such type will be considered compatible.

@Composable @ExtensionFunctionType @NonNull Function3<@NonNull LazyGridItemScope, @NonNull Integer, @NonNull item, Unit> itemContent

the content displayed by a single item

itemsIndexed

public static final void <T extends Object> itemsIndexed(
    @NonNull LazyGridScope receiver,
    @NonNull List<@NonNull T> items,
    Function2<@NonNull Integer, @NonNull item, @NonNull Object> key,
    @ExtensionFunctionType Function3<@NonNull LazyGridItemSpanScope, @NonNull Integer, @NonNull item, @NonNull GridItemSpan> span,
    @NonNull Function2<@NonNull Integer, @NonNull item, Object> contentType,
    @Composable @ExtensionFunctionType @NonNull Function3<@NonNull LazyGridItemScope, @NonNull Integer, @NonNull item, Unit> itemContent
)

Adds a list of items where the content of an item is aware of its index.

Parameters
@NonNull List<@NonNull T> items

the data list

Function2<@NonNull Integer, @NonNull item, @NonNull Object> key

a factory of stable and unique keys representing the item. Using the same key for multiple items in the grid is not allowed. Type of the key should be saveable via Bundle on Android. If null is passed the position in the grid will represent the key. When you specify the key the scroll position will be maintained based on the key, which means if you add/remove items before the current visible item the item with the given key will be kept as the first visible one.

@ExtensionFunctionType Function3<@NonNull LazyGridItemSpanScope, @NonNull Integer, @NonNull item, @NonNull GridItemSpan> span

define custom spans for the items. Default is 1x1. It is good practice to leave it null when this matches the intended behavior, as providing a custom implementation impacts performance

@NonNull Function2<@NonNull Integer, @NonNull item, Object> contentType

a factory of the content types for the item. The item compositions of the same type could be reused more efficiently. Note that null is a valid type and items of such type will be considered compatible.

@Composable @ExtensionFunctionType @NonNull Function3<@NonNull LazyGridItemScope, @NonNull Integer, @NonNull item, Unit> itemContent

the content displayed by a single item