如何更改活动/选定选项卡的颜色？

Question

我找不到在标签栏中更改标题颜色的方法。 这是我的代码：

Home:{ 
screen: TabNavigator({ 
    Home: { 
    screen: HomeScreen, 
    navigationOptions: ({ navigation }) => ({ 
     title: 'Home', 
     tabBarIcon: ({ tintColor, focused }) => (
     <Ionicons 
     name={focused ? 'ios-home' : 'ios-home-outline'} 
     size={26} 
     style={{ color: focused ? `${tabBarColor}` : tintColor}} 
     /> 
    ), 
     //headerStyle: {backgroundColor: "#553A91"}, 
     //headerTitleStyle: {color: "#FFFFFF"}, 
     header: null, 
    }), 
    }, 
    Profile: { 
    screen: ProfileScreen, 
    navigationOptions: ({ navigation }) => ({ 
     title: 'Profile', 
     tabBarIcon: ({ tintColor, focused }) => (
     <Ionicons 
     name={focused ? 'ios-people' : 'ios-people-outline'} 
     size={26} 
     style={{ color: focused ? `${tabBarColor}` : tintColor }} 
     /> 
    ), 
     //headerStyle: {backgroundColor: "#553A91"}, 
     //headerTitleStyle: {color: "#FFFFFF"}, 
     header: null, 
    }), 
    }, 
}), 
} 

我搜查，但未能找到一个方法来做到这一点。 当选项卡没有被选中时，我希望颜色成为默认的灰色，但是当选中选项卡时，颜色为我的tabBarColor颜色。

我该怎么做？

在此先感谢！

Answer 1

不知道你在哪里搜索，但花了30秒才看到它。

在TabNavigator Docs，很显然，你需要使用activeTintColor

activeTintColor：活动选项卡的标签和图标的颜色

例子：

const MyApp = TabNavigator({ 
    Home: { 
    screen: MyHomeScreen, 
    }, 
    Notifications: { 
    screen: MyNotificationsScreen, 
    }, 
}, { 
    tabBarOptions: { 
    activeTintColor: '#e91e63', 
    }, 
});