LazyStaggeredGridItemScope

Receiver scope for itemContent in LazyStaggeredGridScope.item

Summary

Public functions
Modifier
Modifier.animateItem(
    fadeInSpec: FiniteAnimationSpec<Float>?,
    placementSpec: FiniteAnimationSpec<IntOffset>?,
    fadeOutSpec: FiniteAnimationSpec<Float>?
)

This modifier animates the item appearance (fade in), disappearance (fade out) and placement changes (such as an item reordering).
Cmn
open Modifier

This function is deprecated. Use Modifier.animateItem() instead
Cmn

Public functions

animateItem

Cmn 
fun Modifier.animateItem(
    fadeInSpec: FiniteAnimationSpec<Float>? = spring(stiffness = Spring.StiffnessMediumLow),
    placementSpec: FiniteAnimationSpec<IntOffset>? = spring(
            stiffness = Spring.StiffnessMediumLow,
            visibilityThreshold = IntOffset.VisibilityThreshold
        ),
    fadeOutSpec: FiniteAnimationSpec<Float>? = spring(stiffness = Spring.StiffnessMediumLow)
): Modifier

This modifier animates the item appearance (fade in), disappearance (fade out) and placement changes (such as an item reordering).

You should also provide a key via LazyStaggeredGridScope.item/ LazyStaggeredGridScope.items for this modifier to enable animations.

import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.lazy.staggeredgrid.LazyVerticalStaggeredGrid
import androidx.compose.foundation.lazy.staggeredgrid.StaggeredGridCells
import androidx.compose.foundation.lazy.staggeredgrid.items
import androidx.compose.material.Button
import androidx.compose.material.Text
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.remember
import androidx.compose.ui.Modifier

var list by remember { mutableStateOf(listOf("A", "B", "C")) }
Column {
    Button(onClick = { list = list + "D" }) {
        Text("Add new item")
    }
    Button(onClick = { list = list.shuffled() }) {
        Text("Shuffle")
    }
    LazyVerticalStaggeredGrid(columns = StaggeredGridCells.Fixed(1)) {
        items(list, key = { it }) {
            Text("Item $it", Modifier.animateItem())
        }
    }
}
Parameters
fadeInSpec: FiniteAnimationSpec<Float>? = spring(stiffness = Spring.StiffnessMediumLow)

an animation specs to use for animating the item appearance. When null is provided the item will be appearing without animations.
placementSpec: FiniteAnimationSpec<IntOffset>? = spring( stiffness = Spring.StiffnessMediumLow, visibilityThreshold = IntOffset.VisibilityThreshold )

an animation specs that will be used to animate the item placement. Aside from item reordering all other position changes caused by events like arrangement or alignment changes will also be animated. When null is provided no animations will happen.
fadeOutSpec: FiniteAnimationSpec<Float>? = spring(stiffness = Spring.StiffnessMediumLow)

an animation specs to use for animating the item disappearance. When null is provided the item will be disappearance without animations.

animateItemPlacement

Cmn 
@ExperimentalFoundationApi
open fun Modifier.animateItemPlacement(
    animationSpec: FiniteAnimationSpec<IntOffset> = spring(
            stiffness = Spring.StiffnessMediumLow,
            visibilityThreshold = IntOffset.VisibilityThreshold
        )
): Modifier

This modifier animates the item placement within the grid.

When you scroll backward staggered grids could move already visible items in order to correct the accumulated errors in previous item size estimations. This modifier can animate such moves.

Aside from that when you provide a key via LazyStaggeredGridScope.item / LazyStaggeredGridScope.items this modifier will enable item reordering animations.

Parameters
animationSpec: FiniteAnimationSpec<IntOffset> = spring( stiffness = Spring.StiffnessMediumLow, visibilityThreshold = IntOffset.VisibilityThreshold )

a finite animation that will be used to animate the item placement.