首页 > 系统 > Android > 正文

Android Viewpager与WebView轮播滑动冲突的解决方案

2019-11-06 09:41:57
字体:
来源:转载
供稿:网友

最近在进行混合开发过程中,用viewpager+fragment的方式在基本框架,在里面fragment中包含webview,而在webview中存在一个横屏轮播的控件,导致在执行webview轮播滑动时,会触发viewpager的滑动,导致webview的轮播失效,经过一番对该问题的搜索和实践,最后将问题解决。该方法需要网页与Android两端配合使用。

解决的方法:

首先需要在网页端写js接口,获取轮播控件的宽高以及相对于原点的位置,获取轮播宽高的坐标的实际也比较重要,需要在页面刚加载获取一次,现在轮播控件的宽高,并且调起写好的js调Android的方法,同时也需要Android端定义好对应的接口,并且在上下滑动的时候也需要去计算现在轮播控件的宽高,并且给Android端发送过去。

由于我主要开发的Android端,所以不知道网页端js的代码,如有需要自行查找:

window.onload = function(){ ... } window.onscroll = function(){ ... }

在Android端的主要代码:

首先需要定义一个类来接收js接口返回的坐标值

public class PagerDesc {    PRivate int top;    private int left;    private int right;    private int bottom;    //get set方法    public PagerDesc(int top, int left, int right, int bottom) {        this.top = top;        this.bottom = bottom;    }}定义js接口,用PagerDesc类来接收返回的原点坐标和宽高值

当解决完以上的内容,接下来是根据Android的机制来进行在webview的onTouch事件进行处理

详细代码:

webView.setOnTouchListener(new View.OnTouchListener() {                @Override                public boolean onTouch(View v, MotionEvent event) {                    //获取y轴坐标                    float y = event.getRawY();                    switch (event.getAction()) {                        case MotionEvent.ACTION_DOWN:                            if (null != mPagerDesc) {                                int top = mPagerDesc.getTop();                                int bottom = top + (mPagerDesc.getBottom() - mPagerDesc.getTop());                                //将CSS像素转换为android设备像素并考虑通知栏高度                                DisplayMetrics metric = context.getResources().getDisplayMetrics();                                top = (int) (top * metric.density) + ScreenUtil.getStatusBarHeight(getActivity());                                bottom = (int) (bottom * metric.density) + ScreenUtil.getStatusBarHeight(getActivity());                                //如果触摸点的坐标在轮播区域内,则由webview来处理事件,否则由viewpager来处理                                if (y > top&& y<bottom){                                    webView.requestDisallowInterceptTouchEvent(true);                                }else{                                    webView.requestDisallowInterceptTouchEvent(false);                                }                            } break;                        case MotionEvent.ACTION_UP:                            break;                        case MotionEvent.ACTION_MOVE:                            break;                    }                    return false;                }            });这样基本就可以了。


发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表