如何在本机反应中更改材质顶部选项卡导航器的容器颜色答案

【问题标题】：How to change container color of material top tab navigator in react native如何在本机反应中更改材质顶部选项卡导航器的容器颜色
【发布时间】：2022-06-16 15:18:40
【问题描述】：

我是 React Native 的新手，我正在尝试创建一个材质顶部选项卡导航器。当我尝试为其赋予边框半径时，其后面会显示默认颜色。如何更改该颜色以使其不显示在选项卡导航器后面？

我也尝试过position: 'absolute 和overflow: 'hidden'，但它隐藏了整个导航器。

下面是代码

screenOptions={{
      tabBarActiveTintColor: '#fff',
      tabBarInactiveTintColor: '#E26F1E',
      tabBarLabelStyle: {fontSize: 12, fontWeight: 'bold'},
      tabBarStyle: {
        backgroundColor: '#ebecf9',
        borderRadius: 30,
        overflow: 'hidden',
        
      },
      tabBarIndicatorStyle: {
            height: 40,
            backgroundColor: '#E26F1E',
            borderRadius:30,
            top: 4,
            marginHorizontal: 3,
            width: 117  
      }
      
    }}

【问题讨论】：

标签： react-native react-native-tabnavigator

【解决方案1】：

这里是关于自定义tabBar的示例代码：https://github.com/Heanphearak/react-native-deploy/blob/main/App.js

【讨论】：