Enabling HTML5 video playback in android WebView?

Question

I am building a simple webview application which is now displaying a website filled with short video clips, using the HTML5 video player. Everything runs ok in the default android web browser but webview wont't play any of the video clips.

The Html code used to play the video clips is as follows:

<video poster preload="true" controls autoplay width="500" height="200">
  <source src="http://www.edmondvarga.com/demo/videos/video.mp4" type="video/mp4">
  </video>

Main Activity.java :

package tscolari.mobile_sample;

import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.webkit.WebSettings;
import android.webkit.WebView;
import android.webkit.WebViewClient;

public class InfoSpotActivity extends Activity {
    /** Called when the activity is first created. */
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);


        setContentView(R.layout.main);

        WebView mainWebView = (WebView) findViewById(R.id.mainWebView);

        WebSettings webSettings = mainWebView.getSettings();
        webSettings.setJavaScriptEnabled(true);

        mainWebView.setWebViewClient(new MyCustomWebViewClient());
        mainWebView.setScrollBarStyle(View.SCROLLBARS_INSIDE_OVERLAY);

        mainWebView.loadUrl("http://server.info-spot.net");
    }

    private class MyCustomWebViewClient extends WebViewClient {
        @Override
        public boolean shouldOverrideUrlLoading(WebView view, String url) {
            view.loadUrl(url);
            return true;
        }
    }
}

How could I enable video playback inside webview?

Answer 1

I know from a previous project we did that you need to use the WebChromeClient to get HTML5 video to play. (And this also gives you hardware accelerated support too - providing you also set the flags on your activity).

Use:

        mainWebView.setWebChromeClient(new WebChromeClient());

Put that before you set the setWebViewClient. You can override the WebChromeClient to intercept any events you need to handle.

And in your AndroidManifest.xml within your activity definition, add:

android:hardwareAccelerated="true"

The following quote is from this SDK Page (scroll down to HTML5 Video support)

In order to support inline HTML5 video in your application, you need to have hardware acceleration turned on, and set a WebChromeClient.

Answer 2

As far as I know android webview has Chromium engine and it does not support HTML 5 videos (H.264) in fullscreen mode. You can try playing video but video goes out of the screen and its not consistence across all the devices. If webview is the main part of the app then its better to switch to mozilla geckoview but it will add 30 to 40 mb to your apk.