react native - change navigation direction (i.e, from right to left)

Question

I am using react-navigation to navigate from one screen to another. By the way I am using createStackNavigator.

I am using the code below to navigate between screens.

<Button onPress={()=>this.props.navigation.navigate('ScreenTwo')}>button-></Button>

It works fine, but I want to change the animation direction. Currently when I press the button the ScreenTwo just pops up, instead I want the screen to slide from right to left.

Is the a way I could change the direction of the animation when navigating?

Answer 1

Answered by satya164 in react-navigation/stack github repo, using gestureDirection: 'horizontal-inverted' in defaultNavigationOptions/navigationOptions

Screen: {
  screen: Screen,
  navigationOptions: {
    ...TransitionPresets.SlideFromRightIOS,
    gestureDirection: 'horizontal-inverted',
  },
},

related links below:

https://github.com/react-navigation/stack/issues/377#issuecomment-578504696

https://reactnavigation.org/docs/stack-navigator/#animation-related-options