Android WebView实践总结（三）WebView文件上

1.WebView文件上传

网页中有需要上传文件的情况，如果不做处理点击上传文件是没有任何反应的，如图片中出现的情况。这里以上传图片为例。

点击无效举例
点击图标后会回调WebChromeClientl类中的onShowFileChooser方法，重写此方法打开文件，通过filePathCallback类完成数据交互即可。

    private static final int REQUEST_CODE_CHOOSE = 23;
    private ValueCallback<Uri[]> uploadMessage;

        mWebView.setWebChromeClient(new WebChromeClient() {
            @Override
            public boolean onShowFileChooser(WebView webView, ValueCallback<Uri[]> filePathCallback, FileChooserParams fileChooserParams) {
                uploadMessage=filePathCallback;
                //网页文件上传回调
                //这里打开图库
                Intent i = new Intent(Intent.ACTION_GET_CONTENT);
                i.addCategory(Intent.CATEGORY_OPENABLE);
                i.setType("image/*");
                startActivityForResult(Intent.createChooser(i, "Image Chooser"), REQUEST_CODE_CHOOSE);
                return true;
            }
        });

打开图库选择图片，通过activity中的onActivityResult回调方法获取图片资源，再通过filePathCallback方法把图片数据传给网页。

    @Override
    protected void onActivityResult(int requestCode, int resultCode, Intent data) {
        super.onActivityResult(requestCode, resultCode, data);
        //网页上传图片回调
        if (requestCode == REQUEST_CODE_CHOOSE) {
            //图片选择后返回图标，通过uploadMessage将图片传给网页
            if (uploadMessage != null) {
                onActivityResultAboveL(resultCode, data);
            }
        }
    }

    //处理网页回调
    @TargetApi(Build.VERSION_CODES.LOLLIPOP)
    private void onActivityResultAboveL(int resultCode, Intent intent) {
        Uri[] results = null;
        if (resultCode == Activity.RESULT_OK) {
            if (intent != null) {
                String dataString = intent.getDataString();
                ClipData clipData = intent.getClipData();
                if (clipData != null) {
                    results = new Uri[clipData.getItemCount()];
                    for (int i = 0; i < clipData.getItemCount(); i++) {
                        ClipData.Item item = clipData.getItemAt(i);
                        results[i] = item.getUri();
                    }
                }
                if (dataString != null)
                    results = new Uri[]{Uri.parse(dataString)};
            }
        }
        uploadMessage.onReceiveValue(results);
        uploadMessage = null;
    }

到这里无法上传图片的问题就解决啦， 效果图如下：

网页图片上传效果图

2.WebView自定义长按菜单

根据网页中的不同类型（图片，文字等等）弹出不同的菜单对其进行惭怍。重写webview的setOnLongClickListener方法，在方法里面调用getHitTestResult方法获取长按的数据和类型即可。

    private onSelectItemListener mOnSelectItemListener;
    private int touchX = 0, touchY = 0;


       //webview中重写此方法
        setOnLongClickListener(new OnLongClickListener() {
            @Override
            public boolean onLongClick(View v) {
                HitTestResult result = getHitTestResult();
                if (null == result)
                    return false;
//得到类型
                int type = result.getType();
//获取长按后的数据
                String extra = result.getExtra();
                switch (type) {
                    case HitTestResult.PHONE_TYPE: // 处理拨号
                        break;
                    case HitTestResult.EMAIL_TYPE: // 处理Email
                        break;
                    case HitTestResult.GEO_TYPE: // 　地图类型
                        break;
                    case HitTestResult.SRC_ANCHOR_TYPE: // 超链接
                        if (mOnSelectItemListener != null && extra != null && URLUtil.isValidUrl(extra)) {
                            mOnSelectItemListener.onLinkSelected(touchX, touchY, result.getType(), extra);
                        }
                        return true;
                    case HitTestResult.SRC_IMAGE_ANCHOR_TYPE: // 带有链接的图片类型
                    case HitTestResult.IMAGE_TYPE: // 处理长按图片的菜单项
                        if (mOnSelectItemListener != null && extra != null && URLUtil.isValidUrl(extra)) {
                            mOnSelectItemListener.onImgSelected(touchX, touchY, result.getType(), extra);
                        }
                        return true;
                    case HitTestResult.UNKNOWN_TYPE: //未知
                        break;
                    case HitTestResult.EDIT_TEXT_TYPE://文字
                        break;
                }
                return true;
            }
        });
    @Override
    public boolean onInterceptTouchEvent(MotionEvent event) {
        touchX = (int) event.getX();
        touchY = (int) event.getY();
        return super.onInterceptTouchEvent(event);
    }

    public void setOnSelectItemListener(onSelectItemListener onSelectItemListener) {
        mOnSelectItemListener = onSelectItemListener;
    }

    public interface onSelectItemListener {
        void onImgSelected(int x, int y, int type, String extra);

        void onLinkSelected(int x, int y, int type, String extra);
    }

设置完了监听器后在主界面做处理更合适

        mWebView.setOnSelectItemListener(new MyWebView.onSelectItemListener() {
            @Override
            public void onImgSelected(int x, int y, int type, String extra) {
                String[] menus = new String[]{"保存图片", "预览图片", "复制图片链接", "分享图片"};
                new AlertDialog.Builder(MainActivity.this)
                        .setItems(menus, new DialogInterface.OnClickListener() {
                            @Override
                            public void onClick(DialogInterface dialog, int which) {
                                dialog.dismiss();
                                switch (which) {
                                    case 0:
                                        break;
                                    case 1:
                                        break;
                                    case 2:
                                        Toast.makeText(MainActivity.this, "复制图片链接点击了", Toast.LENGTH_LONG).show();
                                        break;
                                    case 3:
                                        break;
                                }
                            }
                        }).show();
            }

            @Override
            public void onLinkSelected(int x, int y, int type, String extra) {
                String[] menus = new String[]{"复制链接地址", "新窗口打开"};
                new AlertDialog.Builder(MainActivity.this)
                        .setItems(menus, new DialogInterface.OnClickListener() {
                            @Override
                            public void onClick(DialogInterface dialog, int which) {
                                dialog.dismiss();
                                switch (which) {
                                    case 0:
                                        break;
                                    case 1:
                                        Toast.makeText(MainActivity.this, "新窗口打开点击了", Toast.LENGTH_LONG).show();
                                        break;
                                }
                            }
                        }).show();
            }
        });

完成，效果图如下：

网页长按弹出对应菜单

• github Demo源码点这里