#react-native #navigation #navigation-drawer #stack-navigator
#react-native #навигация #навигация-ящик #stack-navigator
Вопрос:
я использую react-native-drawer v5, и в заголовке у меня есть значок гамбургера. когда headerMode!= float -> работает, как ожидалось, и открывает и закрывает ящик.
когда я меняю headerMode =»float», заголовок не реагирует на щелчок, и ничего не происходит,
- обратите внимание, что я проверяю его на устройстве Android. Мне не нужно знать об IOS..
вот мой стек и навигация по ящикам:
import...
const MainStack = createStackNavigator();
const Drawer = createDrawerNavigator();
const stackScreenOptions = {
cardStyleInterpolator: CardStyleInterpolators.forHorizontalIOS,
gestureEnabled: true,
gestureDirection: "horizontal",
headerTitleAlign: "center",
headerStyle: {
borderBottomWidth: 0.5,
elevation: 2,
borderColor: "white",
backgroundColor: "#1d2731",
height: 82,
},
headerTitleStyle: {
color: "white",
},
};
const MainStackScreen = ({ navigation }) => (
<MainStack.Navigator headerMode="float" screenOptions={stackScreenOptions}>/////////HERE THE PROBLEM OCCURE -> when i declare headerMode="float
<MainStack.Screen
name="Main"
component={MainScreen}
options={{
title: "ליאור",
headerLeft: () => (
<Icon
style={{ position: "absolute", left: 15 }}
name="bars"
color="white"
size={30}
onPress={() => {
navigation.openDrawer();
}}
/>
),
}}
/>
<MainStack.Screen name="MeetingPicker" component={MeetingPicker} />
<MainStack.Screen name="MyMeetings" component={UserHistory} />
<MainStack.Screen name="About" component={AboutScreen} />
<MainStack.Screen name="Gallery" component={GalleryScreen} />
<MainStack.Screen name="Location" component={LocationScreen} />
<MainStack.Screen name="Logout" component={LogoutModal} />
</MainStack.Navigator>
);
export const DrawerNavigator = () => {
return (
<Drawer.Navigator drawerStyle={styles.drawerStyle} drawerContent={props => <DrawerContent {...props} />}>
<Drawer.Screen name="Main" component={MainStackScreen} />
</Drawer.Navigator>
);
};
Комментарии:
1. Вы используете последнюю версию stack?
2. Да «@react-navigation / drawer»: «^ 5.11.4», «@react-navigation / native»: «^ 5.8.10», «@react-navigation / stack»: «^ 5.12.8»,