Блог

Я использую

@react-навигация/нижние вкладки материала

как мне удалить оранжевый цвет фона или сделать его прозрачным.

так что это похоже на плавающий

наймите мой код

 const MainTabScreen = () => (
<Tab.Navigator
  initialRouteName="Home"
  activeColor="#e9118c"
  inactiveColor="#95a5a6"
  shifting={true}
  sceneAnimationEnabled={true}
  tabBarBadge={true}
  style={{ 
    backgroundColor: 'tomato',
   //backgroundColor: 'transparent',
   //opacity:0.7
  }}
  barStyle={{ 
    backgroundColor:'#fff',
    borderRadius:50,
    marginBottom:10,
    marginTop:5,
    paddingHorizontal:12,
    paddingTop:12,
    height:80,
    borderColor:'#fff',
    marginHorizontal:5
  }}
>
  <Tab.Screen
    name="Home"
    component={HomeScreen}
    options={{
      tabBarLabel: 'Home',
      tabBarIcon: ({ color }) => (
        <Icon name="ios-home" color={color} size={26} />
      ),
    }}
  />
</Tab.Navigator>
  

);

Вы должны использовать position:’absolute’ в стиле панели, как показано ниже, стили использовать не нужно.

      barStyle={{
        backgroundColor: '#fff',
        borderRadius: 50,
        marginBottom: 10,
        marginTop: 5,
        paddingHorizontal: 12,
        paddingTop: 12,
        height: 80,
        borderColor: '#fff',
        marginHorizontal: 5, 
        position: "absolute",
      }}>