React Stack Navigator V5 не отвечает, когда headerMode =»float»

#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»,