反应导航动画切换导航器闪烁

时间:2020-05-21 07:43:35

标签: reactjs react-native react-navigation react-native-reanimated

我有一个关于React Navigation Switch Navigator的问题。

我自己创建了一个带有动画开关Navigator的底部导航器。结构是这样的。

class A extends Component {
  render() {
    return (
      /* A content */
    )
  }
}

const B = createStackNavigator({
  b1: {screen: B1},
  b2: {screen: B2}
})

const BottomNav = createAnimatedSwitchNavigator({
  a: {screen: A},
  b: {screen: B}
},{
  /* transition config */
})

当我在Android设备上实现此功能时,它闪烁黑色,然后当我从B导航到A时,下一个屏幕淡入,而当我从A导航到B时,它工作正常。但是我想要的是前一个屏幕淡出,下一个屏幕淡入。 尝试更改结构时,我注意到从堆栈导航器屏幕导航时,它会闪烁一会儿。

它在iOS设备上正常工作。

我还尝试通过使用堆栈导航器创建React Component来解决这个问题。

const BNav = createStackNavigator({
  b1: { screen: B1 },
  b2: { screen: B2 },
});
const AppContainer = createAppContainer(BNav);
class B extends Component {
  render() {
    return (
      <View>
        <AppContainer />
      </View>
    );
  }
}

下面是这些库的版本。

"react-navigation": "4.3.9",
"react-native-screens": "^2.0.0",
"react-navigation-stack": "2.5.1",
"react-native-safe-area-context": "^0.6.0",
"@react-native-community/masked-view": "^0.1.0",
"react-native-reanimated": "1.8.0",
"react-navigation-animated-switch": "0.5.12",

这是一个错误吗?如果是这样,我可以在哪里报告?

感谢您阅读。

0 个答案:

没有答案