Show HTML5 Video Fullscreen

Question

I have a webview that has html video inside it. I want to show this video fullscreen so I override onShowCustomView of my WebChromeClient to use a

Answer 1

Well after struggling with this for a while, I finally found the cause. In Android 4.x you must show the controls by using the html 'controls' attribute in the 'video' tag. Once you are showing these controls, you can click on the fullscreen button which will then call 'onShowCustomView'. Since embedded video is available in 4.x and you have the option to go to fullscreen with the controls, onShowCustomView will not be called automatically on play. Unfortunately, this is very poorly documented in the Android documentation.

Answer 2

This works for me.

I found a 'quirks solution' in making the web app with vimeo videos. I tested two devices. One is Android 4.2.x version, another is 4.4.x version. One is able to play video in fullscreen mode, another is not able to.

After reading official document 'Migrating to WebView in Android 4.4', I found that there are different 'UserAgent' names in two devices.

One has this userAgent.

Mozilla/5.0 (Linux; Android 4.4.2; SHV-E300L Build/KOT49H) AppleWebKit/537.36 (KHTML, like Gecko) Version/4.0 Chrome/30.0.0.0 Mobile Safari/537.36

Another has this.

Mozilla/5.0 (Linux; Android 4.4.4; SHV-E370K Build/KTU84P) AppleWebKit/537.36 (KHTML, like Gecko) Version/4.0 Chrome/33.0.0.0 Mobile Safari/537.36

I think the chrome version is the solution making fullscreen video. So I changed the chrome version to 30.x.

WebSettings s = mWebView.getSettings();
//Change UserAgent to play fullscreen vimeo's videos.
String agent = s.getUserAgentString();
String p = "(Chrome/[0-9]+\\.[0-9]+\\.[0-9]+\\.[0-9]+)";
Pattern pattern = Pattern.compile(p);
Matcher matcher = pattern.matcher(agent);
if(matcher.find()) {
    agent = matcher.replaceFirst("Chrome/30.0.0.0");
}
s.setUserAgentString(agent);

Oh~~ I can sleep... (sorry with my poor english)