I want to add transition animations while navigating from one screen to another in my app.I have three screens in my app. When i navigate from the first screen to the second screen and also navigates back from it , then the animation is working fine. But when I try to navigate from the second screen to the third screen and then navigates back, the animation gets jumbled up.
composable( route = Screens.SEARCH_DETAILS_SCREEN.name +"/{name}" +"/{type}", arguments = listOf( navArgument(name = "name") { type = NavType.StringType }, navArgument(name = "type") { type = NavType.StringType } ), enterTransition = { slideInHorizontally( initialOffsetX = {400}, animationSpec = tween( 600, easing = FastOutSlowInEasing ) )+ fadeIn(animationSpec = tween(600)) }, popExitTransition = { slideOutHorizontally( targetOffsetX = {400}, animationSpec = tween( 600, easing = FastOutSlowInEasing ) )+ fadeOut(animationSpec = tween(600)) } )
I've used this for enter and popExit transition in the second and third screen composables. I believe the conflict is because of when i try to navigate back from the third screen, the enter transition of the second screen and the popExit of the third screen gets merged. I want to know the correct way to do it and how can i make it look good.