Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to disable drawer navigation swipe for one of navigator screen only?

I have a custom navigation drawer and on a particular screen, I don't want it available.

This is my short code.

This navigator is also being included by the switch navigator. I have dig in git-hub and other forums and nothing is currently working. Am I missing something? Is there someone who made it to work?

const UserNavigation = createDrawerNavigator({
    ProductListScreen: {screen: ProductListScreen},
    ProductHistoryScreen: {
      screen: ProductHistoryScreen,
      navigationOptions: {
        drawerLockMode: 'locked-closed'
      }
    }
}, {
    initialRouteName: 'ProductListScreen',
    contentComponent: CustomDrawerContentComponent,
})

export default createAppContainer(UserNavigation)

There is also a working code on expo but I try and and results in double navigators displaying, and also in the screen where I don't want to show the drawer it appears. This is my attempt from referring to expo code

const UserStackNavigation = createStackNavigator({
  ProductListScreen: {screen: ProductListScreen},
  ProductHistoryScreen: {
    screen: ProductHistoryScreen
  }
})

const UserNavigation = createDrawerNavigator({
  UserStackNavigation: UserStackNavigation
}, {
  initialRouteName: 'UserStackNavigation',
  contentComponent: CustomDrawerContentComponent,
})

UserStackNavigation.navigationOptions = ({ navigation }) => ({
  drawerLockMode: navigation.state.index === 0 ? 'unlocked' : 'locked-closed',
});
export default createAppContainer(UserNavigation)
like image 330
juxhin bleta Avatar asked Mar 14 '19 20:03

juxhin bleta


1 Answers

In v5 u can use <Drawer.Navigator screenOptions={{ gestureEnabled: false }} ...>...</Drawer.Navigator>

like image 156
Paulo Henrique Avatar answered Sep 25 '22 22:09

Paulo Henrique