react-navigation-transitions

react-navigation-transitions

Installation

npm install react-navigation-transitions --save

Instructions

These functions are meant to be used as the transitionConfig with react-navigation. So far it includes the following transitions:

fromLeft

fromTop

fadeIn

zoomIn

zoomOut

More will be added in future versions.

Example

import { StackNavigator } from 'react-navigation';
import { fromLeft } from 'react-navigation-transitions';

const appStack = StackNavigator(
  {
    ScreenA: {
      screen: ScreenA,
    },
    ScreenB: {
      screen: ScreenB,
    },
  },
  {
    initialRouteName: 'ScreenA',
    transitionConfig: fromLeft,
  },
);

The default duration is 300 milliseconds but you can pass is a custom transition duration like so:

transitionConfig: () => fromLeft(1000),

The basis for these function can be found in the react-navigation docs here.