Disable drawer for specific screens

user_7897292 0
Viewed 209

I have implement drawer navigator as follows inside that I have stack navigator as follows,

function MyStack() {
  return (
    <NavigationContainer>
      <Drawer.Navigator initialRouteName="Home" drawerStyle={{ width: (window.width) * 0.75 }} 
      drawerContent={(props) => <DrawerContent {...props} />}>
        <Drawer.Screen name="Home" children={createHomeStack} />
      </Drawer.Navigator>
    </NavigationContainer>
  );
}

My stack navigator as follows,

createHomeStack = () =>
  <Stack.Navigator screenOptions={{ headerShown: false }}>
    <Stack.Screen
      name="LandingPage" component={LandingPage}
    />
    <Stack.Screen
      name="LoginPage" component={LoginPage}
    />
    <Stack.Screen
      name="SignUpPage" component={SignUpPage}
    />
    <Stack.Screen
      name="DashboardPage" component={DashBoardPage}
    />
    <Stack.Screen
     name="OffersPage" component={OffersPage}
    />
    <Stack.Screen
     name="ProfilePage" component={ProfilePage}
    />
  </Stack.Navigator>

I want to disable drawer for LandingPage, LoginPage ,SignUpPage and enable drawer only rest of screens. Can anyone help me to archive this target ?

react-native
1 Answers

You can add swipeEnabled=false to Drawer.Screen by checking your route page

<Drawer.Screen
  options={({ route, navigation }) => {
    return {
      swipeEnabled: false,
    };
  }}/>
user_93033960
Related