Shared Element Transitions: Morphing Views Across Screens
Morph a component from one screen to another during navigation. By giving two components the same `sharedTransitionTag`, Reanimated animates the view's properties (size, position) between screens for a seamless transition.
Shared Element Transitions morph a component from one screen into another during navigation, creating a seamless visual connection. By giving views on different screens the same `sharedTransitionTag`, Reanimated animates properties like size, position, and color between them. This is common for list-to-detail flows, like an image expanding into a header. The footgun is forgetting that each shared element on a single screen needs a unique tag to avoid conflicts.
Read the original → docs.swmansion.com
- #react-native
- #reanimated
- #animation
- #ui
Get five bites like this every day.
Tezvyn delivers a daily feed of 60-second tech bites with quizzes to lock in what you learn.