---
title: "DeferredTransitionState"
description: "A TransitionState that supports a deferred phase before the automatic transition begins."
type: "class"
lastmod: "2026-06-18T10:32:52.694670Z"
---
## API Reference

> Source set: Common

```kotlin
@ExperimentalDeferredTransitionApi
public class DeferredTransitionState<S>(initialState: S) : TransitionState<S>()
```

A [TransitionState](/jetpack-compose/androidx.compose.animation/animation-core/classes/TransitionState) that supports a deferred phase before the automatic transition begins.

This state is designed for scenarios where a transition should be held in an intermediate,
manually-controlled state (e.g., during a predictive back gesture) before proceeding to its final
target.

While in the deferred phase (initiated by [defer](#defer)), the transition holds the new target as a
[pendingTargetState](#pendingtargetstate). The actual [targetState](#targetstate) remains unchanged, keeping the transition in its
current visual state. Once [animateTo](/jetpack-compose/androidx.compose.animation/animation-core/functions/animateTo) is called, the [pendingTargetState](#pendingtargetstate) is cleared and the
transition proceeds to the new [targetState](#targetstate), triggering its automatic animations.

#### Parameters

| | |
| --- | --- |
| initialState | The initial state of the transition. |

## Properties

### pendingTargetState

> Source set: Common

```kotlin
public var pendingTargetState: S?
```

The target state that the transition will eventually animate to once the deferred phase ends.

This value is set when [defer](#defer) is called and cleared when [animateTo](/jetpack-compose/androidx.compose.animation/animation-core/functions/animateTo) is called, at which
point [targetState](#targetstate) will be updated to the new state.

## Functions

### defer

```kotlin
public fun defer(targetState: S)
```

Updates the [pendingTargetState](#pendingtargetstate) and initiates the deferred phase.

During this phase, the transition's [targetState](#targetstate) remains unchanged, keeping the transition
in its current visual state. However, the new target is exposed via [pendingTargetState](#pendingtargetstate),
signaling to transition-aware components that a state change is pending. They can then use
this information to perform early setup or apply custom logic for the pending state before
the automatic transition is eventually started via [animateTo](/jetpack-compose/androidx.compose.animation/animation-core/functions/animateTo).

If [defer](#defer) is called while an animation is already in progress (i.e., [currentState](/jetpack-compose/androidx.glance/glance/composable-functions/currentState) !=
[targetState](#targetstate)), the animation will continue toward its current [targetState](#targetstate) while
[pendingTargetState](#pendingtargetstate) is set. This allows components to respond to the pending state early,
potentially concurrently with the ongoing animation.

#### Parameters

| | |
| --- | --- |
| targetState | The state the transition should eventually animate to. |

### animateTo

```kotlin
public fun animateTo(targetState: S)
```

Clears the [pendingTargetState](#pendingtargetstate) and updates the [targetState](#targetstate) to the provided [targetState](#targetstate),
ending the deferred phase and starting the automatic transition animation.

Note: The [targetState](#targetstate) provided here does not need to match the previous
[pendingTargetState](#pendingtargetstate). If a different state is provided, the transition will animate directly
to this new state, bypassing the previously deferred target.

#### Parameters

| | |
| --- | --- |
| targetState | The final target state for the transition. |

## Code Examples

### DeferredTransitionSample
```kotlin
@OptIn(ExperimentalDeferredTransitionApi::class)
@Composable
fun DeferredTransitionSample() {
    var targetState by remember { mutableStateOf("Initial") }
    var isDeferred by remember { mutableStateOf(false) }
    // Create a DeferredTransitionState
    val transitionState = remember { DeferredTransitionState(targetState) }
    // Use LaunchedEffect to handle defer/animateTo logic based on some external signal
    // (e.g. gesture progress, predictive back events, etc).
    LaunchedEffect(targetState, isDeferred) {
        if (isDeferred) {
            // Enter deferred phase: targetState is updated as a pendingTargetState
            // but animations don't start yet.
            transitionState.defer(targetState)
        } else {
            // Start automatic transition: pendingTargetState is cleared and targetState is updated
            // to trigger animations.
            transitionState.animateTo(targetState)
        }
    }
    val transition = rememberTransition(transitionState)
    // Create animations as usual
    val alpha by transition.animateFloat { state -> if (state == "Initial") 0f else 1f }
    Box(Modifier.graphicsLayer { this.alpha = alpha }) {
        // Content
    }
}
```