在底部标签栏上应用borderRadius

Question

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

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

Screen of bottom bar

Answer 1

您可以使用样式

删除空白

ColA    ColB   ColC 
11        AA   Not-Found
12        BB   Found
13        CC   Empty

希望这会有所帮助

Answer 2

这是我的方法：

<Tab.Navigator
   tabBarOptions={{
      borderTopLeftRadius: 40,
      borderTopRightRadius: 40,
      marginTop: -40,
    }}

这将使背景成为屏幕。但是，您还需要在每个屏幕上添加marginBottom：40，以便可以完全查看任何组件。