我正在使用
但这样会使得抽屉从所有屏幕
React Native
中的react-navigation
,我想创建一个侧边栏菜单,它作为叠加层从左到右打开,并填充大约80-90%的宽度。
在没有react-navigation
的情况下,可以使用react-native-side-bar
等软件包实现此目的,但我想知道是否可以使用DrawerNavigator
完全相同的功能。
但是DrawerNavigator
似乎有菜单按钮。无法自己配置叠加层吗?
编辑
解决方案1
一种方法是使用
const MyStackNavigator = StackNavigator({
A: { screen: AScreen },
B: { screen: BScreen },
C: { screen: CScreen }
});
const RootNavigator = DrawerNavigator({
A: { screen: MyStackNavigator },
}, {
// set content of side bar
contentComponent: (props) => <Sidebar />
});
但这样会使得抽屉从所有屏幕
AScreen
、BScreen
和CScreen
中出现,而我只希望它在AScreen
中出现,因为StackNavigator嵌套在DrawerNavigator中。
解决方案2
另一个解决方案是使用
const MyDrawerNavigator = DrawerNavigator({
A: { screen: AScreen },
}, {
// set content of side bar
contentComponent: (props) => <Sidebar />
});
const RootNavigator = StackNavigator({
A: { screen: MyDrawerNavigator },
B: { screen: BScreen },
C: { screen: CScreen }
});
但是由于抽屉式导航嵌套在 A
中,因此 AScreen
的标题将位于顶部。
react-native-side-bar
的示例,他们正在做同样的事情。 - Spencer Carli