Search code examples
androidiosreact-nativereact-navigationreact-navigation-drawer

Drawer navigation not displaying in react-navigation


I am using react-navigation 3 versions with react native 0.59 version. I am using switch navigation for the login code. Once I got login it's redirecting to the home screen and other navigation from home screen working fine but drawer icon not displaying.

My navigator.js

export const AppStack = createStackNavigator({
  Home: {
    screen: HomeScreen,
    navigationOptions: {
        headerRight:soundicon()
    }
  }, 
  withdraw: {
    screen: WithdrawScreen,
    navigationOptions: {
        headerRight:soundicon()
    }
  }, 
  deposite: {
    screen: DepositScreen,
    navigationOptions: {
        headerRight:soundicon()
    }
  }, 

  money: {
    screen: MoneyScreen,
    navigationOptions: {
        headerRight:soundicon()
    }
  }
});

export const drawermenu  = createDrawerNavigator({
        Home: AppStack,
})

export const AuthStack = createStackNavigator({
    SignIn: {
        screen: SignInScreen,
        navigationOptions: {
        header: null,
        }
    },
    Signup:  {
        screen: SignupScreen,
        navigationOptions: {
        }
    },
    ForgotPassword:  {
        screen: ForgotPasswordScreen,
        navigationOptions: {
        }
    }

});

export const AppNavigator = createSwitchNavigator(
{
    AuthLoading: AuthLoadingScreen,
    App: drawermenu,
    Auth: AuthStack,
},
{
    initialRouteName: 'AuthLoading',
});

export const AppNavigatorObj = createAppContainer(AppNavigator)

Solution

  • As it is you can open the drawer by sliding right,if you want to open it with a icon you have to make a header component and use it on screens you want. Heres a nice example of headers: https://react-native-training.github.io/react-native-elements/docs/header.html