آموزش جاوااسکریپت › انجمن ها › react native › دوره آموزش react navigation 3 › پاسخ به: دوره آموزش react navigation 3
بله حتما
لطف میکنین
import React, {Component} from ‘react’;
import {createStackNavigator, createAppContainer, createBottomTabNavigator, createDrawerNavigator} from ‘react-navigation’;
import {View, Image, TouchableOpacity} from ‘react-native’;
import DetailScreen from ‘./detail’;
import HomeScreen from ‘./home’;
import SettingScreen from ‘./setting’;
import FirstScreen from ‘./first’;
import SecondScreen from ‘./second’;
class NavigationDrawerImage extends Component{
render(){
return(
<View>
<TouchableOpacity
onPress={()=> this.props.navigationProps.toggleDrawer()}>
<Image
source={require(‘../image/menu.png’)}
style={{width:25, height:20, marginLeft:10}}/>
</TouchableOpacity>
</View>
)
}
}
const Stack1= createStackNavigator({
Home:{
screen:HomeScreen,
navigationOptions: (navigation)=>({
headerLeft: <NavigationDrawerImage navigationProps={navigation} />
})
}
})
const Stack2 = createStackNavigator({
Detail:{
screen:DetailScreen,
navigationOptions: (navigation)=>({
headerLeft: <NavigationDrawerImage navigationProps={navigation} />
})
}
})
const Stack3 = createStackNavigator({
Setting:{
screen:SettingScreen,
navigationOptions: (navigation)=>({
headerLeft: <NavigationDrawerImage navigationProps={navigation} />
})
}
})
const RootStack= createBottomTabNavigator({
tab1:{
screen:FirstScreen
},
Home:{
screen:Stack1
},
tab2:{
screen:SecondScreen
}
})
const DrawerNavi = createDrawerNavigator({
screen1:{
screen: Stack1
},
screen2:{
screen: Stack2
},
screen3:{
screen: Stack3
}
},
{
drawerWidth:150
})
export default createAppContainer(DrawerNavi);