YoutubePlayer - Navigation Bar Overlay

Question

I am using YoutubePlayerSupportFragment in my application. I am adding YouTubePlayer.FULLSCREEN_FLAG_CUSTOM_LAYOUT flag. From the documentation I know my player won't rebuffer after exiting from full screen, but now I have to handle Action Bar and Navigation Bar. But the documentation doesn't say or point to how I can handle these cases.

Now the problem I am facing is so far only occurring in Asus Nexus 7 OS 5.1.1. I also have an LG G2 D802 OS 4.4.2, Samsung Galaxy TAB GT P5113 OS 4.4.2 and Samsung Galaxy Tab SM-T310 OS 4.2.2 and they do not throw Overlay Error. In the Log cat I get the following Message.

03-09 15:54:39.760  11203-11203/com.jadoo.jadooplus W/YouTubeAndroidPlayerAPI﹕ 
YouTube video playback stopped due to unauthorized overlay on top of player. 
The YouTubePlayerView is obscured by android.view.View{c067400 V.ED.... ........ 0,736-1280,800 #1020030 android:id/navigationBarBackground}.
Top edge 24 px above YouTubePlayerView's bottom edge. .

So I know the problem is in the Navigation Bar. Navigation Bar is overlaying on top of the Player.

My Questions are these

• Why am I not getting the same Error on other devices?
• How Can I handle System Navigation Bar, so that when I am in fullscreen I can still get Navigation Bar if/when I want to stop the player (on back press) without overlaying it on the player.

I tried Listening for Click Events But in Full Screen Mode I can't get any so I tried Overriding dispatchTouchEvent() in the Activity and get a Click event my self but even that doesn't help me get rid of Navigation Bar in Time (before time actually).

I also tried listening for System UI change via OnSystemUiVisibilityChangeListener and hiding navigation bar there (but again perhaps too early to hide navigation bar).

I have set android:theme="@style/Theme.AppCompat.NoActionBar" in android manifest file so I don't really need to hide the action/status bar just the navigation bar.

Also if anyone can confirm it is device specific issue, it'll be a great help.

Answer 1

So this is how went around the problem (this is still not a solution but its the closest I can get to).

So, I added an OnSystemUiChangeListener in the onInitializationSuccess of YoutubePlayerSupportFragment (or YoutubePlayerFragment).

(View) getView().getParent().setOnSystemUiVisibilityChangeListener();

provide an implemented object of OnSystemUiChangeListener.

Override the method onSystemUiVisibilityChange() like so:

@Override
public void onSystemUiVisibilityChange(int visibility) {

    if (visibility == View.SYSTEM_UI_FLAG_VISIBLE) {
        scheduleNavigationBarHide();
    }
    else if (visibility == View.SYSTEM_UI_FLAG_HIDE_NAVIGATION || visibility == View.SYSTEM_UI_FLAG_LOW_PROFILE
            || visibility == View.SYSTEM_UI_FLAG_FULLSCREEN) {
        if (navigationBarHandler != null) {
            navigationBarHandler.cancel();
            navigationBarHandler.purge();
            navigationBarHandler = null;
        }
    }
}

Provide definition for the method scheduleNavigationBarHide().

private void scheduleNavigationBarHide() {


    if (navigationBarHandler != null) {
        Log.d(TAG, "Canceling navigationBarHandler.");
        navigationBarHandler.cancel();
        navigationBarHandler.purge();
        navigationBarHandler = null;
    }

    if (mContext != null && mContext instanceof JadooTVActivity) {
        navigationBarHandler = new Timer();

        navigationBarHandler.schedule(new TimerTask() {
            public void run() {
                ((JadooTVActivity) mContext).runOnUiThread(new Runnable() {

                    @Override
                    public void run() {
                        if (!isPlayerSqueezed) {
                            hideAsImmersiveNavigationBar(Config.context);
                        }
                        else {
                            Utils.showNavigationBar(Config.context);
                        }
                    }
                });
            }
        }, 500);
    }
}

So finally hideAsImmersiveNavigationBar() as you might have guessed this works by making the Navigation Bar temporarily immersive. Here's how

private void hideAsImmersiveNavigationBar(Activity activity) {

    if(activity != null)
    {   View decorView = activity.getWindow().getDecorView();

        int uiOptions = View.SYSTEM_UI_FLAG_HIDE_NAVIGATION
                | View.SYSTEM_UI_FLAG_FULLSCREEN | View.SYSTEM_UI_FLAG_IMMERSIVE;
        decorView.setSystemUiVisibility(uiOptions);
    }
}

Later when player has closed you might wanna bring back the Navigation Bar. Change the UI Flags to int uiOptions = View.SYSTEM_UI_FLAG_VISIBLE | View.SYSTEM_UI_FLAG_FULLSCREEN;

Finally a little disclaimer: I have provided a list of devices the application has been tested, I don't know if this will work on every devices. If you do find a device where the issue is persistent then feel free to comment. Also Immersive mode was added from API 19 so the solution will not work on any device before that, but I only had the issue on one device running API 21. All the older devices worked well. Also If/when the Navigation Bar stays for 1 second, we still get the overlay error.

Answer 2

change activity to full screen when youtube is fullscreen.

 void toggleFullScreen(boolean goFullScreen){   
    if(goFullScreen){
        getWindow().addFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN);
        getWindow().clearFlags(WindowManager.LayoutParams.FLAG_FORCE_NOT_FULLSCREEN);
    }else{ 
        getWindow().addFlags(WindowManager.LayoutParams.FLAG_FORCE_NOT_FULLSCREEN);
        getWindow().clearFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN);
    } 

    yourView.requestLayout(); 
}