WebView支持h5视频全屏播放

本文主要是介绍WebView支持h5视频全屏播放，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

在APP开发的过程中，会碰到需要在WebView中播放视频的需求，下面讲解一下如何在WebView中使用html5播放视频。

1.让视频在各个Android版本能够正常播放

在AndroidManifest.xml中声明HardwareAccelerate的标志，一般是添加在Activity的级别上。代码如下：

<activity ... android:hardwareAccelerated="true" >

下面引申一下HardwareAccelerate声明的方式：

(a).如果需要声明整个应用都要加速，则在Application级别下面进行声明：

< application ... android:hardwareAccelerated ="true">

(b).如果需要某个Activity加速，则可以进行下面的声明：

<activity ... android:hardwareAccelerated="true" >

或者在代码里面进行动态的声明：

getWindow.setFlags(WindowManager.LayoutParams.FLAG_HARDWARE_ACCELERATED,
WindowManager.LayoutParams.FLAG_HARDWARE_ACCELERATED);

(c).如果Application和Activity都声明了HardwareAccelerate，但是由于某些特殊原因，一些View不需要硬件加速，那么在View里面设置：

view.setLayerType(View.LAYER_TYPE_SOFTWARE, null);

完成声明操作后，基本上WebView就能够很好的支持在页面上播放视频了，下面展示的是在Html上的Viedeo的声明方法：

<!DOCTYPE html>
<html><body><video width="305" height="305" controls="controls" preload="none" poster="http://****.png" ><source src="http://*****.mp4" type="video/mp4"></video></body>
</html>

2. 视频播放的时候能够全屏

视频能播放，那么如何支持视频全屏播放呢？下面是针对全屏播放网页视频提供的解决办法：

public class WebVideoActivity extends Activity {private WebView webView;/** 视频全屏参数 */protected static final FrameLayout.LayoutParams COVER_SCREEN_PARAMS = new FrameLayout.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.MATCH_PARENT);private View customView;private FrameLayout fullscreenContainer;private WebChromeClient.CustomViewCallback customViewCallback;@Overrideprotected void onCreate(Bundle bundle) {super.onCreate(bundle);setContentView(R.layout.activity_xx);webView = (WebView) findViewById(R.id.xx);initWebView();}@Overrideprotected void onStop() {super.onStop();webView.reload();}/** 展示网页界面 **/public void initWebView() {WebChromeClient wvcc = new WebChromeClient();WebSettings webSettings = webView.getSettings();webSettings.setJavaScriptEnabled(true);webSettings.setUseWideViewPort(true); // 关键点webSettings.setAllowFileAccess(true); // 允许访问文件webSettings.setSupportZoom(true); // 支持缩放webSettings.setLoadWithOverviewMode(true);webSettings.setCacheMode(WebSettings.LOAD_NO_CACHE); // 不加载缓存内容webView.setWebChromeClient(wvcc);WebViewClient wvc = new WebViewClient() {@Overridepublic boolean shouldOverrideUrlLoading(WebView view, String url) {webView.loadUrl(url);return true;}};webView.setWebViewClient(wvc);webView.setWebChromeClient(new WebChromeClient() {/*** 视频播放相关的方法 **/@Overridepublic View getVideoLoadingProgressView() {FrameLayout frameLayout = new FrameLayout(WebVideoActivity.this);frameLayout.setLayoutParams(new LayoutParams(LayoutParams.MATCH_PARENT, LayoutParams.MATCH_PARENT));return frameLayout;}@Overridepublic void onShowCustomView(View view, CustomViewCallback callback) {showCustomView(view, callback);}@Overridepublic void onHideCustomView() {hideCustomView();}});// 加载Web地址webView.loadUrl(webUrl);}/** 视频播放全屏 **/private void showCustomView(View view, CustomViewCallback callback) {// if a view already exists then immediately terminate the new oneif (customView != null) {callback.onCustomViewHidden();return;}WebVideoActivity.this.getWindow().getDecorView();FrameLayout decor = (FrameLayout) getWindow().getDecorView();fullscreenContainer = new FullscreenHolder(WebVideoActivity.this);fullscreenContainer.addView(view, COVER_SCREEN_PARAMS);decor.addView(fullscreenContainer, COVER_SCREEN_PARAMS);customView = view;setStatusBarVisibility(false);customViewCallback = callback;}/** 隐藏视频全屏 */private void hideCustomView() {if (customView == null) {return;}setStatusBarVisibility(true);FrameLayout decor = (FrameLayout) getWindow().getDecorView();decor.removeView(fullscreenContainer);fullscreenContainer = null;customView = null;customViewCallback.onCustomViewHidden();webView.setVisibility(View.VISIBLE);}/** 全屏容器界面 */static class FullscreenHolder extends FrameLayout {public FullscreenHolder(Context ctx) {super(ctx);setBackgroundColor(ctx.getResources().getColor(android.R.color.black));}@Overridepublic boolean onTouchEvent(MotionEvent evt) {return true;}}private void setStatusBarVisibility(boolean visible) {int flag = visible ? 0 : WindowManager.LayoutParams.FLAG_FULLSCREEN;getWindow().setFlags(flag, WindowManager.LayoutParams.FLAG_FULLSCREEN);}@Overridepublic boolean onKeyUp(int keyCode, KeyEvent event) {switch (keyCode) {case KeyEvent.KEYCODE_BACK:/** 回退键 事件处理 优先级:视频播放全屏-网页回退-关闭页面 */if (customView != null) {hideCustomView();} else if (webView.canGoBack()) {webView.goBack();} else {finish();}return true;default:return super.onKeyUp(keyCode, event);}}
}

复制代码