Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

React native: How to do a "shared element/zoom" transition using navigator?

Is it possible to make a "shared element/zoom" transition like this in react native using navigator?

Especially useful for something like image galleries/modals.

https://github.com/codepath/android_guides/wiki/Shared-Element-Activity-Transition

like image 523
S Kraft Avatar asked Apr 21 '16 12:04

S Kraft


1 Answers

"Currently React doesn't support reusing a native view in different parts of the component hierarchy, which makes it difficult to implement shared element transitions in pure JS."

Checkout the below link: https://github.com/brentvatne/hard-react-native-problems/issues/11

Additionally, It(Shared Element) may be roll-out in next version as part of Navigator. Check out the following thread: https://twitter.com/intelligibabble/status/764162422831652865

Edit: airbnb launched native navigation with shared element transition to try. It not official yet. but can try out.. http://airbnb.io/native-navigation/docs/guides/shared-element-transitions.html

Update: It is worth to checkout https://wix.github.io/react-native-navigation for shared element implementation.

like image 147
rajaishwary Avatar answered Nov 12 '22 08:11

rajaishwary