Android 自定义WebView弹窗及屏蔽弹窗

2017-09-23  本文已影响1213人  闪电代码手

额,还是那个WebView的问题,内核已换成腾讯X5内核,所以接下来的内容会有一些X5内核的方法。但我们的H5是不能改的,还是只有委屈我们自己。先看看H5自带的弹窗

不知道什么鬼弹窗,应该是onJsPrompt

这样子的弹窗在不同的手机上呈现的可能是不同的效果,效果不统一,你家产品经理看了会高兴吗?哈哈哈。
其中,onJsPrompt弹出的内容在我们现在的项目上是无意义的。这个是之前AngularJS和Cordava项目。于是乎,对于onJsPrompt弹窗,我的做法是:

     @Override
     public boolean onJsPrompt(WebView view, String url, String message, String defaultValue, JsPromptResult result) {
         //在defaultValue或message中,会返回一个url,我们项目中的下载的文件都是File路径下
         //如果不是File文件,则直接返回true来屏蔽弹窗。
         if (!defaultValue.contains("File") && !message.contains("File")) {
             result.confirm();
             return true;
         }
         result.confirm();
         webView.loadUrl(message);
         return true;
     }

result.confirm();就是默认点确定,同理result.cancel();是取消操作

这样就可以轻松地屏蔽gay_init:2这样的无意义弹窗了,具体的可以根据message或者defaultValue的值来判断是否执行其他操作。
接下来是onJsAlert和onJsConfirm类型的,这样的弹窗我可是一眼就辨别出来了,因为从按键个数基本确定,onJsAlert只有一个,onJsConfirm嘛,肯定是有一个取消一个确定了。如果不能确定类型,可以分别复写几个方法,打上断点或者Log一下,也可以找到。

onJsAlert弹窗 onJsConfirm弹窗

既然他俩就一个按键的区别,那就只贴onJsConfirm的了。样式是仿照IOS的效果来的,background自定义的,需要的留言,我只贴主要的,毕竟本文主要是讲WebView的。

xml文件:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <TextView
        android:id="@+id/title"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />

    <TextView
        android:id="@+id/content"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <Button
            android:id="@+id/certain"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="确定" />

        <Button
            android:id="@+id/cancel"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_marginLeft="@dimen/x1"
            android:layout_weight="1"
            android:text="取消"/>
    </LinearLayout>
</LinearLayout>

类里面:

    private AlertDialog confirmDialog;
    private boolean isCertain;

    @Override
    public boolean onJsConfirm(WebView webView, String url, String message, final JsResult result) {
        confirmDialog = new AlertDialog.Builder(getContext(), R.style.alert_dialog_style).create();
        View view = LayoutInflater.from(getApplicationContext())
                .inflate(R.layout.window_user, null);
        TextView title = (TextView) view.findViewById(R.id.title);
        TextView content = (TextView) view.findViewById(R.id.content);
        Button cancel = (Button) view.findViewById(R.id.cancel);
        Button certain = (Button) view.findViewById(R.id.certain);
        title.setText("操作提示");
        //直接将返回的message信息设置到布局中
        content.setText("" + message);
        confirmDialog.setView(view);
        cancel.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                confirmDialog.dismiss();
                isCertain = false;
            }
        });
        certain.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                confirmDialog.dismiss();
                isCertain = true;
            }
        });
        confirmDialog.setOnDismissListener(new DialogInterface.OnDismissListener() {
            @Override
            public void onDismiss(DialogInterface dialog) {
                //根据isCertain来判断用户希望执行的是确定还是取消操作
                if (isCertain) {
                    result.confirm();
                } else {
                    result.cancel();
                }
            }
        });
        confirmDialog.show();
        WindowManager.LayoutParams params = confirmDialog.getWindow().getAttributes();
                params.width = (int) (ScreenUtils.getScreenWidth() * 0.9);
                params.height = LinearLayout.LayoutParams.WRAP_CONTENT;
                confirmDialog.getWindow().setAttributes(params);
        return true;
    }

效果嘛,就这样啦。

优化后的onJsAlert弹窗 优化后的onJsConfirm弹窗

一直以来,WebView对我来说是一个很难控制但是又不得不用的重要组件。经历了很多坑,包括谷歌大佬埋下的。不管怎么说,我们在遇到问题的时候,要不畏艰难,迎难而上。没有问题,制造问题,也要上。不要怂,就是干!共勉。

上一篇下一篇

猜你喜欢

热点阅读