Nuanced Pumpkin Mavens

    react-navigation-slide-from-right-transition

    1.0.4 • Public • Published

    Slide From Right Transition Config for React Navigation

    This is a slide from right transition config ported from the codebase of react navigation to enable usage on Android.

    Example App Screen Capture

    Motivation

    On iOS, the default transition animation for React Navigation's card stack is a slide from right animation. I had a project which required the same slide from right animation on Android, so I decided to pull out the transition config into this library. See the corresponding issue here to track any potential progress on getting a slide from right transition on Android.

    Installation and Usage

    • Install this library

    npm install --save react-navigation-slide-from-right-transition

    • Pass down the custom transition configuration to your react-navigation StackNavigator:
    import { StackNavigator } from 'react-navigation';
    import getSlideFromRightTransition from 'react-navigation-slide-from-right-transition';
     
    /* ... your react component code here ... */
     
    const SimpleStack = StackNavigator({
      Home: {
        screen: MyHomeScreen
      },
      Profile: {
        path: 'people/:name',
        screen: MyProfileScreen,
      },
    }, {
      transitionConfig: getSlideFromRightTransition
    });
    • Now your stack navigator will slide from the right when you push screens onto the stack, and slide to the left when you pop screens off of the stack on Android!

    Example

    Check out the example app included in the github repo to see the slide-from-right transition in action! I assume you already have the react-native-cli installed, as well as the required Android dependencies.

    git clone https://github.com/Traviskn/react-navigation-slide-from-right-transition.git
    
    cd react-navigation-slide-from-right-transition/example
    npm install
    

    Use react-native run-android to run the example.

    Install

    npm i react-navigation-slide-from-right-transition

    DownloadsWeekly Downloads

    105

    Version

    1.0.4

    License

    MIT

    Last publish

    Collaborators

    • traviskn