在 React-Navigation 中为 Tabnavigator 设置 backgroundColor 和 Badge

Question

在带有 React-Navigation 的 React-Native 中，我有一个像这样的 Tabnavigator：

const testScreenNavigator = TabNavigator({
    Tab1: { screen: Tab1Screen },
    Tab2: { screen: Tab2Screen },
    Tab3: { screen: Tab3Screen },
});
testScreenNavigator.navigationOptions = {
    title: 'MY TITLE',
    header: {
        titleStyle:{
        },
        style:{
// how to set the options?
        },
    }  
}

现在我想做两件事：

1. 设置 Android 中选项卡的背景颜色：'red'（不是 iOS 底部选项卡）
2. 在 Tab1 旁边有一个徽章：例如

标签 1 (2) |标签 2 | Tab3

此致

Answer 1

• 设置 Header 和 Tab 的背景颜色

要为页眉设置背景颜色，请使用 navigationOptions，要为选项卡设置背景颜色，请使用 tabBarOptions。见下面代码

const testScreenNavigator = TabNavigator ({
  Tab1: { screen: RecentChatsScreen },
  Tab2: { screen: AllContactsScreen },
  Tab3: { screen: AllContactsScreen}
}, {
  tabBarOptions : {
    style: {
      backgroundColor: '#42a5f5',
    }
  }
});

testScreenNavigator.navigationOptions = {
  title: 'MY TITLE',
  header: {
    style: {
      backgroundColor: '#42a5f5',
    }
  },
};

下面是输出