带有React原生

Question

我需要在我的React Native（v 0.47.2）Android应用程序中创建一个独立的（没有额外的栏或其他）菜单按钮：

触摸时必须打开侧边菜单：

我需要使用哪个组件？

Answer 1

您正在使用react-navigation。使用StackNavigator。 StackNavigator可以设置Headers。在Header中，您可以prop传递Icon（或任何Component）。 这是一个例子：

// all your other imports
import Icon from "react-native-vector-icons/Ionicons";
import {
    Platform,
} from "react-native";

const MenuButton = ({ navigate }) => {
    return (
        <Icon
            name={Platform.OS === "ios" ? "ios-menu-outline" : "md-menu"}
            onPress={() => navigate("DrawerOpen")}
        />
    )
}

StackNavigator({
    Notifications: {
        screen: Example,
        navigationOptions: ({ navigation }) => ({
            headerLeft: <MenuButton {...navigation} />,
        }),
    },

headerLeft（或headerRight）可用于您的情况Documentation)。我在这里传递<MenuButton />组件。您可以设置{{1}的颜色将StackNavigator添加到您应用的Header，或backgroundColor。这样，就不会有任何可见的内容，只有菜单按钮。

你需要在transparent中将StackNavigator与DrawerNavigator叠加起来才能使onPress={() => navigate("DrawerOpen")}工作。 在DrawerNavigator中，您可以使用传递自定义组件的contentComponent，其中包含您的菜单。

这是一个更复杂的设置http://rationalappdev.com/cross-platform-navigation-in-react-native/