2016-02-05 194 views
0

我正在使用HTML5視頻元素在Android WebView中播放視頻。這對我很好,但使用它的唯一問題是視頻元素會自動添加一個灰色的播放按鈕。 我試過尋找一個API,並找不到任何有助於我的情況。我使用CSS與下面的樣式也試過:Android WebView灰色播放按鈕

video.mobile_controls::-webkit-media-controls-fullscreen-button 
{ 
    display: inline !important; // Also used "display:none" 
} 

而且我試圖在影子DOM戳,但我無法找到與此相關的任何東西。

所以問題是如何刪除這個灰色的按鈕。 這裏是一個圖像以供參考:

enter image description here

+0

我認爲[這個鏈接](http://stackoverflow.com/questions/17346246/videojs-seeing-grey-boxes-in-android-mobile)應該爲你工作。 – PHPExpert

+0

@PHPExpert很遺憾,它沒有鏈接到videojs,但這是默認的

回答

2

問題是視頻海報。但是有更好的方法通過從WebChromeClient擴展並覆蓋getDefaultVideoPoster()來解決這個問題。

這裏是解決方案:

import android.graphics.Bitmap; 
import android.webkit.WebChromeClient; 

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

,然後使用該客戶端,而不是通過做:

WebChromeClientCustomPoster chromeClient = new WebChromeClientCustomPoster(); 
mWebView.setWebChromeClient(chromeClient); 

我們發現,濫用海報屬性修復了這個問題有些髒黑客後。我們通過執行以下操作來解決此問題:

videoElement.setAttribute("poster", "nope"); 

視頻元素將使用值「nope」作爲其海報。而且由於nope不是有效的URL,所以視頻元素不會替換海報,也不會顯示海報。

+0

作品非常感謝! – Jan