且构网

分享程序员开发的那些事...
且构网 - 分享程序员编程开发的那些事

如何在stackNavigator屏幕内水平滑动?

更新时间:2021-09-16 04:13:29

我有同样的用例.我想要一个可滑动的 .我能找到的解决方案是使用 或更具体地说,使用 createMaterialTopTabNavigator() 模拟 >.

I had the same use case. I wanted a swipaeable <StackNavigator>. The solution I was able to find was to simulate a <StackNavigator> using a <TabNavigator>, or more specifically, using createMaterialTopTabNavigator().

我所做的是创建此选项卡(这是 react-navigation 2 中唯一允许 swipeEnabled 的选项卡)并将 display: none 添加到其样式中.这样我就可以有一个 ,它的行为就像一个 .

What I did was to create this tab (which is the only in the react-navigation 2 which allows swipeEnabled) and added display: none to its style. This way I can have a <TabNavigator> that behaves like a <StackNavigator>.

这是代码:

const SwipeableNavigator = createMaterialTopTabNavigator({
  FrontCard: FrontCardScreen,
  BackCard: BackCardScreen
},
{
  swipeEnabled: true,
  tabBarOptions: {
    style: { display: "none" }
  }
});

然后在任何你想要的地方调用 .

And then just call <SwipeableNavigator /> wherever you want.