react-native - 如何在屏幕转换动画期间防止用户交互？

Question

当使用 StackNavigator 和 fade 过渡在屏幕之间导航时，用户可以在过渡动画期间单击并可能点击 TouchableOpacity 在导航离开的屏幕上。 TouchableOpacity 注册点击，因此应用会做出相应的响应。这给“快速点击”用户带来了问题，他们点击按钮导航到新屏幕并立即点击他们认为新按钮所在的位置，但实际上是点击前一个屏幕上的按钮。

有没有办法在这些过渡动画期间阻止任何用户交互？我试过将过渡持续时间设置为 0，如下所示:

transitionConfig: () => ({
    transitionSpec: {
      duration: 0
    }
})

但问题依旧。

我不想完全禁用动画，因为它对大多数用户来说足够快并且他们喜欢动画。

Answer 1

所以在你的情况下你可以做几件事

• 您可以使用 React Native Activity Indicator -> View
• 您可以使用 Overlay Library -> react-native-loading-spinner-overlay -> 查看 GitHub
• 如果你喜欢像 facebook/instagram 这样加载 -> 然后使用 react-native-easy-content-loader -> 查看 GitHub