在android上的html5视频标签中禁用默认的丑陋海报图像

Posted 2023-05-08

【中文标题】在android上的html5视频标签中禁用默认的丑陋海报图像

【英文标题】：Disable default ugly poster image in html5 video tag on android

【发布时间】：2017-02-13 23:10:28

【问题描述】：

在android上，使用html5视频标签加载视频，在视频加载之前，占位符图像是一个灰色的图像，上面有一个大的“播放”图标，假设我没有视频的海报图片所以我无法替换它，有什么办法可以禁用丑陋的吗？

【参考方案1】：

我知道这个问题很老，但我一直在寻找这个问题的答案。原来WebChromeClient 有一个getDefaultVideoPoster 方法。所以你可以这样做：

webView.setWebChromeClient(new WebChromeClient() 
    @Override public Bitmap getDefaultVideoPoster() 
        final Bitmap bitmap = Bitmap.createBitmap(1, 1, Bitmap.Config.RGB_565);
        Canvas canvas = new Canvas(bitmap);
        // Use whatever color you want here. You could probably use a transparent color
        canvas.drawARGB(255, 0, 0, 0);
        return bitmap;
    
);

我不一定会在每次调用此方法时都制作新的位图，但我相信你明白了。

【讨论】：

canvas.drawARGB(255, 0, 0, 0);

还有一个建议：如果你希望这张海报是透明的，你应该创建带有alpha通道的位图：Bitmap.createBitmap(1, 1, Bitmap.Config.ARGB_4444)

有机会用纯 CSS 做到这一点吗？

【参考方案2】：

您可以将poster 属性添加到<video> 标记以跳过丑陋的像素化默认android-webview-video-poster 图像。透明的 PNG 或 GIF 或空的 SVG 作品。