Q: how to design drawernavigator aith reference appstacknavigator //here is my appstacknavigation in appdrawer with tab navigation 
 import AuthLoadingScreen from './src/screens/AuthLoadingScreen'
 import WelcomeScreen from './src/screens/WelcomeScreen'
 import SignInScreen from './src/screens/SignInScreen' 
 import SignUpScreen from './src/screens/SignUpScreen'
 import HomeScreen from './src/screens/HomeScreen'
 import SettingsScreen from './src/screens/SettingsScreen'


const AuthStackNavigator = createStackNavigator({
  Welcome: WelcomeScreen,
  SignIn: SignInScreen,
  SignUp: SignUpScreen
})

const AppTabNavigator = createBottomTabNavigator({
  HomeScreen: {
    screen: HomeScreen,
    navigationOptions: {
      tabBarLabel: 'HOME',
      tabBarIcon: () => (
        <Icon name="ios-home-outline" size={24} />
      )
    }
  },
  Settings: {
    screen: SettingsScreen,
    navigationOptions: {
      tabBarLabel: 'SETTINGS',
      tabBarIcon: () => (
        <Icon name="ios-settings-outline" size={24} />
      )
    }

  }
})

const AppStackNavigator = createStackNavigator({
  AppTabNavigator: {
    screen: AppTabNavigator,
    navigationOptions: ({ navigation }) => ({
      header: null
    })
  }
})

//Here in drawer while adding anyscreen without the component of app stck it shows the particular screen
     const AppDrawerNavigator = createDrawerNavigator({
     Home: AppStackNavigator 
     })
//how should i design this 
 export default createSwitchNavigator({
 AuthLoading: AuthLoadingScreen,
 Auth: AuthStackNavigator,
 App: AppDrawerNavigator
 })

 const styles = StyleSheet.create({
 container: {
  flex: 1,
 alignItems: 'center',
 justifyContent: 'center'
 }

});
