Shared Element Transition with Request

[Bayramito]

Hi,

let's say we have a list screen called ScreenA and a detail screen called ScreenB.

We are passing the item's ID as a sharedTransitionTag to ScreenB with navigation via params... In ScreenB we grab this ID and make a request to a server to get the actual detail data, then rendering the components.

In such case how do we apply Shared Element Transition ?

[MatiPl01]

Hey!

So you mean, you want to add the shared element transition between the component that is already rendered on the ScreenA and a component that appears after the request if finished on the ScreenB?

I think that the component on the ScreenB, which you want to create a shared element transition on, should be immediately available to render. Shared Element Transition works in such a way that it creates a copy (snapshot) of the component rendered on the ScreenA and the component rendered on the ScreenB, and then, it transitions the component from the ScreenA to have the same layout (dimensions, position) as the component on the ScreenB. If the component on the ScreenB is not available during the navigation, there is no way to take a snapshot of this component, and thus, to create a Shared Element Transition.

In order to make it work, you would have to fetch necessary data before navigating to the new screen or use some placeholder that is available before the real data is returned from the server.

[Bayramito]

hmm, tIn order to make it work, you would have to fetch necessary data before navigating to the new screen or use some placeholder that is available before the real data is returned from the server.

i also thought like that but wanted to ask again if there is another solution. Well i think i would need to get the data in onPress before navigating... Thank you