Owning Transitions

on YouTube ↗36m

" summary

Introduces a new Transitioner for React Navigation that decouples navigation logic from view rendering, adding a create transition API (with create navigator and create navigation container) and hooks like runTransition and progress so each screen can define its own animation and gesture. Implements 60fps gestures by wiring react-native-reanimated to react-native-gesture-handler so animations run on the UI thread, demos include fade and modal transforms plus shared element transitions via react-native-fluid-transitions; examples mostly work but show a few demo bugs and some JS-only limits (keyboard handling) remain.

AI-written summary · about

" chapters (7)

1. 0:00Introduction and background
2. 8:23React Navigation architecture
3. 12:04Introducing Transitioner
4. 16:38Reanimated and gesture integration
5. 21:50Customizing modal transitions
6. 26:13Shared element transitions
7. 32:37Future of transitions and community

" related talks

• 30mMicrointeractions & Animations in React Native: Help users understand the UICatalin Miron · React Day Berlin 2019
• 36mMake Your Apps Move! Awesome Animations with React Native ⚡️Luca Caputo · Voxxed Days Ticino 2025
• 45mMobile navigationBrent Vatne · React Alicante 2018
• 25mShared Element Transition with React NativeNarendra Shetty · ReactJS Day 2017
• 34mGestures here. Gestures there. Gestures everywhere!Kyle Poole, Thomas Bruketta · Chain React 2017
• 27mNative Navigation for Every PlatformEric Vlad Vicenti · ReactEurope 2016
• 25mJust use platformKrzysztof Magiera · App.js Conf 2019
• 28mReact Native Touch & GestureKrzysztof Magiera · React Amsterdam 2017