Android WebView 总结 —— 使用HTML5播放视频及全屏方案

青旅半醒 2022-01-21 11:53 318阅读 0赞

参考网址：

[https://www.jianshu.com/p/b9de6714482c][https_www.jianshu.com_p_b9de6714482c]

[https://www.cnblogs.com/renhui/p/5893593.html][https_www.cnblogs.com_renhui_p_5893593.html]

一，打开硬件加速

不开硬件加速，视频会黑屏，有声音没图像；

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

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

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

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

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

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

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>

二、视频播放的时候可以全屏

1.代码：
    
    在onShowCustomView方法中，将获取到的view放到当前Activity的最上方，在onHideCustomView中，将之前的view隐藏或者删除，将原来被覆盖的webview放回来。
    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;
    
        @Override
        protected void onCreate(Bundle bundle) {
            super.onCreate(bundle);
            setContentView(R.layout.activity_xx);
            webView = (WebView) findViewById(R.id.xx);
            initWebView();
        }
    
        @Override
        protected 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() {
                @Override
                public boolean shouldOverrideUrlLoading(WebView view, String url) {
                    webView.loadUrl(url);
                    return true;
                }
            };
            webView.setWebViewClient(wvc);
    
            webView.setWebChromeClient(new WebChromeClient() {
    
                /*** 视频播放相关的方法 **/
    
                @Override
                public View getVideoLoadingProgressView() {
                    FrameLayout frameLayout = new FrameLayout(WebVideoActivity.this);
                    frameLayout.setLayoutParams(new LayoutParams(LayoutParams.MATCH_PARENT, LayoutParams.MATCH_PARENT));
                    return frameLayout;
                }
    
                @Override
                public void onShowCustomView(View view, CustomViewCallback callback) {
                    showCustomView(view, callback);
                }
    
                @Override
                public void onHideCustomView() {
                    hideCustomView();
                }
            });
    
            // 加载Web地址
            webView.loadUrl(webUrl);
        }
    
        /** 视频播放全屏 **/
        private void showCustomView(View view, CustomViewCallback callback) {
            // if a view already exists then immediately terminate the new one
            if (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));
            }
    
            @Override
            public 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);
        }
    
        @Override
        public 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);
            }
        }
    }

2.在清单文件上设置configChanges，当转屏以及转屏造成的屏幕尺寸变化的时候，activity会冲走onCreate方法，前面干的所有事儿都白干了

[https_www.jianshu.com_p_b9de6714482c]: https://www.jianshu.com/p/b9de6714482c
[https_www.cnblogs.com_renhui_p_5893593.html]: https://www.cnblogs.com/renhui/p/5893593.html