Android侧滑菜单和轮播图之滑动冲突

接手一个项目,有一个问题需要修改:轮播图不能手动滑动,手动滑动轮播图只会触发侧滑菜单。

猜测:viewpager控件(轮播图)的触摸事件被SlidingMenu控件(侧滑菜单,非第三方项目,乃是上个开发人员自定义的)拦截了。

基于这个猜测,我自定义一个ViewPager,重写dispatchTouchEvent、onInterceptTouchEvent和onTouchEvent,分别在这三个方法中打印log;

重写SlidingMenu的dispatchTouchEvent、onInterceptTouchEvent和onTouchEvent,同样打印log。

重新编译运行,手滑轮播图,log如下:

06-08 09:52:08.394 19424-19424/com.parkingmore E/SlidingMenu: dispatchTouchEvent ev:0
06-08 09:52:08.395 19424-19424/com.parkingmore E/SlidingMenu: onInterceptTouchEvent ev:0
06-08 09:52:08.395 19424-19424/com.parkingmore E/RollViewPager: dispatchTouchEvent ev:0
06-08 09:52:08.395 19424-19424/com.parkingmore E/RollViewPager: onInterceptTouchEvent ev:0
06-08 09:52:08.441 19424-19424/com.parkingmore E/SlidingMenu: dispatchTouchEvent ev:2
06-08 09:52:08.441 19424-19424/com.parkingmore E/SlidingMenu: onInterceptTouchEvent ev:2
06-08 09:52:08.442 19424-19424/com.parkingmore E/SlidingMenu: ACTION_MOVE dx:15.473999
06-08 09:52:08.442 19424-19424/com.parkingmore E/RollViewPager: ACTION_MOVE getCurrentItem():1
06-08 09:52:08.442 19424-19424/com.parkingmore E/RollViewPager: dispatchTouchEvent ev:2
06-08 09:52:08.442 19424-19424/com.parkingmore E/RollViewPager: onInterceptTouchEvent ev:2
06-08 09:52:08.459 19424-19424/com.parkingmore E/SlidingMenu: dispatchTouchEvent ev:2
06-08 09:52:08.459 19424-19424/com.parkingmore E/SlidingMenu: onInterceptTouchEvent ev:2
06-08 09:52:08.459 19424-19424/com.parkingmore E/RollViewPager: dispatchTouchEvent ev:3
06-08 09:52:08.459 19424-19424/com.parkingmore E/RollViewPager: onInterceptTouchEvent ev:3
06-08 09:52:08.477 19424-19424/com.parkingmore E/SlidingMenu: dispatchTouchEvent ev:2
06-08 09:52:08.477 19424-19424/com.parkingmore E/SlidingMenu: onTouchEvent ev:2
06-08 09:52:08.495 19424-19424/com.parkingmore E/SlidingMenu: dispatchTouchEvent ev:2
06-08 09:52:08.495 19424-19424/com.parkingmore E/SlidingMenu: onTouchEvent ev:2
06-08 09:52:08.515 19424-19424/com.parkingmore E/SlidingMenu: dispatchTouchEvent ev:2
06-08 09:52:08.515 19424-19424/com.parkingmore E/SlidingMenu: onTouchEvent ev:2
06-08 09:52:08.533 19424-19424/com.parkingmore E/SlidingMenu: dispatchTouchEvent ev:2
06-08 09:52:08.533 19424-19424/com.parkingmore E/SlidingMenu: onTouchEvent ev:2
06-08 09:52:08.551 19424-19424/com.parkingmore E/SlidingMenu: dispatchTouchEvent ev:2
06-08 09:52:08.551 19424-19424/com.parkingmore E/SlidingMenu: onTouchEvent ev:2
06-08 09:52:08.574 19424-19424/com.parkingmore E/SlidingMenu: dispatchTouchEvent ev:2
06-08 09:52:08.574 19424-19424/com.parkingmore E/SlidingMenu: onTouchEvent ev:2
06-08 09:52:08.594 19424-19424/com.parkingmore E/SlidingMenu: dispatchTouchEvent ev:2
06-08 09:52:08.595 19424-19424/com.parkingmore E/SlidingMenu: onTouchEvent ev:2
06-08 09:52:08.611 19424-19424/com.parkingmore E/SlidingMenu: dispatchTouchEvent ev:2
06-08 09:52:08.612 19424-19424/com.parkingmore E/SlidingMenu: onTouchEvent ev:2
06-08 09:52:08.622 19424-19424/com.parkingmore E/SlidingMenu: dispatchTouchEvent ev:2
06-08 09:52:08.622 19424-19424/com.parkingmore E/SlidingMenu: onTouchEvent ev:2
06-08 09:52:08.623 19424-19424/com.parkingmore E/SlidingMenu: dispatchTouchEvent ev:1

从log中可以看出,该开始,还能将滑动事件传递给ViewPager,之后,就被SlidingMenu拦截了。这个log证实了这个猜想是正确的。

知道了原因就好解决了,我现在要考虑的是:要达到什么样的效果。

预期效果:可以正常滑动轮播图,当轮播图在第一张时,可以滑到侧滑菜单。

网上有人分享过类似的问题。我这里也借鉴了一下。

先来实现第一个功能:可以正常滑动轮播图。

可以设一个全局变量:public static boolean mRollViewPagerTouching;

用来表示是否在触摸轮播图。

在自定义ViewPager中,判断是否在触摸轮播图

public boolean dispatchTouchEvent(MotionEvent ev) {
        switch (ev.getAction()) {
            case MotionEvent.ACTION_MOVE:
                break;
            case MotionEvent.ACTION_DOWN:
                MyApplication.mRollViewPagerTouching = true;
                break;
            case MotionEvent.ACTION_UP:
                MyApplication.mRollViewPagerTouching = false;
                break;
        }
        return super.dispatchTouchEvent(ev);
    }

在SlidingMenu中,做出如下处理

public boolean onInterceptTouchEvent(MotionEvent ev) {
        if (MyApplication.mRollViewPagerTouching){
            return false;
        }
        return super.onInterceptTouchEvent(ev);
    }

重新编译运行,可以正常滑动轮播图,但是当轮播图在第一张时,不能滑到侧滑菜单。

现在来做第二个功能:当轮播图在第一张时,可以滑到侧滑菜单。

这里有两个地方要注意:1.当轮播图在第一张时;2.由于我的侧滑菜单是在左边,需要手指向右滑动进入侧滑菜单,所以,第二个条件,应该是右滑。

在以上的基础上,修改自定义ViewPager代码

public boolean dispatchTouchEvent(MotionEvent ev) {
        //在触发时回去到起始坐标
        float x = ev.getX();
        switch (ev.getAction()) {
            case MotionEvent.ACTION_MOVE:
                //获取到距离差
                float dx = x - downX;
                //防止是按下也判断
                if (Math.abs(dx) > 8) {
                    //通过距离差判断方向
                    if (dx > 0) {
                        //                                "右";
                        if (getCurrentItem() == 0) {
                            MyApplication.mRollViewPagerTouching = false;
                        } else {
                            MyApplication.mRollViewPagerTouching = true;
                        }
                    } else {
                        //                                "左";
                        MyApplication.mRollViewPagerTouching = true;
                    }
                }
                break;
            case MotionEvent.ACTION_DOWN:
                //将按下时的坐标存储
                downX = x;
                MyApplication.mRollViewPagerTouching = true;
                break;
            case MotionEvent.ACTION_UP:
                MyApplication.mRollViewPagerTouching = false;
                break;
        }
        return super.dispatchTouchEvent(ev);
    }

再次编译运行,成功达到预期效果。

ps:简单的功能,简单的分享。

 
时间: 2024-08-09 01:34:04

Android侧滑菜单和轮播图之滑动冲突的相关文章

photoSlider-html5原生js移动开发轮播图-相册滑动插件

简单的移动端图片滑动切换浏览插件 分别引用css文件和js文件 如: <link rel="stylesheet" type="text/css" href="css/photoSlider.min.css" /> <script src="js/photoSlider.min.js" type="text/javascript" charset="utf-8">

Android ViewPager实现循环轮播图

一.原理 ViewPager是Android中使用频率相对较高的view组件,同时对滑动过程中的事件进行了处理,因此非常适合轮播图.关于轮播图的实现,有很多方法,使用HorizontalView或者RecylerView也可以实现,但是需要处理fling操作,这里我们用ViewPager避免这些工作. 网上有很多关于ViewPager轮播的轮播实现,其原理大多数给PagerAdapter的getCount 放大N倍,N大于100,1000等.这里我们使用另一种思路,数据映射. 数据映射方案:假设

android ViewPager实现的轮播图广告自定义视图,网络获取图片和数据

public class SlideShowAdView extends FrameLayout { //轮播图图片数量    private static int IMAGE_COUNT = 3;    //自动轮播的时间间隔    private final static int TIME_INTERVAL = 5;    //自动轮播启用开关    private final static boolean isAutoPlay = false;       //自定义轮播图的资源ID   

Android轮播图封装,下拉刷新相结合

自定义轮播图CarouselView 自定义下拉刷新PullRefreshListView 马上就要正式做毕业设计了,一些零碎时间写其中的一个模块,现记录下来,以备以后忘记时使用.欢迎大神不吝纠正. 效果图: layout_carousel.xml <?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com

自定义View实现广告位轮播图barner组件

闲谈 最近公司事情不算太多,闲来无事,看到项目中用到的广告轮播图,之前都是使用第三方的,趁事情不算多,所以自己实现一个广告位轮播图barner组件,这样的话,在以后的开发中就可以使用自己的了. 知识点 好了,切入正题!我们要想实现barner组件,首先要求我们需要哪些知识点呢? 1.自定义View的流程(测量.布局.绘制) 2.广告位轮播图滑动的时候,我们需要弹性滑动Scroller 3.自定义View的事件传递机制 4.在我们自定义View事件传递给我们自定义的View的时候,我们在OnTou

photoSlider-原生js移动开发轮播图、相册滑动插件

详细内容请点击 在线预览   立即下载 使用方法: 分别引用css文件和js文件 如: <link rel="stylesheet" type="text/css" href="css/photoSlider.min.css" /><script src="js/photoSlider.min.js" type="text/javascript" charset="utf-8&q

JS 无缝轮播图1-节点操作

无缝轮播图 (使用节点操作) <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title></title> <style> *{ padding:0; margin:0; } body{ background:#F5F5F5; } #content{ width:300px; height:200px;

Android自己定义控件之轮播图控件

背景 近期要做一个轮播图的效果.网上看了几篇文章.基本上都能找到实现,效果还挺不错,可是在写的时候感觉每次都要单独去又一次在Activity里写一堆代码.于是自己封装了一下.这里仅仅是做了下封装成一个控件,不必每次反复写代码了. 效果图 实现分析 轮播图的功能就是实现左右滑动的广告.图片信息展示,那我们就用ViewPager来实现,由于考虑到用户体验,我们还须要在以下加一个指示器来标示滑动到了第几张轮播图.指示器我们能够用一个线性布局来依据要展示的轮播图设置显示的View,我们要做这种一个控件没

Android自定义控件之轮播图控件

背景 最近要做一个轮播图的效果,网上看了几篇文章,基本上都能找到实现,效果还挺不错,但是在写的时候感觉每次都要单独去重新在Activity里写一堆代码.于是自己封装了一下.本篇轮播图实现原理原文出处:循环广告位组件的实现,这里只是做了下封装成一个控件,不必每次重复写代码了. 效果图 实现分析 轮播图的功能就是实现左右滑动的广告.图片信息展示,那我们就用ViewPager来实现,由于考虑到用户体验,我们还需要在下面加一个指示器来标示滑动到了第几张轮播图.指示器我们可以用一个线性布局来根据要展示的轮