根据反应导航中的活动选项卡更改indicatorStyle

Question

在我的导航栏中，有3个标签，我在整个导航栏中添加了borderRadius和Indicator。我想实现的是

• 启用第一个标签后，borderBottomRightRadius和 borderTopRightRadius必须删除。
• 当中间选项卡处于活动状态时，必须删除整个borderRadius中的indicator。
• 启用第三个标签后，必须删除borderBottomLeftRadius和borderTopLeftRadius

下图显示了当前情况。

这是代码。

const Width = Dimensions.get('window').width;
const tabBarWidth = Width - 30; 

const Navigation = createMaterialTopTabNavigator(
    {
        S1: Screen1,
        S2: Screen2,
        S3: Screen3,
    },
    {
        swipeEnabled: false,
        animationEnabled:false ,
        tabBarOptions: {
            activeTintColor: "white",
            inactiveTintColor: "blue",
            upperCaseLabel: false,
            scrollEnabled: false,
            inactiveBackgroundColor: "white",
            indicatorStyle: {
                height: null,
                top: 0,
                backgroundColor: 'blue',
                borderRadius:10
            },
            style: {
                marginLeft: 15,
                marginRight:15,
                borderWidth: 1,
                borderRadius: 10,
                height: 30,
                borderColor: "blue",
                backgroundColor: "white",
            },
            tabStyle: {
                justifyContent: "center",
                width: tabBarWidth/3
            },
            labelStyle: {
                marginTop: -4
            }
        }
    }
);

我该如何解决？