[Navigation] Add mechanism for specifying zOrder in transitions

[hvisser]

Description
AnimatedContent supports setting a z-order on the transitions which can be useful for navigation transitions. For example when trying to implement a "slide from bottom" transition, the enter transition slides over the exiting composable (good) but the reverse will slide the exiting (popping) composable under the entering composable. If specifying the z-order could help to explicitly set the desired order for the composables.

[ianhanniballake]

How would you expect z-order to be exposed? As a property on each composable destination? Something else?

[hvisser]

I think exposing it (somehow) on the definition of the transition would make sense. In the context of the transition (initial and target) I'd know what ordering I want...That might mean the transition block is no longer an AnimatedContentScope but an extension of it maybe?

[github-actions]

This issue is stale because it has been open 30 days with no activity. Remove stale label or comment or this will be closed in 5 days.

[mvarnagiris]

I have the same issue. Having it inside transition definition would work I suppose.

Having it for each composable destination wouldn't work. If we take @hvisser example of "slide from bottom"

• A -> B. B on top of A
• A, B -> C. C on top of B
• A, B <- C. C on top B
• A <- B. B on top of A

[joshrvezy]

any idea if this is something being worked on. it would be great to have.

[vadimpikha]

I think targetContentZIndex should somehow depend on screen index in backstack

[github-actions]

This issue is stale because it has been open 30 days with no activity. Remove stale label or comment or this will be closed in 5 days.

[SergKlimov]

Same issue for me, I just copied AnimatedNavHost and modified like this

val zIndex = visibleBackStack.indexOf(backStackEntry).toFloat()

And then changed AnimatedContent

transitionSpec = { finalEnter(this) with finalExit(this) },
to

transitionSpec = { 
ContentTransform(
   targetContentEnter = finalEnter(this),
   initialContentExit = finalExit(this),
   targetContentZIndex = zIndex,
},

[x4080]

@SergKlimov Thats cool solution, but sadly, I tried to copy the AnimatedNavHost.kt content to my local package and it wont even compile :)

Can you give tip how you do it ?

Thanks

[x4080]

@SergKlimov Never mind, we must also copy file AnimatedComposeNavigator

Edit : I cant find visibleBackStack variable, is your AnimatedNavHost have that variable ?
Edit2 : Just copying (without modifying anything), make screen blank, dont know what's going on now :)
Edit3 : I got success by copying all the files from accompanist navigation, but still cannot find the variable visibleBackStack

[codingfd]

@x4080 #1160

transition.AnimatedContent(modifier, transitionSpec = {
            val targetIndex = navController.backQueue.indexOf(targetState).takeIf { it >= 0 }
                ?: navController.backQueue.size
            ContentTransform(
                targetContentEnter = finalEnter(this),
                initialContentExit = finalExit(this),
                targetContentZIndex = targetIndex.toFloat()
            )
        }

[x4080]

@codingfd thanks

[github-actions]

This issue is stale because it has been open 30 days with no activity. Remove stale label or comment or this will be closed in 5 days.

[github-actions]

This issue is stale because it has been open 30 days with no activity. Remove stale label or comment or this will be closed in 5 days.

[github-actions]

This issue is stale because it has been open 30 days with no activity. Remove stale label or comment or this will be closed in 5 days.

[hvisser]

Maybe it's time to get rid of stale bot?

[github-actions]

This issue is stale because it has been open 30 days with no activity. Remove stale label or comment or this will be closed in 5 days.

[ianhanniballake]

We've added what we believe is the correct z-ordering in #1384, released as part of v0.27.1 and aren't planning on offering any ability to override it at this time. Please upgrade and try it out!

[ommiao]

We've added what we believe is the correct z-ordering in #1384, released as part of v0.27.1 and aren't planning on offering any ability to override it at this time. Please upgrade and try it out!

Hey @ianhanniballake , I had a try but it's not good. I tried the navigation route: A -> B -> C -> B -> A, when the screen transition running from B -> A, the zIndex looks not good. Could you have a try?

[ianhanniballake]

Sounds like #1411, please follow along there.