18

How do I remove the overlay play icon (triangle) that's visible in the center of the video for a second or so every time a video starts playing in an Android WebView?

Thanks in advance!

user2106314
  • 181
  • 1
  • 5
  • I'm using [html5webview](https://code.google.com/p/html5webview/). For a complete compilable project, see surendra's answer in [WebView and and HTML5 – user2106314 Aug 17 '13 at 18:15
  • It's the same on Google Nexus 7 by Asus. – user2106314 Aug 20 '13 at 08:30
  • If I understand correctly, simply adding a "poster" attribute pointing to a 1x1 transparent png file would do the trick :) – fakedob Oct 16 '15 at 19:21

4 Answers4

27

If you said about this picture enter image description here

This is picture I had when tested my app on Android 6.0.

You can hide this picture. For example:

WebView mWebView = (WebView) findViewById(R.id.web_view);
mWebView.setWebChromeClient(new WebChromeClientCustomPoster());

Chrome client class:

private class WebChromeClientCustomPoster extends WebChromeClient {

    @Override
    public Bitmap getDefaultVideoPoster() {
        return Bitmap.createBitmap(10, 10, Bitmap.Config.ARGB_8888);
    }
}

More info read api

AndreyNik
  • 1,581
  • 2
  • 17
  • 24
  • Hi! I'm getting error when cast WebChromeClientCustomPoster class to WebChromeClient. WebView webView = (WebView)appView.getEngine().getView(); webView.setWebChromeClient(new WebChromeClientCustomPoster()); How can I solve this issue. Thanks for answers. – Burak Durmuş Jan 05 '17 at 08:49
  • i did the same but still issue is there. Not resolved issue. – Gyan Swaroop Awasthi Jun 11 '21 at 14:22
  • This is the import line needed: `import android.graphics.Bitmap;` – Adam Taylor Mar 02 '22 at 16:57
10

I found a solution. Just add the 'poster' attribute.

e.g. poster="https://via.placeholder.com/1x1" or poster="noposter"

Note: Empty value are ignored. (poster="")

kohashi
  • 181
  • 2
  • 7
2

Please note that setting poster to an invalid URL (such as "noposter") might trigger a network call and an error event from the video player.

In my projects, I'm setting the poster to a tiny transparent GIF:

poster="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7"

Tzach
  • 12,889
  • 11
  • 68
  • 115
1

Neither poster="noposter" nor poster="null" work for me.

I made it work by creating a placeholder image that has just a white background color and assigned it to the video per DOM.

document.getElementById("myVideo").poster = "noposter.png";