React native react native CreateBoottomTabNavigator在Android上显示奇怪的选项卡栏

我正在使用

react导航

createBottomTabNavigator

创建底部选项卡导航。选项卡栏在iOS上显示良好，但在Android上显示如下：

我不知道是什么导致了这种奇怪的风格。下面是我创建底部选项卡栏的代码：

({
tabBarIcon:（{聚焦，颜色，大小}）=>{
让我来看看NSRC
如果（route.name==‘报警’）{
ICONRC=require（“../img/ic_alarm.png”）
}else if（route.name==='Settings'）{
ICONRC=require（“../img/ic_settings.png”）
}
返回(
)
}
})}
禁忌选项={{
activeTintColor:GlobalConfig.theme.colors.primary，
InactiveIntColor:GlobalConfig.theme.colors.tabBarIconUnselected
}}>

每个选项卡都是堆栈导航器。报警堆栈导航配置如下：

如果您过去遇到过这个问题，并且知道如何解决它，请让我知道。如果您需要任何其他信息来解决问题，也请告诉我

---

谢谢

我不知道为什么选项卡栏会出现在Android上，但我可以通过在

tabBarOptions

中指定选项卡栏颜色来修复它，如下所示

            tabBarOptions={{
              activeTintColor: GlobalConfig.theme.colors.primary,
              inactiveTintColor: GlobalConfig.theme.colors.tabBarIconUnselected,
              style: {
                backgroundColor: GlobalConfig.theme.colors.tabBarBackground
              }
            }}

---

通过指定上面的选项卡栏背景色样式，整个选项卡栏如预期的一样为统一的灰色。

经过长期的努力，我终于找到了解决方案

海拔：0

在选项卡栏样式上设置此选项将解决此问题

范例-

tabBarOptions={{
        showIcon: true,
        showLabel: true,
        activeTintColor: COLORS.tabSelected,
        inactiveTintColor: COLORS.tabNormal, 
        style: {
          backgroundColor:'transparent',
          borderTopWidth: 0,
          position: 'absolute',
          elevation: 0  // <-- this is the solution
        },
        labelStyle: {
          fontSize: 12,
        },
      }}>

选项卡选项={{
showIcon：没错，
showLabel:true，
activeTintColor:COLORS.tabSelected，
InactiveIntColor:COLORS.tabNormal，
风格：{
背景颜色：'透明'，
borderTopWidth:0，
位置：'绝对'，
标高：0//

以下是输出屏幕截图：

在设置“标高：0”之前，它是这样的

设置“标高：0”后，它看起来非常完美