我在具有底部标签导航器(来自react-navigation)的视图中使用react-navigation-animated-switch
,这是我的代码:
import { createBottomTabNavigator } from 'react-navigation';
import createAnimatedSwitchNavigator from 'react-navigation-animated-switch';
import { Transition } from 'react-native-reanimated';
const TimelineStack = createAnimatedSwitchNavigator({
Timeline: {
screen: Timeline,
navigationOptions: {
header: null,
}
},
NewView: {
screen: NewView,
navigationOptions: {
header: null,
}
}
},
{
transition: (
<Transition.Together>
<Transition.Out
type="fade"
durationMs={400}
interpolation="easeIn"
/>
<Transition.In type="fade" durationMs={500} />
</Transition.Together>
),
initialRouteName: 'Timeline'
}
);
TimelineStack.navigationOptions = ({ navigation }) => {
let tabBarVisible = true;
if (navigation.state.index > 0) {
tabBarVisible = false;
}
return {
tabBarVisible,
};
};
const LoggedInNavigator = createBottomTabNavigator({
Timeline: TimelineStack,
A: A,
B: B,
C: C,
D: D,
}, {
defaultNavigationOptions: ({ navigation }) => ({
tabBarIcon: ({ focused, horizontal, tintColor }) => {
const { routeName } = navigation.state;
let iconName = 'ellipsis-h';
return <FontAwesome5
name={iconName}
style={
{ color: focused ? commonStyles.mainColor : commonStyles.inactiveBottomBarColor, fontSize: 20 }
} />;
},
}),
tabBarOptions: {
activeTintColor: commonStyles.mainColor,
inactiveTintColor: commonStyles.inactiveBottomBarColor,
labelStyle: {
fontSize: 12,
},
style: {
backgroundColor: commonStyles.mainBGColor,
},
}
});
然后,当我按下按钮时,我会这样做:
onPress={() => this.props.navigation.navigate('NewView')}>
和底部标签栏出现故障并闪烁白色一秒钟,然后返回主要背景颜色,我制作了一段视频以更好地理解
有人可以告诉我如何解决该故障吗?
谢谢