我有下面的底部标签导航器的选项和样式，也是它的3个屏幕代码

const Tab = createBottomTabNavigator();
  
  <Tab.Navigator
    tabBar={props => (
      <View
        style={{
          backgroundColor: 'transparent',
          position: 'absolute',
          left: 0,
          bottom: 0,
          right: 0,
        }}>
        <BottomTabBar {...props} />
      </View>
    )}
    screenOptions={{
      headerShown: false,
      tabBarHideOnKeyboard: true,
      tabBarStyle: {
        position: 'relative',
        justifyContent: 'center',
        alignItems: 'center',
        alignSelf: 'center',
        elevation: 0,
        borderTopLeftRadius: 30,
        borderTopRightRadius: 30,
        bottom: 0,
        height: 55,
        backgroundColor: theme.colors.secondaryContainer,
      },
      tabBarLabelStyle: {
        fontFamily: 'RobotoCondensed-Regular',
        fontSize: 16,
        marginBottom: 10,
      },
      tabBarIconStyle: {
        marginTop: 0,
      },
      tabBarActiveTintColor: theme.colors.error,
      tabBarInactiveTintColor: theme.colors.secondary,
    }}
    sceneContainerStyle={{
      backgroundColor: 'transparent',
      paddingBottom: 70,
    }}
    initialRouteName="SealScreen"
    detachInactiveScreens={false}>
    <Tab.Screen
      options={{
        tabBarShowLabel: false,
        tabBarLabel: 'Seal',
        tabBarIcon: ({color, size}) => (
          <MaterialCommunityIcons name="seal" color={color} size={size} />
        ),
      }}
      name="SealScreen"
      component={SealScreen}
    />
    <Tab.Screen
      options={{
        tabBarShowLabel: false,
        tabBarLabel: 'Slot',
        tabBarIcon: ({color, size}) => (
          <MaterialCommunityIcons
            name="slot-machine"
            color={color}
            size={size}
          />
        ),
      }}
      name="SlotScreen"
      component={SlotScreen}
    />
    <Tab.Screen
      options={{
        tabBarShowLabel: false,
        tabBarLabel: 'Info',
        tabBarIcon: ({color, size}) => (
          <MaterialCommunityIcons
            name="information"
            color={color}
            size={size}
          />
        ),
      }}
      name="InfoScreen"
      component={InfoStackNavigator}
    />
  </Tab.Navigator>

底部选项卡导航器中的最后一个屏幕是以下堆栈导航器组件

const InfoStackNavigator = () => {
    return (
      <Stack.Navigator
        screenOptions={{
          headerShown: false,
        }}>
        <Stack.Screen name="P1" component={PP1} />
        <Stack.Screen name="P2" component={PP2} />
      </Stack.Navigator>
    );
  };

在模拟器（Android）上运行时，我看到以下行为：
如果我单击与堆栈导航器对应的信息按钮（屏幕截图中的最后一个），底部选项卡导航器后面会出现一个奇怪的背景

但是，如果我单击底部选项卡中的按钮，其中默认组件被分配给选项卡。屏幕背景消失