Full Screen Not Available When Uploading YouTube Video to WebView

Question

I have so much web browsing in my Android app. But this time I had a strange problem loading YouTube videos in WebView.

Check out this screenshot of a YouTube video uploaded to a Chrome browser that has full screen mode.

Below is a screenshot of my application in which I uploaded the same video to a web view. But he does not have such a full-screen option.

You can see the changes in both images. Both screenshots are taken from one device. But still it looks different.

My code for downloading via WebView is in this pasteboard .

Update

I also saw this issue being reported here . But I do not know if there is a solution for this available or not.

Answer 1

iFrame is an option, but you can try this

Android WebView and WebChromeClient class extensions that allow fully working HTML5 video support

VideoEnabledWebView

I have not tried this yet, but hope will help you.

Answer 2

Make the following changes to your java file:

 view.setWebViewClient(new Browser()); view.setWebChromeClient(new MyWebClient()); 

---

and add this class 2, which is a cool browser and MyWebClient class in java file

 class Browser extends WebViewClient { Browser() {} public boolean shouldOverrideUrlLoading(WebView paramWebView, String paramString) { paramWebView.loadUrl(paramString); return true; } } public class MyWebClient extends WebChromeClient { private View mCustomView; private WebChromeClient.CustomViewCallback mCustomViewCallback; protected FrameLayout mFullscreenContainer; private int mOriginalOrientation; private int mOriginalSystemUiVisibility; public MyWebClient() {} public Bitmap getDefaultVideoPoster() { if (MainActivity.this == null) { return null; } return BitmapFactory.decodeResource(MainActivity.this.getApplicationContext().getResources(), 2130837573); } public void onHideCustomView() { ((FrameLayout)MainActivity.this.getWindow().getDecorView()).removeView(this.mCustomView); this.mCustomView = null; MainActivity.this.getWindow().getDecorView().setSystemUiVisibility(this.mOriginalSystemUiVisibility); MainActivity.this.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.this.getWindow().getDecorView().getSystemUiVisibility(); this.mOriginalOrientation = MainActivity.this.getRequestedOrientation(); this.mCustomViewCallback = paramCustomViewCallback; ((FrameLayout)MainActivity.this.getWindow().getDecorView()).addView(this.mCustomView, new FrameLayout.LayoutParams(-1, -1)); MainActivity.this.getWindow().getDecorView().setSystemUiVisibility(3846); } } 

Answer 3

If I understood correctly, you have an iframe containing the second iframe (one of them). Try adding the allowfullscreen attribute to the "parent" iframe.

For full browser support, it should look like this:

 <iframe src="your_page_url" allowfullscreen="allowfullscreen" mozallowfullscreen="mozallowfullscreen" msallowfullscreen="msallowfullscreen" oallowfullscreen="oallowfullscreen" webkitallowfullscreen="webkitallowfullscreen"> </iframe> 

Answer 4

 //Add WebChromeClient to your webview //With navigation option and player controls overlapping handlled. class UriChromeClient extends WebChromeClient { private View mCustomView; private WebChromeClient.CustomViewCallback mCustomViewCallback; protected FrameLayout mFullscreenContainer; private int mOriginalOrientation; private int mOriginalSystemUiVisibility; @SuppressLint("SetJavaScriptEnabled") @Override public boolean onCreateWindow(WebView view, boolean isDialog, boolean isUserGesture, Message resultMsg) { mWebviewPop = new WebView(getApplicationContext()); mWebviewPop.setVerticalScrollBarEnabled(false); mWebviewPop.setHorizontalScrollBarEnabled(false); mWebviewPop.setWebViewClient(new MyWebViewClient()); mWebviewPop.getSettings().setSupportMultipleWindows(true); mWebviewPop.getSettings().setJavaScriptEnabled(true); mWebviewPop.getSettings().setUserAgentString(mWebviewPop.getSettings().getUserAgentString().replace("; wv", "")); // mWebviewPop.getSettings().setUserAgentString(USER_AGENT); mWebviewPop.getSettings().setSaveFormData(true); mWebviewPop.setLayoutParams(new FrameLayout.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.MATCH_PARENT)); mContainer.addView(mWebviewPop); WebView.WebViewTransport transport = (WebView.WebViewTransport) resultMsg.obj; transport.setWebView(mWebviewPop); resultMsg.sendToTarget(); return true; } @Override public void onCloseWindow(WebView window) { Log.d("onCloseWindow", "called"); } // public Bitmap getDefaultVideoPoster() { if (mCustomView == null) { return null; } return BitmapFactory.decodeResource(getApplicationContext().getResources(), 2130837573); } public void onHideCustomView() { ((FrameLayout) getWindow().getDecorView()).removeView(this.mCustomView); this.mCustomView = null; getWindow().getDecorView().setSystemUiVisibility(this.mOriginalSystemUiVisibility); 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.mCustomView.setBackgroundColor(Color.BLACK); this.mOriginalSystemUiVisibility = getWindow().getDecorView().getSystemUiVisibility(); this.mOriginalOrientation = getRequestedOrientation(); this.mCustomViewCallback = paramCustomViewCallback; ((FrameLayout) getWindow().getDecorView()).addView(this.mCustomView, new FrameLayout.LayoutParams(-1, -1)); getWindow().getDecorView().setSystemUiVisibility(3846); this.mCustomView.setOnSystemUiVisibilityChangeListener(new View.OnSystemUiVisibilityChangeListener() { @Override public void onSystemUiVisibilityChange(int visibility) { if ((visibility & View.SYSTEM_UI_FLAG_HIDE_NAVIGATION) == 0) { updateControls(getNavigationBarHeight()); } else { updateControls(0); } } }); } void updateControls(int bottomMargin) { FrameLayout.LayoutParams params = (FrameLayout.LayoutParams) this.mCustomView.getLayoutParams(); params.bottomMargin = bottomMargin; this.mCustomView.setLayoutParams(params); } } int getNavigationBarHeight() { Resources resources = getResources(); int resourceId = resources.getIdentifier("navigation_bar_height", "dimen", "android"); if (resourceId > 0) { return resources.getDimensionPixelSize(resourceId); } return 0; } private void loadURL(WebView view, String url) { ConnectivityManager cm = (ConnectivityManager) getApplication().getSystemService(Context.CONNECTIVITY_SERVICE); NetworkInfo netInfo = cm.getActiveNetworkInfo(); if (netInfo != null && netInfo.isConnected()) { view.setVisibility(View.VISIBLE); noNetworkText.setVisibility(View.GONE); view.loadUrl(url); } else { Log.d(TAG, "loadURL: no network"); view.setVisibility(View.INVISIBLE); noNetworkText.setVisibility(View.VISIBLE); } } }