Android: UNAUTHORIZED_OVERLAY with react-native-navigation DRAWER

[marksturm]

Thanks for updating it but... the inlineplayer does not work on android in any productive way if you use the drawer

the problem is the "UNAUTHORIZED_OVERLAY"

This was a also a problem back in 2017 and 2018 ...

I used: "react-native": "0.60.5", "react-navigation": "^4.0.5", "react-navigation-drawer": "^2.2.1", "react-navigation-stack": "^1.7.3"

[marksturm]

I made another test - it even stopped if i open a modal. Overtime naything overlays the view... what a pitty

[davidohayon669]

how do you use the drawer? where is the player mounted? Are you sure no other view is blocking the player? even transparent ones

[shruti8597]

Same issue. Works well with full screen. Without full screen runs for a second then stops.

Starts working if I take it out of drawer.

[du-hernandez]

Exactly the same problem for me too

[sikeeoh]

same issue

[elomapezoumon]

Hi Guys, I have the same issue, please help !

[elomapezoumon]

Hi Guys I found an solution wich worked for me :

const DrawerNavigator = () => ( /* The content of your drawer navigator goes here */ )

<Stack.Navigator headerMode='none'> /* This Stack is for the drawer navigation / <Stack.Screen name="MyDrawerNavigator" component={DrawerNavigator} ></Stack.Screen> / Place the video screen at outside the drawer */ <Stack.Screen name="VideoComponent" component={VideoComponent} /> </Stack.Navigator>

[girish54321]

Put the you youtube Component on top level stack not in any Drawer or BottomTab.Navigator

for me i loaded the Component before any Drawer or BottomTab.Navigator

const HomeTabsNavigator = (): React.ReactElement => (
  <BottomTab.Navigator
    // screenOptions={TabBarVisibleOnRootScreenOptions}
    initialRouteName={"myView"}
    tabBar={(props) => <HomeBottomNavigation {...props} />}
  >
    <BottomTab.Screen name="myView" component={HomeBottomTabsNavigator} /> //<====my list if video screen here
    
  </BottomTab.Navigator>
);
`

export const HomeNavigator = (): React.ReactElement => ( .  /// <=====my Drawer stack
  <Drawer.Navigator
    screenOptions={{ gestureEnabled: true }}
    drawerContent={(props) => <HomeDrawer {...props} />}
  >
    <Drawer.Screen name="Home" component={HomeTabsNavigator} />

    <Drawer.Screen name="News & PR" component={NewsAndPRNavigator} />
  </Drawer.Navigator>

//AUTH LOADING . this stacks loads before any other stack 
export const AuthLoadingNavigator = (): React.ReactElement => (
  <Stack.Navigator headerMode="none">
    <Stack.Screen name="HomeNavigator" component={HomeNavigator} />
    <Stack.Screen name="VideoPlayer" component={VideoPlayer} /> .  <=== youtube player here 
  </Stack.Navigator>
);
`

[Harikasai999]

hi, can any one solve this issue?? i am using "@react-navigation/drawer". So i am getting error "UNAUTHORIZED_OVERLAY". Please help me..

[girish54321]

Try adding the your YouTube player screen before drawer stack @Harikasai999

[xdarkleonx]

Any solutions? girish54321 and elomapezoumon workaround is not working