如何在 React Native 中更改选项卡导航器的颜色样式？

Question

我是一个反应原生的新手。我在主屏幕上使用选项卡导航器，无法理解如何更改活动和非活动选项卡颜色样式。

export const MyApp = TabNavigator({
  Asset: {
   screen: AssetScreen
  },
 Sensors: {
  screen: sensorsStack
 },
 Settings: {
  screen: settingStack
 },
},{
tabBarPosition: 'bottom',
animationEnabled: true,
swipeEnabled:false,
tabBarOptions: {
upperCaseLabel: false,
showIcon: true,
activeBackgroundColor:'#2394C7',
inactiveBackgroundColor:'grey',
tabStyle:{
    marginTop:10,
    height :53,
    borderRightWidth:1
},
labelStyle: {
    fontSize: 15,
    fontWeight:'bold',
     marginTop: 0,
     color :'#ffffff'
  },
 },
});

如有任何建议，我们将不胜感激。

Answer 1

可以在tabBarOptions下使用activeBackgroundColor和inactiveBackgroundColor属性设置活动和非活动标签的颜色。

更多信息请参阅文档here。

如何在 React Native 中更改选项卡导航器的颜色样式？

How to change colour styles for tab navigator in react native?

tabnavigator

react-native