Im investigating an animation issue in one of my apps. Navigating backwards twice results in the exi...

# compose

[Zoltan Demant]

Im investigating an animation issue in one of my apps. Navigating backwards twice results in the exiting content fading out, but I dont have any fade specified for exiting content. More details in 🧵

anim.mp4

[Zoltan Demant]

Im using tween(500) to rule out any Spring/VisibilityThreshold issues.

Forward:
slideInVertically togetherWith scaleOut
Backward:
scaleIn + fadeIn togetherWith slideOutVertically

The AnimatedContent usage is a bit involved so I wont post the entire thing here, the gist of it is that Im calculating a Frame(content, index, key) for each entry passed into my composable and then using targetState=topFrame. In the transitionSpec I just check if(targetIndex>initialIndex) Forward else Backward, etc.

[Zoltan Demant]

I can do back, forward, back and everything is fine.

[Zoltan Demant]

It seems somewhat linked to mixing the types of animations between enter/exit.

For example, if I just have slideHorizontally for both enter/exit, it never breaks.

As soon as I introduce scale/fade/etc + slide, it breaks.

Bug?

[Albert Chang]

I think what happened is not exiting content fading out, but entering content fading in above exiting content. I'm not sure why it only happens in the second backwards transition, but you can check if specifying a appropriate targetContentZIndex solves the problem.

[Zoltan Demant]

That seems logical. Im specifying targetContentZIndex=500f for the forward animation, the backwards one never specifies one (so 0). Maybe thats incorrect though? Ive tried using the index of the element for it but saw the same behavior then.

[Zoltan Demant]

⭐

[Zoltan Demant]

Thank you ✅

For the backwards animation I had supplied initialState.index as the zIndex, obviously I should use targetState. It now works, and its beautiful.. thanks for the help 🙂

[Zoltan Demant]

Ive been coming back to this every quarter or so, throwing new solutions at it thinking that it was either a bug in compose itself, or me doing funky stuff elsewhere that was causing it (partially true previously.. now too I guess). So glad to finally have it working as it should, so many people will benefit from this. Thanks 😃