# AnimatedContentTransitionScope

Artifact: [androidx.compose.animation:animation](https://developer.android.com/jetpack/androidx/releases/compose-animation) [View Source](https://cs.android.com/search?q=file:androidx/compose/animation/AnimatedContent.kt+class:androidx.compose.animation.AnimatedContentTransitionScope) Added in [1.5.0](https://developer.android.com/jetpack/androidx/releases/compose-animation#1.5.0) Common/AllAndroid/JVM
- Cmn

  ```
  sealed interface AnimatedContentTransitionScope<S : Any?> : Transition.Segment<S>
  ```

*** ** * ** ***

`https://developer.android.com/reference/kotlin/androidx/compose/animation/AnimatedContentTransitionScope` provides functions that are convenient and only applicable in the context of `https://developer.android.com/reference/kotlin/androidx/compose/animation/AnimatedContent.composable#AnimatedContent(kotlin.Any,androidx.compose.ui.Modifier,kotlin.Function1,androidx.compose.ui.Alignment,kotlin.String,kotlin.Function1,kotlin.Function2)`, such as `https://developer.android.com/reference/kotlin/androidx/compose/animation/AnimatedContentTransitionScope#slideIntoContainer(androidx.compose.animation.AnimatedContentTransitionScope.SlideDirection,androidx.compose.animation.core.FiniteAnimationSpec,kotlin.Function1)` and `https://developer.android.com/reference/kotlin/androidx/compose/animation/AnimatedContentTransitionScope#slideOutOfContainer(androidx.compose.animation.AnimatedContentTransitionScope.SlideDirection,androidx.compose.animation.core.FiniteAnimationSpec,kotlin.Function1)`.

## Summary

| ### Nested types |
|---|
| `value class https://developer.android.com/reference/kotlin/androidx/compose/animation/AnimatedContentTransitionScope.SlideDirection` `https://developer.android.com/reference/kotlin/androidx/compose/animation/AnimatedContentTransitionScope.SlideDirection` defines the direction of the slide in/out for `https://developer.android.com/reference/kotlin/androidx/compose/animation/AnimatedContentTransitionScope#slideIntoContainer(androidx.compose.animation.AnimatedContentTransitionScope.SlideDirection,androidx.compose.animation.core.FiniteAnimationSpec,kotlin.Function1)` and `https://developer.android.com/reference/kotlin/androidx/compose/animation/AnimatedContentTransitionScope#slideOutOfContainer(androidx.compose.animation.AnimatedContentTransitionScope.SlideDirection,androidx.compose.animation.core.FiniteAnimationSpec,kotlin.Function1)`. |

| ### Public functions |
|---|---|---|
| `https://developer.android.com/reference/kotlin/androidx/compose/animation/EnterTransition` | `https://developer.android.com/reference/kotlin/androidx/compose/animation/AnimatedContentTransitionScope#slideIntoContainer(androidx.compose.animation.AnimatedContentTransitionScope.SlideDirection,androidx.compose.animation.core.FiniteAnimationSpec,kotlin.Function1)( towards: https://developer.android.com/reference/kotlin/androidx/compose/animation/AnimatedContentTransitionScope.SlideDirection, animationSpec: https://developer.android.com/reference/kotlin/androidx/compose/animation/core/FiniteAnimationSpec<https://developer.android.com/reference/kotlin/androidx/compose/ui/unit/IntOffset>, initialOffset: (offsetForFullSlide: https://kotlinlang.org/api/core/kotlin-stdlib/kotlin/-int/index.html) -> https://kotlinlang.org/api/core/kotlin-stdlib/kotlin/-int/index.html )` This defines a horizontal/vertical slide-in that is specific to `https://developer.android.com/reference/kotlin/androidx/compose/animation/AnimatedContent.composable#AnimatedContent(kotlin.Any,androidx.compose.ui.Modifier,kotlin.Function1,androidx.compose.ui.Alignment,kotlin.String,kotlin.Function1,kotlin.Function2)` from the edge of the container. | Cmn |
| `https://developer.android.com/reference/kotlin/androidx/compose/animation/ExitTransition` | `https://developer.android.com/reference/kotlin/androidx/compose/animation/AnimatedContentTransitionScope#slideOutOfContainer(androidx.compose.animation.AnimatedContentTransitionScope.SlideDirection,androidx.compose.animation.core.FiniteAnimationSpec,kotlin.Function1)( towards: https://developer.android.com/reference/kotlin/androidx/compose/animation/AnimatedContentTransitionScope.SlideDirection, animationSpec: https://developer.android.com/reference/kotlin/androidx/compose/animation/core/FiniteAnimationSpec<https://developer.android.com/reference/kotlin/androidx/compose/ui/unit/IntOffset>, targetOffset: (offsetForFullSlide: https://kotlinlang.org/api/core/kotlin-stdlib/kotlin/-int/index.html) -> https://kotlinlang.org/api/core/kotlin-stdlib/kotlin/-int/index.html )` This defines a horizontal/vertical exit transition to completely slide out of the `https://developer.android.com/reference/kotlin/androidx/compose/animation/AnimatedContent.composable#AnimatedContent(kotlin.Any,androidx.compose.ui.Modifier,kotlin.Function1,androidx.compose.ui.Alignment,kotlin.String,kotlin.Function1,kotlin.Function2)` container. | Cmn |
| `infix https://developer.android.com/reference/kotlin/androidx/compose/animation/ContentTransform` | `https://developer.android.com/reference/kotlin/androidx/compose/animation/ContentTransform.https://developer.android.com/reference/kotlin/androidx/compose/animation/AnimatedContentTransitionScope#(androidx.compose.animation.ContentTransform).using(androidx.compose.animation.SizeTransform)(sizeTransform: https://developer.android.com/reference/kotlin/androidx/compose/animation/SizeTransform?)` Customizes the `https://developer.android.com/reference/kotlin/androidx/compose/animation/SizeTransform` of a given `https://developer.android.com/reference/kotlin/androidx/compose/animation/ContentTransform`. | Cmn |

| ### Public properties |
|---|---|---|
| `open https://developer.android.com/reference/kotlin/androidx/compose/animation/ExitTransition` | `https://developer.android.com/reference/kotlin/androidx/compose/animation/ExitTransition.Companion.https://developer.android.com/reference/kotlin/androidx/compose/animation/AnimatedContentTransitionScope#(androidx.compose.animation.ExitTransition.Companion).KeepUntilTransitionsFinished()` `https://developer.android.com/reference/kotlin/androidx/compose/animation/AnimatedContentTransitionScope#(androidx.compose.animation.ExitTransition.Companion).KeepUntilTransitionsFinished()` defers the disposal of the exiting content till both enter and exit transitions have finished. | Cmn |
| `https://developer.android.com/reference/kotlin/androidx/compose/ui/Alignment` | `https://developer.android.com/reference/kotlin/androidx/compose/animation/AnimatedContentTransitionScope#contentAlignment()` This returns the `https://developer.android.com/reference/kotlin/androidx/compose/ui/Alignment` specified on `https://developer.android.com/reference/kotlin/androidx/compose/animation/AnimatedContent.composable#AnimatedContent(kotlin.Any,androidx.compose.ui.Modifier,kotlin.Function1,androidx.compose.ui.Alignment,kotlin.String,kotlin.Function1,kotlin.Function2)`. | Cmn |

### Inherited functions

From [androidx.compose.animation.core.Transition.Segment](https://developer.android.com/reference/kotlin/androidx/compose/animation/core/Transition.Segment) `open infix https://kotlinlang.org/api/core/kotlin-stdlib/kotlin/-boolean/index.html` `S.https://developer.android.com/reference/kotlin/androidx/compose/animation/core/Transition.Segment#(kotlin.Any).isTransitioningTo(kotlin.Any)(targetState: S)`

Returns whether the provided state matches the `https://developer.android.com/reference/kotlin/androidx/compose/animation/core/Transition.Segment#initialState()`\&\& the provided `https://developer.android.com/reference/kotlin/androidx/compose/animation/core/Transition.Segment#(kotlin.Any).isTransitioningTo(kotlin.Any)` matches `https://developer.android.com/reference/kotlin/androidx/compose/animation/core/Transition.Segment#targetState()`.
Cmn

### Inherited properties

From [androidx.compose.animation.core.Transition.Segment](https://developer.android.com/reference/kotlin/androidx/compose/animation/core/Transition.Segment) `S` `https://developer.android.com/reference/kotlin/androidx/compose/animation/core/Transition.Segment#initialState()`

Initial state of a Transition Segment.
Cmn `S` `https://developer.android.com/reference/kotlin/androidx/compose/animation/core/Transition.Segment#targetState()`

Target state of a Transition Segment.
Cmn

## Public functions

### slideIntoContainer

Cmn

```
fun slideIntoContainer(
    towards: AnimatedContentTransitionScope.SlideDirection,
    animationSpec: FiniteAnimationSpec<IntOffset> = spring(visibilityThreshold = IntOffset.VisibilityThreshold),
    initialOffset: (offsetForFullSlide: Int) -> Int = { it }
): EnterTransition
```

This defines a horizontal/vertical slide-in that is specific to `https://developer.android.com/reference/kotlin/androidx/compose/animation/AnimatedContent.composable#AnimatedContent(kotlin.Any,androidx.compose.ui.Modifier,kotlin.Function1,androidx.compose.ui.Alignment,kotlin.String,kotlin.Function1,kotlin.Function2)` from the edge of the container. The offset amount is dynamically calculated based on the current size of the `https://developer.android.com/reference/kotlin/androidx/compose/animation/AnimatedContent.composable#AnimatedContent(kotlin.Any,androidx.compose.ui.Modifier,kotlin.Function1,androidx.compose.ui.Alignment,kotlin.String,kotlin.Function1,kotlin.Function2)` and its content alignment. This offset (may be positive or negative based on the direction of the slide) is then passed to `https://developer.android.com/reference/kotlin/androidx/compose/animation/AnimatedContentTransitionScope#slideIntoContainer(androidx.compose.animation.AnimatedContentTransitionScope.SlideDirection,androidx.compose.animation.core.FiniteAnimationSpec,kotlin.Function1)`. By default, `https://developer.android.com/reference/kotlin/androidx/compose/animation/AnimatedContentTransitionScope#slideIntoContainer(androidx.compose.animation.AnimatedContentTransitionScope.SlideDirection,androidx.compose.animation.core.FiniteAnimationSpec,kotlin.Function1)` will be using the offset calculated from the system to slide the content in. `https://developer.android.com/reference/kotlin/androidx/compose/animation/AnimatedContentTransitionScope#slideIntoContainer(androidx.compose.animation.AnimatedContentTransitionScope.SlideDirection,androidx.compose.animation.core.FiniteAnimationSpec,kotlin.Function1)` is a convenient alternative to `https://developer.android.com/reference/kotlin/androidx/compose/animation/package-summary#slideInHorizontally(androidx.compose.animation.core.FiniteAnimationSpec,kotlin.Function1)` and `https://developer.android.com/reference/kotlin/androidx/compose/animation/package-summary#slideInVertically(androidx.compose.animation.core.FiniteAnimationSpec,kotlin.Function1)` when the incoming and outgoing content differ in size. Otherwise, it would be equivalent to `https://developer.android.com/reference/kotlin/androidx/compose/animation/package-summary#slideInHorizontally(androidx.compose.animation.core.FiniteAnimationSpec,kotlin.Function1)` and `https://developer.android.com/reference/kotlin/androidx/compose/animation/package-summary#slideInVertically(androidx.compose.animation.core.FiniteAnimationSpec,kotlin.Function1)` with an offset of the full width/height.

`https://developer.android.com/reference/kotlin/androidx/compose/animation/AnimatedContentTransitionScope#slideIntoContainer(androidx.compose.animation.AnimatedContentTransitionScope.SlideDirection,androidx.compose.animation.core.FiniteAnimationSpec,kotlin.Function1)` specifies the slide direction. Content can be slided into the container towards `https://developer.android.com/reference/kotlin/androidx/compose/animation/AnimatedContentTransitionScope.SlideDirection#Left()`, `https://developer.android.com/reference/kotlin/androidx/compose/animation/AnimatedContentTransitionScope.SlideDirection#Right()`, `https://developer.android.com/reference/kotlin/androidx/compose/animation/AnimatedContentTransitionScope.SlideDirection#Up()` and `https://developer.android.com/reference/kotlin/androidx/compose/animation/AnimatedContentTransitionScope.SlideDirection#Down()`.

`https://developer.android.com/reference/kotlin/androidx/compose/animation/AnimatedContentTransitionScope#slideIntoContainer(androidx.compose.animation.AnimatedContentTransitionScope.SlideDirection,androidx.compose.animation.core.FiniteAnimationSpec,kotlin.Function1)` defines the animation that will be used to animate the slide-in.

```kotlin
import androidx.compose.animation.AnimatedContent
import androidx.compose.animation.AnimatedContentTransitionScope
import androidx.compose.animation.AnimatedContentTransitionScope.SlideDirection
import androidx.compose.animation.ContentTransform
import androidx.compose.animation.ExitTransition
import androidx.compose.animation.core.tween
import androidx.compose.animation.togetherWith
import androidx.compose.ui.unit.sp

// enum class NestedMenuState { Level1, Level2, Level3 }
// This is an example of creating a transitionSpec for navigating in a nested menu. The goal
// is to 1) establish a z-order for different levels of the menu, and 2) imply a spatial
// order between the menus via the different slide direction when navigating to child menu vs
// parent menu. See the demos directory of the source code for a full demo.
val transitionSpec: AnimatedContentTransitionScope<NestedMenuState>.() -> ContentTransform = {
    if (initialState < targetState) {
            // Going from parent menu to child menu, slide towards left
            slideIntoContainer(towards = SlideDirection.Left) togetherWith
                // Keep exiting content in place while sliding in the incoming content.
                ExitTransition.KeepUntilTransitionsFinished
        } else {
            // Going from child menu to parent menu, slide towards right.
            // Slide parent by half amount compared to child menu to create an interesting
            // parallax visual effect.
            slideIntoContainer(towards = SlideDirection.Right) { offsetForFullSlide ->
                offsetForFullSlide / 2
            } togetherWith slideOutOfContainer(towards = SlideDirection.Right)
        }
        .apply {
            // Here we can specify the zIndex for the target (i.e. incoming) content.
            targetContentZIndex =
                when (targetState) {
                    NestedMenuState.Level1 -> 1f
                    NestedMenuState.Level2 -> 2f
                    NestedMenuState.Level3 -> 3f
                }
        }
}
```

| See also |
|---|---|
| `https://developer.android.com/reference/kotlin/androidx/compose/animation/AnimatedContent.composable#AnimatedContent(kotlin.Any,androidx.compose.ui.Modifier,kotlin.Function1,androidx.compose.ui.Alignment,kotlin.String,kotlin.Function1,kotlin.Function2)` |   |
| `https://developer.android.com/reference/kotlin/androidx/compose/animation/package-summary#slideInHorizontally(androidx.compose.animation.core.FiniteAnimationSpec,kotlin.Function1)` |   |
| `https://developer.android.com/reference/kotlin/androidx/compose/animation/package-summary#slideInVertically(androidx.compose.animation.core.FiniteAnimationSpec,kotlin.Function1)` |   |

### slideOutOfContainer

Cmn

```
fun slideOutOfContainer(
    towards: AnimatedContentTransitionScope.SlideDirection,
    animationSpec: FiniteAnimationSpec<IntOffset> = spring(visibilityThreshold = IntOffset.VisibilityThreshold),
    targetOffset: (offsetForFullSlide: Int) -> Int = { it }
): ExitTransition
```

This defines a horizontal/vertical exit transition to completely slide out of the `https://developer.android.com/reference/kotlin/androidx/compose/animation/AnimatedContent.composable#AnimatedContent(kotlin.Any,androidx.compose.ui.Modifier,kotlin.Function1,androidx.compose.ui.Alignment,kotlin.String,kotlin.Function1,kotlin.Function2)` container. The offset amount is dynamically calculated based on the current size of the `https://developer.android.com/reference/kotlin/androidx/compose/animation/AnimatedContent.composable#AnimatedContent(kotlin.Any,androidx.compose.ui.Modifier,kotlin.Function1,androidx.compose.ui.Alignment,kotlin.String,kotlin.Function1,kotlin.Function2)` and the new target size. This offset gets passed to `https://developer.android.com/reference/kotlin/androidx/compose/animation/AnimatedContentTransitionScope#slideOutOfContainer(androidx.compose.animation.AnimatedContentTransitionScope.SlideDirection,androidx.compose.animation.core.FiniteAnimationSpec,kotlin.Function1)` lambda. By default, `https://developer.android.com/reference/kotlin/androidx/compose/animation/AnimatedContentTransitionScope#slideOutOfContainer(androidx.compose.animation.AnimatedContentTransitionScope.SlideDirection,androidx.compose.animation.core.FiniteAnimationSpec,kotlin.Function1)` uses this offset as is, but it can be customized to slide a distance based on the offset. `https://developer.android.com/reference/kotlin/androidx/compose/animation/AnimatedContentTransitionScope#slideOutOfContainer(androidx.compose.animation.AnimatedContentTransitionScope.SlideDirection,androidx.compose.animation.core.FiniteAnimationSpec,kotlin.Function1)` is a convenient alternative to `https://developer.android.com/reference/kotlin/androidx/compose/animation/package-summary#slideOutHorizontally(androidx.compose.animation.core.FiniteAnimationSpec,kotlin.Function1)` and `https://developer.android.com/reference/kotlin/androidx/compose/animation/package-summary#slideOutVertically(androidx.compose.animation.core.FiniteAnimationSpec,kotlin.Function1)` when the incoming and outgoing content differ in size. Otherwise, it would be equivalent to `https://developer.android.com/reference/kotlin/androidx/compose/animation/package-summary#slideOutHorizontally(androidx.compose.animation.core.FiniteAnimationSpec,kotlin.Function1)` and `https://developer.android.com/reference/kotlin/androidx/compose/animation/package-summary#slideOutVertically(androidx.compose.animation.core.FiniteAnimationSpec,kotlin.Function1)` with an offset of the full width/height.

`https://developer.android.com/reference/kotlin/androidx/compose/animation/AnimatedContentTransitionScope#slideOutOfContainer(androidx.compose.animation.AnimatedContentTransitionScope.SlideDirection,androidx.compose.animation.core.FiniteAnimationSpec,kotlin.Function1)` specifies the slide direction. Content can be slided out of the container towards `https://developer.android.com/reference/kotlin/androidx/compose/animation/AnimatedContentTransitionScope.SlideDirection#Left()`, `https://developer.android.com/reference/kotlin/androidx/compose/animation/AnimatedContentTransitionScope.SlideDirection#Right()`, `https://developer.android.com/reference/kotlin/androidx/compose/animation/AnimatedContentTransitionScope.SlideDirection#Up()` and `https://developer.android.com/reference/kotlin/androidx/compose/animation/AnimatedContentTransitionScope.SlideDirection#Down()`.

`https://developer.android.com/reference/kotlin/androidx/compose/animation/AnimatedContentTransitionScope#slideOutOfContainer(androidx.compose.animation.AnimatedContentTransitionScope.SlideDirection,androidx.compose.animation.core.FiniteAnimationSpec,kotlin.Function1)` defines the animation that will be used to animate the slide-out.

```kotlin
import androidx.compose.animation.AnimatedContent
import androidx.compose.animation.AnimatedContentTransitionScope
import androidx.compose.animation.AnimatedContentTransitionScope.SlideDirection
import androidx.compose.animation.ContentTransform
import androidx.compose.animation.ExitTransition
import androidx.compose.animation.core.tween
import androidx.compose.animation.togetherWith
import androidx.compose.ui.unit.sp

// enum class NestedMenuState { Level1, Level2, Level3 }
// This is an example of creating a transitionSpec for navigating in a nested menu. The goal
// is to 1) establish a z-order for different levels of the menu, and 2) imply a spatial
// order between the menus via the different slide direction when navigating to child menu vs
// parent menu. See the demos directory of the source code for a full demo.
val transitionSpec: AnimatedContentTransitionScope<NestedMenuState>.() -> ContentTransform = {
    if (initialState < targetState) {
            // Going from parent menu to child menu, slide towards left
            slideIntoContainer(towards = SlideDirection.Left) togetherWith
                // Keep exiting content in place while sliding in the incoming content.
                ExitTransition.KeepUntilTransitionsFinished
        } else {
            // Going from child menu to parent menu, slide towards right.
            // Slide parent by half amount compared to child menu to create an interesting
            // parallax visual effect.
            slideIntoContainer(towards = SlideDirection.Right) { offsetForFullSlide ->
                offsetForFullSlide / 2
            } togetherWith slideOutOfContainer(towards = SlideDirection.Right)
        }
        .apply {
            // Here we can specify the zIndex for the target (i.e. incoming) content.
            targetContentZIndex =
                when (targetState) {
                    NestedMenuState.Level1 -> 1f
                    NestedMenuState.Level2 -> 2f
                    NestedMenuState.Level3 -> 3f
                }
        }
}
```

| See also |
|---|---|
| `https://developer.android.com/reference/kotlin/androidx/compose/animation/AnimatedContent.composable#AnimatedContent(kotlin.Any,androidx.compose.ui.Modifier,kotlin.Function1,androidx.compose.ui.Alignment,kotlin.String,kotlin.Function1,kotlin.Function2)` |   |
| `https://developer.android.com/reference/kotlin/androidx/compose/animation/package-summary#slideOutHorizontally(androidx.compose.animation.core.FiniteAnimationSpec,kotlin.Function1)` |   |
| `https://developer.android.com/reference/kotlin/androidx/compose/animation/package-summary#slideOutVertically(androidx.compose.animation.core.FiniteAnimationSpec,kotlin.Function1)` |   |

### ContentTransform.using

Cmn Artifact: [androidx.compose.animation:animation](https://developer.android.com/jetpack/androidx/releases/compose-animation) [View Source](https://cs.android.com/search?q=file:androidx/compose/animation/AnimatedContent.kt+function:using) Added in [1.5.0](https://developer.android.com/jetpack/androidx/releases/compose-animation#1.5.0)

```
infix fun ContentTransform.using(sizeTransform: SizeTransform?): ContentTransform
```

Customizes the `https://developer.android.com/reference/kotlin/androidx/compose/animation/SizeTransform` of a given `https://developer.android.com/reference/kotlin/androidx/compose/animation/ContentTransform`. For example:

```kotlin
import androidx.compose.animation.AnimatedContent
import androidx.compose.animation.AnimatedContentTransitionScope
import androidx.compose.animation.ContentTransform
import androidx.compose.animation.SizeTransform
import androidx.compose.animation.core.keyframes
import androidx.compose.animation.core.tween
import androidx.compose.animation.fadeIn
import androidx.compose.animation.fadeOut
import androidx.compose.animation.togetherWith
import androidx.compose.ui.unit.IntSize

// enum class CartState { Expanded, Collapsed }
val transitionSpec: AnimatedContentTransitionScope<CartState>.() -> ContentTransform = {
    // Fade in with a delay so that it starts after fade out
    fadeIn(animationSpec = tween(150, delayMillis = 150))
        .togetherWith(fadeOut(animationSpec = tween(150)))
        .using(
            SizeTransform { initialSize, targetSize ->
                // Using different SizeTransform for different state change
                if (CartState.Collapsed isTransitioningTo CartState.Expanded) {
                    keyframes {
                        durationMillis = 500
                        // Animate to full target width and by 200px in height at 150ms
                        IntSize(targetSize.width, initialSize.height + 200) at 150
                    }
                } else {
                    keyframes {
                        durationMillis = 500
                        // Animate 1/2 the height without changing the width at 150ms.
                        // The width and rest of the height will be animated in the
                        // timeframe between 150ms and duration (i.e. 500ms)
                        IntSize(
                            initialSize.width,
                            (initialSize.height + targetSize.height) / 2,
                        ) at 150
                    }
                }
            }
        )
}
```

## Public properties

### ExitTransition.Companion.KeepUntilTransitionsFinished

Cmn Artifact: [androidx.compose.animation:animation](https://developer.android.com/jetpack/androidx/releases/compose-animation) [View Source](https://cs.android.com/search?q=file:androidx/compose/animation/AnimatedContent.kt+symbol:KeepUntilTransitionsFinished) Added in [1.6.0](https://developer.android.com/jetpack/androidx/releases/compose-animation#1.6.0)

```
open val ExitTransition.Companion.KeepUntilTransitionsFinished: ExitTransition
```

`https://developer.android.com/reference/kotlin/androidx/compose/animation/AnimatedContentTransitionScope#(androidx.compose.animation.ExitTransition.Companion).KeepUntilTransitionsFinished()` defers the disposal of the exiting content till both enter and exit transitions have finished. It can be combined with other `https://developer.android.com/reference/kotlin/androidx/compose/animation/ExitTransition`s using `https://developer.android.com/reference/kotlin/androidx/compose/animation/ExitTransition#plus(androidx.compose.animation.ExitTransition)`.

**Important** : `https://developer.android.com/reference/kotlin/androidx/compose/animation/AnimatedContentTransitionScope#(androidx.compose.animation.ExitTransition.Companion).KeepUntilTransitionsFinished()` works the best when the `https://developer.android.com/reference/kotlin/androidx/compose/animation/ContentTransform#targetContentZIndex()` for the incoming and outgoing content are specified. Otherwise, if the content gets interrupted from entering and switching to exiting using `https://developer.android.com/reference/kotlin/androidx/compose/animation/AnimatedContentTransitionScope#(androidx.compose.animation.ExitTransition.Companion).KeepUntilTransitionsFinished()`, the holding pattern may render exiting content on top of the entering content, unless the z-order is specified.

```kotlin
import androidx.compose.animation.AnimatedContent
import androidx.compose.animation.AnimatedContentTransitionScope
import androidx.compose.animation.AnimatedContentTransitionScope.SlideDirection
import androidx.compose.animation.ContentTransform
import androidx.compose.animation.ExitTransition
import androidx.compose.animation.core.tween
import androidx.compose.animation.togetherWith
import androidx.compose.ui.unit.sp

// enum class NestedMenuState { Level1, Level2, Level3 }
// This is an example of creating a transitionSpec for navigating in a nested menu. The goal
// is to 1) establish a z-order for different levels of the menu, and 2) imply a spatial
// order between the menus via the different slide direction when navigating to child menu vs
// parent menu. See the demos directory of the source code for a full demo.
val transitionSpec: AnimatedContentTransitionScope<NestedMenuState>.() -> ContentTransform = {
    if (initialState < targetState) {
            // Going from parent menu to child menu, slide towards left
            slideIntoContainer(towards = SlideDirection.Left) togetherWith
                // Keep exiting content in place while sliding in the incoming content.
                ExitTransition.KeepUntilTransitionsFinished
        } else {
            // Going from child menu to parent menu, slide towards right.
            // Slide parent by half amount compared to child menu to create an interesting
            // parallax visual effect.
            slideIntoContainer(towards = SlideDirection.Right) { offsetForFullSlide ->
                offsetForFullSlide / 2
            } togetherWith slideOutOfContainer(towards = SlideDirection.Right)
        }
        .apply {
            // Here we can specify the zIndex for the target (i.e. incoming) content.
            targetContentZIndex =
                when (targetState) {
                    NestedMenuState.Level1 -> 1f
                    NestedMenuState.Level2 -> 2f
                    NestedMenuState.Level3 -> 3f
                }
        }
}
```

### contentAlignment

Cmn Added in [1.6.0](https://developer.android.com/jetpack/androidx/releases/compose-animation#1.6.0)

```
val contentAlignment: Alignment
```

This returns the `https://developer.android.com/reference/kotlin/androidx/compose/ui/Alignment` specified on `https://developer.android.com/reference/kotlin/androidx/compose/animation/AnimatedContent.composable#AnimatedContent(kotlin.Any,androidx.compose.ui.Modifier,kotlin.Function1,androidx.compose.ui.Alignment,kotlin.String,kotlin.Function1,kotlin.Function2)`.