shrinkVertically

Function

Common

public fun shrinkVertically(
    animationSpec: FiniteAnimationSpec<IntSize> =
        spring(
            stiffness = Spring.StiffnessMediumLow,
            visibilityThreshold = IntSize.VisibilityThreshold,
        ),
    shrinkTowards: Alignment.Vertical = Alignment.Bottom,
    clip: Boolean = true,
    targetHeight: (fullHeight: Int) -> Int = { 0 },
): ExitTransition

This shrinks the clip bounds of the disappearing content vertically, from the full height to the height returned from targetHeight. shrinkTowards controls the direction of the bounds shrink animation. By default, the clip bounds animates from full height to 0, shrinking towards the bottom of the content.

Note: shrinkVertically animates the bounds of the content. This bounds change will also result in the animation of other layouts that are dependent on this size.

targetHeight is a lambda that takes the full height of the content and returns a target height of the content. This allows not only absolute height, but also a target height that is proportional to the content height.

clip defines whether the content outside of the animated bounds should be clipped. By default, clip is set to true, which only shows content in the animated bounds.

Parameters


animationSpec	the animation used for the shrinking animation, `spring` by default.
shrinkTowards	the ending point of the shrinking bounds, `Alignment.Bottom` by default.
clip	whether the content outside of the animated bounds should be clipped, true by default
targetHeight	returns the end height of the shrinking bounds, 0 by default.

Code Examples

ExpandShrinkVerticallySample

@Composable
fun ExpandShrinkVerticallySample() {
    var visible by remember { mutableStateOf(true) }
    AnimatedVisibility(
        visible,
        // Sets the initial height of the content to 20, revealing only the top of the content at
        // the beginning of the expanding animation.
        enter = expandVertically(expandFrom = Alignment.Top) { 20 },
        // Shrinks the content to half of its full height via an animation.
        exit = shrinkVertically(animationSpec = tween()) { fullHeight -> fullHeight / 2 },
    ) {
        // Content that needs to appear/disappear goes here:
        Text("Content to appear/disappear", Modifier.fillMaxWidth().requiredHeight(200.dp))
    }
}