Android | Enable Full screen option when loading YouTube or any video in WebView

I was developing an Android application based on 11th and 12th Std Science Practicals, Physics and Chemistry( Gujarat Board and CBSE Board), which involved showing YouTube videos inside WebView.

I know that we should use YouTube Official API for the best integration, but sometimes it just wastes lots of time when we are developing apps. We need to use some quick hacks for easy solutions which work perfectly.

So here is a solution for enabling full screen for Internet Videos for sites like Youtube or any other streaming site when accessed in WebView:

Let’s suppose you have this variable and you have initialized it with findViewById() in onCreate. Also we have used mainActivity as a variable to reference the activity you have the webview inside on.

WebView webView;

Activity mainActivity = this; // If you are in activity

Activity mainActivity = getActivity(); // If you are in fragment

Then after finding the WebView do the following steps:

webView.getSettings().setJavaScriptEnabled(true); //Enable Javascript
webView.getSettings().setDomStorageEnabled(true); //enable local storage for WebView

webView.setWebChromeClient(new WebChromeClient()
        {
            private View mCustomView;
            private WebChromeClient.CustomViewCallback mCustomViewCallback;
            protected FrameLayout mFullscreenContainer;
            private int mOriginalOrientation;
            private int mOriginalSystemUiVisibility;

            public Bitmap getDefaultVideoPoster()
            {
                if (mainActivity == null) {
                    return null;
                }
                return BitmapFactory.decodeResource(mainActivity.getApplicationContext().getResources(), 2130837573);
            }

            public void onHideCustomView()
            {
                ((FrameLayout)mainActivity.getWindow().getDecorView()).removeView(this.mCustomView);
                this.mCustomView = null;
                mainActivity.getWindow().getDecorView().setSystemUiVisibility(this.mOriginalSystemUiVisibility);
                mainActivity.setRequestedOrientation(this.mOriginalOrientation);
                this.mCustomViewCallback.onCustomViewHidden();
                this.mCustomViewCallback = null;
            }

            public void onShowCustomView(View paramView, WebChromeClient.CustomViewCallback paramCustomViewCallback)
            {
                if (this.mCustomView != null)
                {
                    onHideCustomView();
                    return;
                }
                this.mCustomView = paramView;
                this.mOriginalSystemUiVisibility = mainActivity.getWindow().getDecorView().getSystemUiVisibility();
                this.mOriginalOrientation = mainActivity.getRequestedOrientation();
                this.mCustomViewCallback = paramCustomViewCallback;
                ((FrameLayout)mainActivity.getWindow().getDecorView()).addView(this.mCustomView, new FrameLayout.LayoutParams(-1, -1));
                mainActivity.getWindow().getDecorView().setSystemUiVisibility(3846);
            }
        });

That’s all folks. Now wait for the gradle build to complete and then voila you will be able to access all the videos full screen.

Thanks for reading! Have a good day! Here we aim to please.