ExitTransition
Kotlin
|Java
@Immutable sealed class ExitTransition
kotlin.Any | |
↳ | androidx.compose.animation.ExitTransition |
ExitTransition defines how an AnimatedVisibility Composable disappears on screen as it becomes not visible. The 3 categories of ExitTransition available are:
- fade: fadeOut
- slide: slideOut, slideOutHorizontally, slideOutVertically
- shrink: shrinkOut, shrinkHorizontally, shrinkVertically
They can be combined using plus operator, for example:
import androidx.compose.animation.AnimatedVisibility import androidx.compose.animation.core.spring import androidx.compose.animation.core.tween import androidx.compose.animation.fadeIn import androidx.compose.animation.fadeOut import androidx.compose.animation.slideInHorizontally import androidx.compose.animation.slideOutHorizontally import androidx.compose.foundation.layout.Box import androidx.compose.foundation.layout.fillMaxWidth import androidx.compose.foundation.layout.requiredHeight import androidx.compose.runtime.mutableStateOf import androidx.compose.runtime.remember var visible by remember { mutableStateOf(true) } AnimatedVisibility( visible = visible, enter = slideInHorizontally( // Offsets the content by 1/3 of its width to the left, and slide towards right initialOffsetX = { fullWidth -> -fullWidth / 3 }, // Overwrites the default animation with tween for this slide animation. animationSpec = tween(durationMillis = 200) ) + fadeIn( // Overwrites the default animation with tween animationSpec = tween(durationMillis = 200) ), exit = slideOutHorizontally( // Overwrites the ending position of the slide-out to 200 (pixels) to the right targetOffsetX = { 200 }, animationSpec = spring(stiffness = Spring.StiffnessHigh) ) + fadeOut() ) { // Content that needs to appear/disappear goes here: Box(Modifier.fillMaxWidth().requiredHeight(200.dp)) {} }Note: fadeOut and slideOut do not affect the size of the AnimatedVisibilitycomposable. In contrast, shrinkOut (and shrinkHorizontally, shrinkVertically) will shrinkthe clip bounds to reveal less and less of the content. This will automatically animate otherlayouts to fill in the space, very much like animateContentSize.
Summary
Public methods | |
---|---|
operator ExitTransition |
plus(exit: ExitTransition) Combines different exit transitions. |
Public methods
plus
@Stable operator fun plus(exit: ExitTransition): ExitTransition
Combines different exit transitions. The order of the ExitTransitions being combined does not matter, as these ExitTransitions will start simultaneously.
import androidx.compose.animation.AnimatedVisibility import androidx.compose.animation.expandVertically import androidx.compose.animation.fadeIn import androidx.compose.animation.fadeOut import androidx.compose.animation.shrinkVertically import androidx.compose.animation.slideInVertically import androidx.compose.animation.slideOutVertically import androidx.compose.foundation.layout.fillMaxWidth import androidx.compose.foundation.layout.requiredHeight import androidx.compose.material.Text import androidx.compose.runtime.mutableStateOf import androidx.compose.runtime.remember var visible by remember { mutableStateOf(true) } AnimatedVisibility( visible = visible, enter = slideInVertically( // Start the slide from 40 (pixels) above where the content is supposed to go, to // produce a parallax effect initialOffsetY = { -40 } ) + expandVertically( expandFrom = Alignment.Top ) + fadeIn(initialAlpha = 0.3f), exit = slideOutVertically() + shrinkVertically() + fadeOut() ) { // Content that needs to appear/disappear goes here: Text("Content to appear/disappear", Modifier.fillMaxWidth().requiredHeight(200.dp)) }
Parameters | |
---|---|
exit: ExitTransition | another ExitTransition to be combined. |