反应本机应用程序中的底部标签背景颜色

Question

我在我的博览会应用程序中使用了 react-navigation 和一个底部选项卡。
我已经指定了一些这样的选项：

  <TabStack.Navigator
      initialRouteName="Compte"
      tabBarOptions={{
        activeTintColor: EAppColors.PRIMARY_GREEN,
        labelStyle: {
          fontFamily: 'BeVietnam-Regular',
          fontSize: normalize(12),
          fontStyle: 'normal',
          lineHeight: 20,
          textAlign: 'center',
          marginBottom: 5,
        },
        tabStyle: {
          alignItems: 'center',
          justifyContent: 'center',
          height: 40,
          marginTop: '3.5%',
        },
        style: { paddingHorizontal: '5%' },
      }}>  

我需要在标签栏的左侧和右侧放置一些顶部半径，但后面的视图保持其颜色......

如何更改后面视图的颜色？ （图片左上角灰色）

Answer 1

用 <TabStack.Navigator></TabStack.Navigator> 和一些 View 包裹您的 backgroundColor

像这样

<View style={{ flex:1, backgroundColor: 'red' }}> // Or whatever color you want
  <TabStack.Navigator>
      // All TabScreens etc.. here
  </TabStack.Navigator>
</View>