Can we use it with react native navigation

[ashokkumar88]

Thanks for this awesome library. Can we use this library with react-native-navigation?

[jdnichollsc]

@ashokkumar88 what animation do you need with the navigation?

[nandorojo]

I was also hoping for this to work. I tried FluidTransitions, but it doesn't allow for transitioning nested components, so adding any complexity renders it a bit useless. It would be great to have shared transitions between elements on different screens for react-navigation to work with react-native-motion.

[german970814]

@nandorojo so this library does not work to animate shared components between react-navigation screens?

[nandorojo]

There is now a different library called react-navigation-shared-element which supports shared animations between screens with react navigation.

I wrote a quick tutorial for getting it up and running here.

If you'd rather see the code, I also made an expo snack example.

If you aren't using an Expo managed project (must be SDK 35+), be sure to follow the instructions to link it to your app here.

It works very well with nested components too.

Finally, if you aren't already, I suggest using react-native-screens to help improve performance for react-navigation. Good luck!

[german970814]

@nandorojo Thanks

[amitassaraf]

@nandorojo Note that you cannot use react-native-screens with react-navigation-shared-element and it is unlikely to ever be supported

[grantgeorge]

@nandorojo flagging that support for react-navigation v5 for that library is in pre-release.

For react-navigation v5 I recommend looking at the react-navigation-shared-element development branch here: https://github.com/IjzerenHein/react-navigation-shared-element/tree/navigation-v5