<h2 id="animatesize-label-targetvaluebystate">animateSize</h2>

<div class='sourceset sourceset-common'>Common</div>

```kotlin
@Composable
public inline fun <S> Transition<S>.animateSize(
    noinline transitionSpec: @Composable Transition.Segment<S>.() -> FiniteAnimationSpec<Size> = {
        spring(visibilityThreshold = Size.VisibilityThreshold)
    },
    label: String = "SizeAnimation",
    targetValueByState: @Composable (state: S) -> Size,
): State<Size>
```

Creates a [Size](/jetpack-compose/androidx.compose.ui/ui-geometry/classes/Size) animation as a part of the given [Transition](/jetpack-compose/androidx.compose.animation/animation-core/classes/Transition). This means the states of this
animation will be managed by the [Transition](/jetpack-compose/androidx.compose.animation/animation-core/classes/Transition).

`targetValueByState` is used as a mapping from a target state to the target value of this
animation. [Transition](/jetpack-compose/androidx.compose.animation/animation-core/classes/Transition) will be using this mapping to determine what value to target this
animation towards. __Note__ that `targetValueByState` is a composable function. This means the
mapping function could access states, CompositionLocals, themes, etc. If the targetValue changes
outside of a [Transition](/jetpack-compose/androidx.compose.animation/animation-core/classes/Transition) run (i.e. when the [Transition](/jetpack-compose/androidx.compose.animation/animation-core/classes/Transition) already reached its targetState), the
[Transition](/jetpack-compose/androidx.compose.animation/animation-core/classes/Transition) will start running again to ensure this animation reaches its new target smoothly.

An optional `transitionSpec` can be provided to specify (potentially different) animation for
each pair of initialState and targetState. [FiniteAnimationSpec](/jetpack-compose/androidx.compose.animation/animation-core/interfaces/FiniteAnimationSpec) includes any non-infinite
animation, such as [tween](/jetpack-compose/androidx.compose.animation/animation-core/functions/tween), [spring](/jetpack-compose/androidx.compose.animation/animation-core/functions/spring), [keyframes](/jetpack-compose/androidx.compose.animation/animation-core/functions/keyframes) and even [repeatable](/jetpack-compose/androidx.compose.animation/animation-core/functions/repeatable), but not
[infiniteRepeatable](/jetpack-compose/androidx.compose.animation/animation-core/functions/infiniteRepeatable). By default, `transitionSpec` uses a [spring](/jetpack-compose/androidx.compose.animation/animation-core/functions/spring) animation for all transition
destinations.

[label](/jetpack-compose/androidx.compose.material3/material3/components/Label) is used to differentiate from other animations in the same transition in Android Studio.

#### Returns

| | |
| --- | --- |
|  | A [State](/jetpack-compose/androidx.compose.runtime/runtime/interfaces/State) object, the value of which is updated by animation |