html5视频标签显示空白的屏幕,只有声音

时间:2018-09-15 20:29:44

标签: android video html5-video android-webview

我已经创建了网络视图并更新了android:hardwareAccelerated="true"以便运行嵌入式视频代码,但是;没有声音只播放声音

    mWebview = findViewById(R.id.webView);
    mWebview.getSettings().setJavaScriptEnabled(true);
    mChromeClient = new MyChromeClient(this);
    mWebview.setWebChromeClient(mChromeClient);
    mWebview.getSettings().setLoadWithOverviewMode(true);
    mWebview.getSettings().setMediaPlaybackRequiresUserGesture(false);

    mWebview.getSettings().setPluginState(WebSettings.PluginState.ON);
    mWebview.getSettings().setRenderPriority(WebSettings.RenderPriority.HIGH);

    mWebview.getSettings().setCacheMode(WebSettings.LOAD_NO_CACHE);
    mWebview.getSettings().setDomStorageEnabled(true);
    mWebview.getSettings().setAllowFileAccess(true);
    mWebview.getSettings().setSavePassword(false);
    mWebview.getSettings().setUseWideViewPort(true);
    mWebview.getSettings().setBuiltInZoomControls(false);
    mWebview.getSettings().setSupportZoom(false);
    mWebview.getSettings().setNeedInitialFocus(false);
    mWebview.getSettings().setLoadWithOverviewMode(true);
    mWebview.getSettings().setLayoutAlgorithm(WebSettings.LayoutAlgorithm.NORMAL);
    mWebview.getSettings().setLoadsImagesAutomatically(true);
    CookieManager.getInstance().setAcceptCookie(true);
    if (Build.VERSION.SDK_INT >= 17) {
        mWebview.getSettings().setMediaPlaybackRequiresUserGesture(false);
    }
    mWebview.setLayerType(1, null);
    mWebview.setWebViewClient(new MyWebviewClient());
    String myvar = "";

    String head = "<!DOCTYPE html><html><head><meta name=\"viewport\" content=\"width=device-width, user-scalable=yes\" /></head>";

    String summary = "<style>table{ height:100%;}td.height{height:100%;}</style><table width=100% height=100%> <tr><td class=\"height\" style=\"text-align: center; vertical-align: middle;\"><video id='my-video' poster=\"\" controls autoplay style=\"width: 300px; height: 250px;vertical-align: middle;\"><source src='http://techslides.com/demos/sample-videos/small.mp4' type='video/mp4' /></video></td></tr></table><script>var myvideo = document.getElementsByTagName('video')[0]; myvideo.play()</script>";

    String html = head + "<body style='background-color:#000000;'>" + summary + "</body></html>";
    mWebview.loadData(html, "text/html", null);

adb 日志:

  

09/16 22:39:14: Launching app
$ adb install-multiple -r -t -p com.example.ad.myapplication F:\new\MyApplication\app\build\outputs\apk\debug\app-debug.apk 
Split APKs installed
$ adb shell am start -n "com.example.ad.myapplication/com.example.ad.myapplication.MainActivity" -a android.intent.action.MAIN -c android.intent.category.LAUNCHER
Client not ready yet..Waiting for process to come online
Connected to process 3426 on device emulator-5554
Capturing and displaying logcat messages from application. This behavior can be disabled in the "Logcat output" section of the "Debugger" settings page.
D/MediaResourceGetter: no ethernet/wifi connection detected
W/MediaResourceGetter: non-file URI can't be read due to unsuitable network conditions
E/MediaResourceGetter: Unable to configure metadata extractor
[ 09-16 22:39:18.039  3426: 3478 D/         ]
HostConnection::get() New Host Connection established 0xa0f9b0b0, tid 3478
D/MediaPlayer: Couldn't open file on client side, trying server side

权限

  

<uses-permission android:name="android.permission.INTERNET"/> 
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" /> 
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE"/> 
<uses-permission android:name="android.permission.BLUETOOTH" /> 
<uses-permission android:name="android.permission.BLUETOOTH_ADMIN" /> 
<uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE" />

请咨询如何显示声音的视频,不仅声音,我尝试了所有已知的解决方案 提前谢谢

1 个答案:

答案 0 :(得分:0)

  

“如何与声音一起显示视频,而不仅仅是声音...”

请勿在宽度/高度中使用百分比。使用实数。

测试此设置,看看它是否显示有声音的图片:

String myvar = "";

String head = "<!DOCTYPE html><html><head><meta name=\"viewport\" content=\"width=device-width, user-scalable=yes\" /></head>";

String summary = "<video id='my-video' controls autoplay><source src='http://techslides.com/demos/sample-videos/small.mp4' width='300' height='250' type='video/mp4' /></video>";

String html = head + "<body style='background-color:#000000;'>" + summary + "</body><script>var myvideo = document.getElementsByTagName('video')[0]; myvideo.play()</script></html>";

mWebview.loadData(html, "text/html", null);

还要注意:<script>发生在<body>之后,因为脚本需要该视频元素首先存在。