react-native - 在底部标签栏上应用borderRadius

Question

我想在底部标签栏上应用半径，但在背景上我有一个白色的视图。如何删除此白色视图？

const BottomTabNavigator = createBottomTabNavigator({
    HomeScreenStack,
    // ArchiveScreenStack,
    // SettingsScreenStack,
    },
    {
        tabBarOptions: {
            style:{borderRadius:21, backgroundColor:"#000000"}
        }
    }
)

底栏画面

标签： react-native

Answer 1

您可以使用样式删除空白

const DEVICE_WIDTH = Dimensions.get('window').width;

const BottomTabNavigator = createBottomTabNavigator({
    HomeScreenStack,

    },
    {
        tabBarOptions: {
            style:{
              borderTopLeftRadius:21, 
              borderTopRightRadius:21,
              backgroundColor:"#000000",
              position:'absolute',
              bottom: 0,
              padding:10,
              width: DEVICE_WIDTH,
              height: 54,
              zIndex: 8 
           }
        }
    }
)

希望这可以帮助