I m trying to add a simple animation for one screen where I

Question

I m trying to add a simple animation for one screen where I want to fake it looking like a bottom sheet appears from the bottom and exits by moving down This code below works but I noticed when I slow down the animation that the screen that I m on before this FakeModal fades to grey when transitioning instead of staying there Am I missing something simple here I never really used android nav transitions in view land before so maybe I m missing something fundamental here Thanks ```composable Screen FakeModal route enterTransition = slideIntoContainer AnimatedContentScope SlideDirection Up animationSpec = tween 1500 exitTransition = slideOutOfContainer AnimatedContentScope SlideDirection Down animationSpec = tween 1500 ```

Ian Lake · Answer

So what is your `exitTransition` on the screen that you are on before this screen If you don t define one you ll be getting the default fade

Ian Lake · Answer

There isn t an ExitTransition Hold that you can use directly though see the conversation on <https issuetracker google com issues 192993290>

Colton Idle · Answer

Interesting I guess I will make my own ExitTransition Hold that I apply on the exit of the previous screen thanks for the pointer Ian

Ian Lake · Answer

Yep that s where using the `initialState` the destination you re coming from and the `targetState` the destination you are going to that are available via the `AnimatedContentScope` the `enterTransition` and `exitTransition` blocks have make it possible to customize the transition based on exactly what pair you are navigating between

Ian Lake · Answer

There s some examples in the original blog post about Animations in Navigation Compose <https medium com androiddevelopers animations in navigation compose 36d48870776b>

Ian Lake · Answer

As noted in that article you could also define those animations at a higher level in your graph structure thus ensuring that any destination that goes to your FakeModal would have the right enter exit transition since if you return null from either lambda it then asks the parent graph what animation it should run that s precisely how the default animations are defined the Animations you set on the `AnimatedNavHost` level are used for the root graph which has the final say in the default animations

Colton Idle · Answer

Thanks yeah I think probably what tripped me up was just forgetting that there s a default anim And so I was super confused when my screen underneath just turned grey

Colton Idle · Answer

If anyone else stumbles across this this was my solution ```composable Screen MyScreen route exitTransition = when targetState destination route Screen FakeBottomSheet route gt holdOut 1500 else gt null use the defaults ``` and ```fun holdOut durationMillis Int = 1500 ExitTransition = fadeOut TODO Refer <https issuetracker google com issues 192993290> targetAlpha = 1f targetAlpha = 0 999f animationSpec = tween durationMillis = durationMillis easing = LinearEasing ```

Zoltan Demant · Answer

< Colton Idle> Does that work regardless of the EnterTransitions spec duration I can dig it up if needed theres an old thread where I spoke with Doris Lou about this and how it didnt work great with spring animations You would have to use tween for the enter as well so that the exit could match its duration

Ian Lake · Answer

This technique would require that the enter and exit match duration exactly yes An actual Hold instead of this hack would still be way better

Colton Idle · Answer

Yeah I m using tween and using the same value for duration so it seems to work as I wanted