Disable swipe gesture from opening the navigation drawer using react-navigation

Question

I am using react-navigation (https://reactnavigation.org) and I am trying to disable the option that the side drawer opens when the user swipes right/left

I`ve looked through the documentation and i cant find the options that does the trick

const RootStack = createDrawerNavigator(
  {
    Login: {
      screen: Login,
    },
    Components: {
      screen: Components
    },
    Home: {
      screen: Home
    }
  },
  {
    initialRouteName: 'Login',
    gesturesEnabled: false,
    headerMode: 'none',
    contentComponent: SideBar,
    contentOptions: {
      labelStyle: {
        color: 'white'
      }
    }
  }
);

export default class App extends React.Component {
  constructor(props) {
    super(props);
    this.state = { loading: true };
  }

  async componentWillMount() {
    await Font.loadAsync({
      Roboto: require("native-base/Fonts/Roboto.ttf"),
      Roboto_medium: require("native-base/Fonts/Roboto_medium.ttf"),
      'Montserrat-Light': require("./app/assets/fonts/Montserrat-Light.ttf"),
      'Montserrat-Medium': require("./app/assets/fonts/Montserrat-Medium.ttf")
    });
    this.setState({ loading: false });
  }

  render() {
    if (this.state.loading) {
      return (
        <Text>Loading</Text>
      );
    }
    return (
      <RootStack/>
    );
  }
}

Answer 1

Set edge width to 0.

React Navigation 6

In screen options:

<Drawer.Navigator
  screenOptions={{
    swipeEdgeWidth: 0,
  }}
>
  {/* screens */}
</Drawer.Navigator>

React Navigation 5

In your createDrawerNavigator config:

const drawerNavigator = createDrawerNavigator({
  Home: {
    screen: Home
  }
}, 
{
  edgeWidth: 0
})

Answer 2

You can use the drawerLockMode in the screen navigation options using the option locked-open

locked-open: the drawer will stay opened and not respond to gestures. The drawer may still be opened and closed programmatically

Other options can be viewed here

static navigationOptions = {
     drawerLockMode: 'locked-open',
}

Answer 3

React Navigation V5

This version changed how we set the properties of the Navigation Drawer so the other answers will no longer work. Instead of setting the properties in

createDrawerNavigator()

Set them in the JSX tag like so

<Drawer.Navigator edgeWidth={0} >

This will disable swipe to open while keeping swipe to close enabled.