reactjs - 这种卡片导航可以用 React Native 实现吗？

Question

好的，React Native 的新手，并试图确定这种卡片导航系统。像这样，但你可以点击向左或向右导航而不是滚动：https ://dribbble.com/shots/8257559-Movie-2-0

另一个例子（开头）：https ://dribbble.com/shots/4466216-Yellow-shadow

我的 UI 基本上看起来像这样：

在哪里（理想情况下），当卡片移出屏幕时，不透明度会降低，并且从上面的示例中合并了缩放动画。想用卡片向上滑动以填满屏幕。

我查看了https://wix.github.io/react-native-navigation/docs/before-you-start/和基本的导航教程，但想看看 github 上是否有相关的插件或一个明确的地方可以潜入。我怎样才能完成这种卡片式导航？

Answer 1

这虽然很复杂，但无论您选择哪个导航库，这绝对是可行的。我会这样实现它react-navigation：

• 创建一个包含水平卡片列表的屏幕。您可以使用默认Animated模块或react-native-reanimated.

• 在屏幕之间导航时使用react-native-shared-element为图像设置动画。

其余的实际上与导航没有太大关系，更多的是在手势和动画领域。