I asked today this question, but from a bit differ...

# compose

[iamthevoid]

I asked today this question, but from a bit different side 🙂 But i didn’t get any answers, and should to expand it

Why this EnterTransition [thread] doesn’t run animation, that i expect: screen appears from bottom, and change size from 90% to 100%, but run another animation: screen appears from side.

I think this happens because animation runs in container that size is not match the screen. For example if i pass this transition into AnimatedVisibility and wrap it with Box(Modifier.fillMaxSize, contentAlignment = Center) then animation runs exactly as i expect.

But now i use AnimatedNavHost from accompanist lib and same wrapping impossible, because i pass transitions right in graph, not wrap anything with AnimatedVisibility .

So question is - how to avoid incorrect animation behavior when it runs in default container? Is this behavior really incorrect or am i use api incorrectly?

[iamthevoid]

@OptIn(ExperimentalAnimationApi::class)
val NewStackTransition: EnterTransition
    get() {
        fun initialSize(size: IntSize) = IntSize(width = size.width / 10 * 9, height = size.height / 10 * 9)
        return expandIn(
            expandFrom = Alignment.Center,
            initialSize = ::initialSize,
            animationSpec = defaultAnimationSpec()
        ) +
                slideInVertically({ it / 4 }, defaultAnimationSpec()) +
                fadeIn(animationSpec = defaultAnimationSpec())
    }

defaultAnimationSpec() in this snippet is just tween(duration)

[Doris Liu]

AnimatedNavHost takes a modifier, you might be able to make this work by adding a Modifier.fillMaxSize() to AnimatedNavHost. When using expand/shrink to enter/exit, the layout is clipped to an animated size. When parent receives a smaller child layout size (from the animation), it can either 1) adjusts its own size to match (i.e. wrap content), or 2) remains the same size but aligns the child to its center. 1) is the default behavior, 2) would require some form of spec on parent size, such as what I suggested.

Do you have videos of what the animation looks like with AnimatedVisibility vs. AnimatedNavHost. Maybe we could support contentAlignment in AnimatedNavHost. 🙂

[iamthevoid]

Hmm, looks like fill size modifier is exactly what i’ve been looking for

[iamthevoid]

Sorry, i have not videos and now it took time to reproduce

[iamthevoid]

But it is works, so maybe content alignment not needed

[iamthevoid]

One question left, maybe you know why shrink/expand isn’t resizing the layout, only its bounds?