我正在开发一个在 webview 上播放 html5 视频的 android 应用程序，我已经在 firefox、chrome、opera 和 IE 上测试了视频，并且视频控件显示全屏按钮，但在 android lollipop webview 上没有全屏按钮和因此无法全屏播放视频。
我尝试了几种 JavaScript 方法来最大化视频，但都没有奏效。 这是铬的错误还是有办法激活按钮？
PS：看来https://code.google.com/p/chromium/issues/detail?id=470666不是我一个人
【问题讨论】：
标签： android html webview html5-video
Android 文档说
您需要设置 WebChromeClient 并同时实现 onShowCustomView(View, WebChromeClient.CustomViewCallback) 和 onHideCustomView()。如果缺少这两种方法中的任何一种的实现，则网页内容将不允许进入全屏。
如果您只是在设置 webview 的地方扔代码，按钮就会显示出来。你不需要对代码做任何事情，你只需要实现它，否则股票 android 会隐藏按钮。
webView.setWebChromeClient(new WebChromeClient() {
public void onShowCustomView (View view, WebChromeClient.CustomViewCallback callback) {
//do stuff
}
public void onHideCustomView () {
//do stuff
}
});
【讨论】：
我已通过在包含单词fullscreen 的视频下方的html 页面上创建link 来解决我的问题，
链接示例：
<a href="http://example.com/video.mp4?fullscreen">fullscreen</a>
然后使用webview 方法shouldOverrideUrlLoading 覆盖任何包含单词fullscreen 的Url，将其重定向到Android 视频播放器。
mWebView.setWebViewClient(new WebViewClient(){
public boolean shouldOverrideUrlLoading(WebView wView, String url)
{
if (url.contains("fullscreen") ) {
Log.i("LOB", "FULLSCREEN " + url);
try {
url = url.replaceAll("(?im)fullscreen", "");
} catch (PatternSyntaxException ex) {
} catch (IllegalArgumentException ex) {
} catch (IndexOutOfBoundsException ex) {
}
Intent intent = new Intent(Intent.ACTION_VIEW, Uri.parse(url));
intent.setDataAndType(Uri.parse(url), "video/mp4");
startActivity(intent);
return true;
}
}
}
这远不是一个优雅的解决方案，但是虽然 Google 没有为 Lollipop 提供修复程序，但它可以完成这项工作。
【讨论】：
嘿，这是一个老问题，但这是我更新的解决方案。我正在使用 Kotlin 和 AndroidX。 首先，您的“视频活动布局”中需要两个视图，如下所示：
<?xml version="1.0" encoding="utf-8"?><androidx.constraintlayout.widget.ConstraintLayout
android:layout_height="match_parent"
android:layout_width="match_parent"
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:app="http://schemas.android.com/apk/res-auto">
<FrameLayout
android:id="@+id/videoFrame"
android:layout_width="0dp"
android:layout_height="0dp"
android:elevation="10dp" android:visibility="gone"
app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent" app:layout_constraintTop_toTopOf="parent">
</FrameLayout>
<WebView
android:id="@+id/webview"
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" /></androidx.constraintlayout.widget.ConstraintLayout>
您将使用 videoFrame 框架布局来设置额外的全屏内容，并且显然为您的网络内容设置 webview。
然后，使用一种方法将 url 加载到您的 webview：
private fun initWebView(webUrl : String){
val webView : WebView? = this.findViewById(R.id.webview)
val videoFrame : FrameLayout? = this.findViewById(R.id.videoFrame)
webView?.settings?.apply {
mediaPlaybackRequiresUserGesture = true
javaScriptEnabled = true //use this carefully
}
webView?.webChromeClient = object : WebChromeClient () {
override fun onProgressChanged(view: WebView?, newProgress: Int) {
Log.d(TAG, "WebChromeClient, onProgressChanged newProgress=$newProgress") }
override fun onShowCustomView(fullScreenContent: View?, callback: CustomViewCallback?) {
super.onShowCustomView(fullScreenContent, callback)
Log.d(TAG, "onShowCustomView")
fullScreenContent?.let {fullScreenView ->
videoFrame?.removeAllViews()
videoFrame?.visibility = View.VISIBLE
videoFrame?.addView(fullScreenView)
}
}
override fun onHideCustomView() {
super.onHideCustomView()
Log.d(TAG, "onShowCustomView")
videoFrame?.visibility = View.GONE
videoFrame?.removeAllViews()
}
}
webView?.loadUrl(webUrl)
}
当您覆盖 onShowCustomView 和 onHideCustomView 方法时，魔法就会发生。 只需将 fullScreenContent 添加到 videoFrame 布局中。
仅此而已。 它在 Android 9 上运行（并经过测试）。
【讨论】：
分享 HTML5 视频时，用户必须使用 iframe。出于安全原因，共享视频的网站必须包含允许全屏视频的参数。 它缺少 allowfullscreen 参数。应该是这样的：
<iframe width="560" height="315" src="https://www.youtube.com/embed/kVFBmPsugus" frameborder="0" allowfullscreen></iframe>
【讨论】：