Implement createDrawerNavigator but not working.
Main Component
import React, { Component } from 'react';
import Menu from './MenuComponent';
import { DISHES } from '../shared/dishes';
import { View,Platform } from 'react-native';
import Dishdetail from './DishdetailComponent';
import Home from './HomeComponent';
import { createStackNavigator,createAppContainer ,createDrawerNavigator } from 'react-navigation';
import { Icon } from 'react-native-elements';
const MenuNavigator = createStackNavigator({
Menu: { screen: Menu },
Dishdetail: { screen: Dishdetail }
},
{
initialRouteName: 'Menu',
navigationOptions: {
headerStyle: {
backgroundColor: "#512DA8"
},
headerTintColor: '#000',
headerTitleStyle: {
color: "#fff"
}
}
}
);
const HomeNavigator = createStackNavigator({
Home: { screen: Home }
}, {
navigationOptions: ({ navigation }) => ({
headerStyle: {
backgroundColor: "#512DA8"
},
headerTitleStyle: {
color: "#fff"
},
headerTintColor: "#fff"
})
});
const MainNavigator = createDrawerNavigator({
Home:
{
screen: HomeNavigator,
navigationOptions: {
title: 'Home',
drawerLabel: 'Home'
}
},
Menu:
{ screen: MenuNavigator,
navigationOptions: {
title: 'Menu',
drawerLabel: 'Menu'
},
}
}, {
drawerBackgroundColor: '#D1C4E9',
});
class Main extends Component {
render() {
return (
<View style={{flex:1,paddingTop: Platform.OS === 'ios' ? 0 : Expo.Constants.statusBarHeight }}>
<MainNavigator />
</View>
);
}
}
const App = createAppContainer(MainNavigator);
export default App;
package.json
"dependencies": {
"feather-icons-react": "^0.3.0",
"react": "16.6.3",
"react-native": "0.57.8",
"react-native-elements": "^1.0.0-beta7",
"react-native-gesture-handler": "^1.0.12",
"react-native-vector-icons": "^4.6.0",
"react-navigation": "^3.0.9"
},
"devDependencies": {
"babel-jest": "23.6.0",
"jest": "23.6.0",
"metro-react-native-babel-preset": "0.51.0",
"react-test-renderer": "16.6.3"
},
From Side bar not opening the navigation drawer,I have added all libraries from react-navigation. I am running this app on android. In code there is no error but don't know why navigation drawer isn't opening correctly.
Help will be highly appreciated
Thanks
This is because of
react-native-gesture-handler
package. you should link this package. need to do some manuel setups. checkMainActivity.java
part.https://reactnavigation.org/docs/en/getting-started.html