---
title: "shrinkHorizontally"
description: "This shrinks the clip bounds of the disappearing content horizontally, from the full width to the
width returned from [targetWidth]. [shrinkTowards] controls the direction of the bounds shrink
animation. By default, the clip bounds animates from full width to 0, shrinking towards the end
of the content.

__Note__: [shrinkHorizontally] animates the bounds of the content. This bounds change will also
result in the animation of other layouts that are dependent on this size.

[targetWidth] is a lambda that takes the full width of the content and returns a target width of
the content. This allows not only absolute width, but also a target width that is proportional to
the content width.

[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."
type: "function"
---

<div class='type'>Function</div>


<a id='references'></a>
<div class='sourceset sourceset-common'>Common</div>


```kotlin
public fun shrinkHorizontally(
    animationSpec: FiniteAnimationSpec<IntSize> =
        spring(
            stiffness = Spring.StiffnessMediumLow,
            visibilityThreshold = IntSize.VisibilityThreshold,
        ),
    shrinkTowards: Alignment.Horizontal = Alignment.End,
    clip: Boolean = true,
    targetWidth: (fullWidth: Int) -> Int = { 0 },
): ExitTransition
```


This shrinks the clip bounds of the disappearing content horizontally, from the full width to the
width returned from `targetWidth`. `shrinkTowards` controls the direction of the bounds shrink
animation. By default, the clip bounds animates from full width to 0, shrinking towards the end
of the content.

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

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

`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.End` by default. |
| clip | whether the content outside of the animated bounds should be clipped, true by default |
| targetWidth | returns the end width of the shrinking bounds, 0 by default. |




## Code Examples
### HorizontalTransitionSample
```kotlin
@Composable
fun HorizontalTransitionSample() {
    var visible by remember { mutableStateOf(true) }
    AnimatedVisibility(
        visible = visible,
        // Set the start width to 20 (pixels), 0 by default
        enter = expandHorizontally { 20 },
        exit =
            shrinkHorizontally(
                // Overwrites the default animation with tween for this shrink animation.
                animationSpec = tween(),
                // Shrink towards the end (i.e. right edge for LTR, left edge for RTL). The default
                // direction for the shrink is towards [Alignment.Start]
                shrinkTowards = Alignment.End,
            ) { fullWidth ->
                // Set the end width for the shrink animation to a quarter of the full width.
                fullWidth / 4
            },
    ) {
        // Content that needs to appear/disappear goes here:
        Box(Modifier.fillMaxWidth().requiredHeight(200.dp))
    }
}
```