I'm looking to create something similar to Threads...

# compose

[andrew]

I'm looking to create something similar to Threads, the Instagram messenger as a transition/animation exercise alongside routing. I'm trying to figure out how to expand a new page from the position of a list item and transition it cleanly. It seems that a lot of the animation APIs are kind of high level. Is there a good way to get positional data of a list item and share it to choreograph a transition?

[andrew]

And is there a good way to keep transition logic separate from any higher order composable that store routing and page structure?

[andrew]

Like, would maybe wrapping an existing page composable with some kind of transition logic would be a best practice?

[andrew]

I guess the better question is, is there any good examples and best practice for choreographing complex page transitions?

[Ian Lake]

This kind of shared element transition does not have any support as of yet, but if you search for shared element, you'll find that this is something that is actively being explored for the future

[andrew]

To be honest, I was thinking of something kind of hacky, manually passing on coordinates where which to expand from and collapse to

[andrew]

I mean, is there any way we can access measurements at runtime without a layout?

[andrew]

Layout Inspector can grab them

[andrew]

How is it that layout inspector has access to all of the dimens?

[andrew]

21-05-08-15-12-12.mp4

[andrew]

Whipped up a small demo, obviously it doesn't take into account the original view disappearing for example

[andrew]

Neither is a back animation, I think I would need to whip up a stack based routing solution for that