Installation | Screen Transitions

This installs the v4 alpha. Use this line for Expo Router on Expo SDK 56 or later, or to test the new Standard Navigator integration with React Navigation. Stable v3 remains the supported path for Expo Router on SDK 55 and earlier.

Install the package

npm install react-native-screen-transitions@alpha

Use the matching prerelease tag while v4 is experimental.

Install the animation runtime

v4 supports Reanimated 4 only. It does not support Reanimated 3.

For Expo projects, let Expo select compatible native versions:

npx expo install react-native-reanimated react-native-worklets \
  react-native-gesture-handler

For bare React Native projects:

npm install react-native-reanimated@^4 react-native-worklets@~0.8 react-native-gesture-handler react-native-screens react-native-safe-area-context

The important version requirements are:

react >= 19.2.0
react-native-reanimated >= 4.0.0
react-native-worklets 0.8.x
react-native-gesture-handler >= 2.16.1
react-native-screens >= 4.4.0

Follow the official Reanimated 4 and Gesture Handler installation instructions for any app-level Babel, native, or root-view setup required by your project.

Expo Router

If you use Expo Router, install expo-router:

npx expo install expo-router

If you use React Navigation, install @react-navigation/native:

npm install @react-navigation/native

v4 requires @react-navigation/native >= 7.3.0.

Native Stack Adapter

If you use withScreenTransitions, install native stack:

npm install @react-navigation/native-stack

Optional bounds teleportation

Install the compatible teleport package when using boundary teleportation:

npm install "react-native-teleport@>=1.1.0 <1.1.11"

For bare React Native projects, install iOS pods after changing native dependencies:

cd ios && pod install

Continue to Getting Started.