drawer.js

import React from 'react';
import { StyleSheet, Text, View } from 'react-native';
import { createBottomTabNavigator,createDrawerNavigator } from 'react-navigation';
import { NavigationActions } from 'react-navigation';


class HomeScreen extends React.Component {
  render() {
    return (
      <View style={{ flex: 1, justifyContent: 'center', alignItems: 'center' }}>
        <Text>Home!</Text>
      </View>
    );
  }
}

class SettingsScreen extends React.Component {
  render() {
    return (
      <View style={{ flex: 1, justifyContent: 'center', alignItems: 'center' }}>
        <Text>Settings!</Text>
      </View>
    );
  }
}


const  Appp = createBottomTabNavigator(
  {
    Home: HomeScreen,
    Settings: SettingsScreen,
    Drawer: SettingsScreen,
  },
  {
    navigationOptions: ({ navigation }) => ({
      tabBarOnPress: (nav, dh) => {
        let navi = nav.navigation.state.routeName;
        if (navi === 'Drawer') {
          navigation.toggleDrawer();
        } else {
          const navigateAction = NavigationActions.navigate({
            routeName: navi,
          });
          navigation.dispatch(navigateAction);
        }
      },
    }),
    tabBarOptions: {
      activeTintColor: 'tomato',
      inactiveTintColor: 'gray',
    },
  }
);

const MyApp = createDrawerNavigator({
  Home: {
    screen: Appp,
  },
  Notifications: {
    screen: Appp,
  },
});

export default class App extends React.Component {
  render() {
    return <MyApp />;
  }
}
const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: '#fff',
    alignItems: 'center',
    justifyContent: 'center',
  },
});