Android WebView实践总结(二)WebView全屏播放

我接着上一篇的总结继续写,上一篇已经可以正常加载网页并且做基本控制,不过我发现一个问题,播放网页视频的时候无法进入全屏模式进行视频播放,体验极差,原来这里是我们自己需要手动对全屏模式进行处理的。这篇主要写WwebView实现全屏播放,还有记录一下在处理全屏播放时候遇到的一个问题。

1.思考

播放视频的时候点击全屏图标点击后木有反应,但其实是触发了WebChromeClient类中onShowCustomView(View view, CustomViewCallback callback)事件的,注意这个方法里面的两个参数viewcallbackview就是传过来的视频播放的视图内容,callback回调接口看源代码可知里面有一个方法onCustomViewHidden()注释给的解释是(Invoked when the host application dismisses the),意思是视图关闭的时候调用这个onCustomViewHidden()方法,退出全屏的时候会回调 onHideCustomView()无参数方法,得出结论:简单的来说就是进入全屏模式的时候把onShowCustomView方法中的View添加到一个容器中显示出来,退出全屏模式时在onHideCustomView方法中把视图从容器remove掉就OK了,顺便处理一下横竖屏切换。

  /**
     * A callback interface used by the host application to notify
     * the current page that its custom view has been dismissed.
     */
    public interface CustomViewCallback {
        /**
         * Invoked when the host application dismisses the
         * custom view.
         */
        public void onCustomViewHidden();
    }

2.开启硬件加速

为什么要开启硬件加速啊?因为不开启的话会有视频无法正常播放的问题,还有就是浏览网页的时候更流畅。
在application节点中添加android:supportsRtl="true"在activity中添加android:hardwareAccelerated="true",在application添加表示整个应用程序开启,在activity添加表示当前页面开启。

    <application
        android:allowBackup="true"
        android:hardwareAccelerated="true"
        android:icon="@mipmap/ic_launcher"
        android:label="@string/app_name"
        android:roundIcon="@mipmap/ic_launcher_round"
        android:supportsRtl="true"
        android:theme="@style/AppTheme">
        <activity
            android:name=".MainActivity"
            android:configChanges="orientation|screenSize|keyboardHidden"
            android:hardwareAccelerated="true">
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />

                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
    </application>

3.网页全屏模式切换回调处理

layout布局中添加FrameLayout作为全屏模式的视图容器;

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.allyn.webview.MainActivity">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical">

        <android.support.v4.widget.ContentLoadingProgressBar
            android:id="@+id/pro_schedule"
            style="@style/Widget.AppCompat.ProgressBar.Horizontal"
            android:layout_width="match_parent"
            android:layout_height="3dp"
            android:max="100"
            android:progress="0"
            android:visibility="visible" />

        <com.allyn.webview.MyWebView
            android:id="@+id/webview"
            android:layout_width="match_parent"
            android:layout_height="500dp" />
    </LinearLayout>

    <FrameLayout
        android:id="@+id/frameLayout"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />
</FrameLayout>

全屏模式切换回调处理

        mWebView.setWebChromeClient(new WebChromeClient() {
            //视图View
            private View mCustomView;
            // 一个回调接口使用的主机应用程序通知当前页面的自定义视图已被撤职
            private CustomViewCallback mCustomViewCallback;

            //网页进入全屏模式监听
            @Override
            public void onShowCustomView(View view, CustomViewCallback callback) {
                super.onShowCustomView(view, callback);
                mFrameLayout = findViewById(R.id.frameLayout);
                if (mCustomView != null) {
                    callback.onCustomViewHidden();
                    return;
                }
                //赋值,关闭时需要调用
                mCustomView = view;
                // 将video放到FrameLayout中
                mFrameLayout.addView(mCustomView);
                //  退出全屏模式时释放需要调用,这里先赋值
                mCustomViewCallback = callback;
                // 设置webView隐藏
                mWebView.setVisibility(View.GONE);
                //切换至横屏
                setRequestedOrientation(ActivityInfo.SCREEN_ORIENTATION_LANDSCAPE);
            }

            //网页退出全屏模式监听
            @Override
            public void onHideCustomView() {
                //显示竖屏时候的webview
                mWebView.setVisibility(View.VISIBLE);
                if (mCustomView == null) {
                    return;
                }
                //隐藏
                mCustomView.setVisibility(View.GONE);
                //从当前视图中移除
                mFrameLayout.removeView(mCustomView);
                //释放自定义视图
                mCustomViewCallback.onCustomViewHidden();
                mCustomView = null;
                //切换至竖屏
                setRequestedOrientation(ActivityInfo.SCREEN_ORIENTATION_PORTRAIT);
                super.onHideCustomView();
            }
        });

3.APP横竖屏切换处理

注意:需要在AndroidManifest.xml文件中的activity节点下添加 android:configChanges="orientation|screenSize|keyboardHidden",这么设置是为了使横竖屏切换后Activity不会重新启动。

    //屏幕旋转监听
    @Override
    public void onConfigurationChanged(Configuration config) {
        super.onConfigurationChanged(config);
        switch (config.orientation) {
            //竖屏方向
            case Configuration.ORIENTATION_LANDSCAPE:
                //设置全屏
                getWindow().clearFlags(WindowManager.LayoutParams.FLAG_FORCE_NOT_FULLSCREEN);
                getWindow().addFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN);
                break;
            //横屏方向
            case Configuration.ORIENTATION_PORTRAIT:
                //关闭全屏
                getWindow().clearFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN);
                getWindow().addFlags(WindowManager.LayoutParams.FLAG_FORCE_NOT_FULLSCREEN);
                break;
        }
    }

到这里全屏播放的功能完成了,效果图如下:


全屏播放效果图

4.遇到的一个问题

在优酷网上点击播放视频的时候出现了错误页面,提示:

error.jpg

这个问题是网址使用了外链导致的,需要在shouldOverrideUrlLoading()方法中对url做处理,判断url的前缀进行本地跳转。

 @Override
            public boolean shouldOverrideUrlLoading(WebView view, String url) {
                //网址处理
                if (url == null) return false;
            //外链判断处理
                try {
                    if (url.startsWith("weixin://") //微信
                            || url.startsWith("alipays://") //支付宝
                            || url.startsWith("mailto://") //邮件
                            || url.startsWith("tel://")//电话
                            || url.startsWith("baiduhaokan://")//百度
                            || url.startsWith("tbopen://")//百度+
                            || url.startsWith("youku://")//优酷
                            || url.startsWith("dianping://")//大众点评
                        //其他自定义的scheme
                            ) {
                        Intent intent = new Intent(Intent.ACTION_VIEW, Uri.parse(url));
                        startActivity(intent);
                        return true;
                    }
                } catch (Exception e) { //防止crash (如果手机上没有安装处理某个scheme开头的url的APP, 会导致crash)
                    return true;//没有安装该app时,返回true,表示拦截自定义链接,但不跳转,避免弹出上面的错误页面
                }
                /**
                 * 可对指定网址进行拦截
                 */
                view.loadUrl(url);
                return true;
            }
问题解决.jpg

好了,webview实践总结第二篇到这里写完了,觉得有用的可以点个小心心支持一下,(比心手势.png)

预告:第三篇写webview的图片上传与网页长按处理。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 206,482评论 6 481
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 88,377评论 2 382
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 152,762评论 0 342
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 55,273评论 1 279
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 64,289评论 5 373
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 49,046评论 1 285
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 38,351评论 3 400
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,988评论 0 259
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 43,476评论 1 300
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,948评论 2 324
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 38,064评论 1 333
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,712评论 4 323
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 39,261评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 30,264评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,486评论 1 262
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 45,511评论 2 354
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,802评论 2 345

推荐阅读更多精彩内容

  • 1、通过CocoaPods安装项目名称项目信息 AFNetworking网络请求组件 FMDB本地数据库组件 SD...
    阳明先生_x阅读 15,968评论 3 119
  • 生命只有一次不可重复,时光亦不能倒转给你机会后悔。在这个飞速发展的时代,很多人都说女人开始独挡半边天,在这独...
    初心表姐阅读 685评论 0 0
  • 曾记 诗酒正年华 感伤不过是一场无端而至的秋凉 我陷入沉醉 又疑惑迷惘 离别 不用诉离殇 眼泪不过是一杯天涯各两端...
    秋山纱兰阅读 212评论 0 1
  • 人总是为一点点小事而改变自己的心情,可能那个事情并不关系到你,但总会联系到自己
    早起的小羊阅读 135评论 0 0