用ViewDragHelper自定义侧滑菜单——浅析源码解决与ScrollView的滑动冲突

上篇博文带大家分析学习了关于ViewDragHelper的简单基本用法，本篇将带大家用ViewDragHelper做一个简单侧滑菜单的Demo，并通过对ViewDragHelper源码的简单分析，找到其与ScrollView滑动事件冲突的原因与解决方法。闲话少说，直入正题，首先来看一下运行效果。

首先，我们先看一下布局文件，以便整体了解界面布局结构：

<LinearLayout 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"
    android:baselineAligned="false"
    android:orientation="vertical"
    tools:context="com.example.caifengyao.drawerlayout.MainActivity">


    <com.example.caifengyao.drawerlayout.DragViewGroup
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <TextView
            android:id="@+id/tv"
            android:layout_width="match_parent"
            android:layout_height="60dp"
            android:layout_alignParentTop="true"
            android:background="#00aacc"
            android:gravity="center"
            android:text="我是标题"
            android:textStyle="bold" />

        <ScrollView
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_below="@+id/tv">

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

                <Button
                    android:layout_width="match_parent"
                    android:layout_height="300dp"
                    android:background="#aa00ff" />

                <TextView
                    android:layout_width="match_parent"
                    android:layout_height="300dp"
                    android:background="#00ffaa" />
            </LinearLayout>
        </ScrollView>

        <ScrollView
            android:layout_width="300dp"
            android:layout_height="match_parent"
            android:layout_marginLeft="-300dp">

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

                <TextView
                    android:layout_width="match_parent"
                    android:layout_height="400dp"
                    android:background="@color/colorAccent" />

                <TextView
                    android:layout_width="match_parent"
                    android:layout_height="400dp"
                    android:background="@color/colorPrimary" />

            </LinearLayout>
        </ScrollView>

    </com.example.caifengyao.drawerlayout.DragViewGroup>
</LinearLayout>

通过看布局，我们可以发现com.example.caifengyao.drawerlayout.DragViewGroup就是我们的自定义侧滑菜单布局，它实际上是继承自RelativeLayout，它里面又放置三个内容，第一个就是标题了，第二个ScrollView就是页面的Content，第三个ScrollView就是我们的侧滑内容，并且它的marginLeft属性设置为了-300dp，使其可以偏离出屏幕左面。

下面就是我们的DragViewGroup代码了，我们来看下代码实现：

public class DragViewGroup extends RelativeLayout {
    private ViewDragHelper mViewDragHelper;
    private View mMainView;
    private int mWidth;

    public DragViewGroup(Context context) {
        super(context);
        initView();
    }

    public DragViewGroup(Context context, AttributeSet attrs) {
        super(context, attrs);
        initView();
    }


    @Override
    protected void onFinishInflate() {
        super.onFinishInflate();
        mMainView = getChildAt(2);
    }

    private void initView() {
        mViewDragHelper = ViewDragHelper.create(this, callback);
        mViewDragHelper.setEdgeTrackingEnabled(ViewDragHelper.EDGE_LEFT);
    }

    @Override
    protected void onSizeChanged(int w, int h, int oldw, int oldh) {
        super.onSizeChanged(w, h, oldw, oldh);
        mWidth = mMainView.getMeasuredWidth();
    }

    @Override
    public boolean onInterceptTouchEvent(MotionEvent ev) {
        return mViewDragHelper.shouldInterceptTouchEvent(ev);
    }

    @Override
    public boolean onTouchEvent(MotionEvent ev) {
        mViewDragHelper.processTouchEvent(ev);
        return true;
    }


    private ViewDragHelper.Callback callback = new ViewDragHelper.Callback() {
        @Override
        public boolean tryCaptureView(View child, int pointerId) {
            return mMainView == child;
        }


        @Override
        public void onEdgeDragStarted(int edgeFlags, int pointerId) {
            super.onEdgeDragStarted(edgeFlags, pointerId);
            mViewDragHelper.captureChildView(mMainView, pointerId);
        }

        @Override
        public int clampViewPositionVertical(View child, int top, int dy) {
            return 0;
        }

        @Override
        public int clampViewPositionHorizontal(View child, int left, int dx) {
            return Math.min(left, 0);//使展开的最大程度不超过菜单的整体宽度
        }

        @Override
        public void onViewReleased(View releasedChild, float xvel, float yvel) {
            super.onViewReleased(releasedChild, xvel, yvel);
            if (mMainView.getRight() < mWidth / 2) {//当拖动距离小于侧划菜单宽度的一半时，菜单收回
                mViewDragHelper.smoothSlideViewTo(mMainView, -mWidth, 0);
                ViewCompat.postInvalidateOnAnimation(DragViewGroup.this);
            } else {//当拖动距离大于等于侧划菜单宽度的一半时，菜单完全展开
                mViewDragHelper.smoothSlideViewTo(mMainView, 0, 0);
                ViewCompat.postInvalidateOnAnimation(DragViewGroup.this);
            }
        }
    };

    @Override
    public void computeScroll() {
        if (mViewDragHelper.continueSettling(true)) {
            ViewCompat.postInvalidateOnAnimation(this);
        }
    }
}

可以看到，代码与上篇博文的基本没什么差别，各方法作用在上篇博文也已经做出来讲解，这里就不在赘述，不清楚的朋友可以查看我的上篇博文： ViewDragHelper用法介绍，快捷的拖动效果设计。

这里，主要说两个地方，首先我在clampViewPositionHorizontal方法中返回的是Math.min(left, 0)，而不再是left，原因是我不希望侧滑菜单被过分的拖动。因为他是隐藏在左屏幕外，所以他的X轴坐标是负的，在拖动过程中，left一直是负数且逐渐增大，当left为0的时候，其完全展开，菜单左边界与屏幕左