[UI]抽屉菜单DrawerLayout分析（一）

侧拉菜单作为常见的导航交互控件，最开始在没有没有android官方控件时，很多时候都是使用开源的SlidingMenu，一直没机会分析侧拉菜单的实现机理，本文将分析android.support.v4.widget.DrawerLayout的使用及实现。

官方介绍

DrawerLayout acts as a top-level container for window content that allows for interactive "drawer" views to be pulled out from the edge of the window.

Drawer positioning and layout is controlled using the android:layout_gravity attribute
on child views corresponding to which side of the view you want the drawer to emerge from: left or right. (Or start/end on platform versions that support layout direction.)

To use a DrawerLayout, position your primary content view as the first child with a width and height of match_parent .
Add drawers as child views after the main content view and set the layout_gravity appropriately.
Drawers commonly use match_parent for
height with a fixed width.

DrawerLayout.DrawerListener can
be used to monitor the state and motion of drawer views. Avoid performing expensive operations such as layout during animation as it can cause stuttering; try to perform expensive operations during the STATE_IDLE state. DrawerLayout.SimpleDrawerListener offers
default/no-op implementations of each callback method.

As per the Android Design guide, any drawers positioned to the left/start should always contain content for navigating around the application, whereas any drawers positioned to the right/end
should always contain actions to take on the current content. This preserves the same navigation left, actions right structure present in the Action Bar and elsewhere

DrawerLayout直译的事抽屉布局的意思，作为视窗内的顶层容器，它允许用户通过抽屉式的推拉操作，从而把视图视窗外边缘拉到屏幕内，如右图：

抽屉菜单的摆放和布局通过 android:layout_gravity 属性来控制，可选值为left、right或start、end。通过xml来布局的话，需要把DrawerLayout作为父容器，组界面布局作为其第一个子节点，抽屉布局则紧随其后作为第二个子节点，这样就做就已经把内容展示区和抽屉菜单区独立开来，只需要分别非两个区域设置内容即可。android提供了一些实用的监听器，重载相关的回调方法可以在菜单的交互过程中书写逻辑业务。下面是一个demo布局:

<android.support.v4.widget.DrawerLayout

xmlns:android="http://schemas.android.com/apk/res/android"

xmlns:tools="http://schemas.android.com/tools"

android:id="@+id/drawer_layout"

android:layout_width="match_parent"

android:layout_height="match_parent"

tools:context="com.aven.myapplication2.app.MainActivity">

<FrameLayout

android:id="@+id/container"

android:layout_width="match_parent"

android:layout_height="match_parent"/>

<fragmentandroid:id="@+id/navigation_drawer"

android:layout_width="@dimen/navigation_drawer_width"

android:layout_height="match_parent"

android:layout_gravity="start"

android:name="com.aven.myapplication2.app.NavigationDrawerFragment"

tools:layout="@layout/fragment_navigation_drawer"/>

</android.support.v4.widget.DrawerLayout>

源码分析

DrawerLayout实例化相关辅助类

既然DrawerLayout使用是作为顶层布局layout，那先看看他的构造函数：

public DrawerLayout(Context context, AttributeSet
attrs, int defStyle) {

super(context, attrs, defStyle);

//根据屏幕分辨率密度计算最小的边距

final float density = getResources().getDisplayMetrics().density;

mMinDrawerMargin = (int) (MIN_DRAWER_MARGIN * density + 0.5f);

final float minVel = MIN_FLING_VELOCITY * density;

//实例化视图滑动的回调接口，包括左右两边

mLeftCallback = new ViewDragCallback(Gravity.LEFT);

mRightCallback = new ViewDragCallback(Gravity.RIGHT);

//创建滑动手势的的辅助类，负责具体的滑动监听实现

mLeftDragger = ViewDragHelper.create(this, TOUCH_SLOP_SENSITIVITY, mLeftCallback);

mLeftDragger.setEdgeTrackingEnabled(ViewDragHelper.EDGE_LEFT);

mLeftDragger.setMinVelocity(minVel);

mLeftCallback.setDragger(mLeftDragger);

mRightDragger = ViewDragHelper.create(this, TOUCH_SLOP_SENSITIVITY, mRightCallback);

mRightDragger.setEdgeTrackingEnabled(ViewDragHelper.EDGE_RIGHT);

mRightDragger.setMinVelocity(minVel);

mRightCallback.setDragger(mRightDragger);

// So that we can catch the back button

setFocusableInTouchMode(true);

ViewCompat.setAccessibilityDelegate(this, new AccessibilityDelegate());

ViewGroupCompat.setMotionEventSplittingEnabled(this,false);

}

从构造函数中，我们发现有两个关键的类ViewDragCallback, ViewDragHelper，命名上来看前者和滑动的回调相关，后者和view的滑动操作实现有关，所以先看ViewDragHelper。

ViewDragHelper负责实现drag操作

从它的类注释信息中可以看到，这个helper是个辅助类，里面封装了一些便于用户拖动ViewGroup内子view的操作及状态记录方法。

/**

* ViewDragHelper is a utility class for writing custom ViewGroups. It offers a number

* of useful operations and state tracking for allowing a user to drag and reposition

* views within their parent ViewGroup.

*/

这第二个工厂方法create就是刚才看到的上层调用来创建helper实例的，我们传入了一个viewgroup，也就是说helper将持有我们的DrawerLayout实例引用,第二是一个浮点数，和drag操作的敏感性相关，数值越大表示drag操作更易被监听，最后是一个Callback，即ViewDragCallback实例，它本身继承自ViewDragHelper.Callback，现在来看helper的构造方法：

/**

* Apps should use ViewDragHelper.create() to get a new instance.

* This will allow VDH to use internal compatibility implementations for different

* platform versions.

*

* @param context Context to initialize config-dependent params from

* @param forParent Parent view to monitor

*/

private ViewDragHelper(Context context, ViewGroup
forParent, Callback cb) {

if (forParent == null) {

throw new IllegalArgumentException("Parent
view may not be null");

}

if (cb == null) {

throw new IllegalArgumentException("Callback
may not be null");

}

mParentView = forParent;

mCallback = cb;

final ViewConfiguration vc = ViewConfiguration.get(context);

finalfloat density = context.getResources().getDisplayMetrics().density;

mEdgeSize = (int) (EDGE_SIZE * density + 0.5f);

mTouchSlop = vc.getScaledTouchSlop();

mMaxVelocity = vc.getScaledMaximumFlingVelocity();

mMinVelocity = vc.getScaledMinimumFlingVelocity();

mScroller = ScrollerCompat.create(context, sInterpolator);

}

首先需要检测我们传入的DrawerLayout和回调Callback，不允许为空。接下来从ViewConfiguration中获取一些view的默认配置，

vc.getScaledTouchSlop是获取一个pix为单位的距离，代表view在滑动的值；

vc.getScaledMaximumFlingVelocity获取触发view
fling的最大每秒滚动的距离，也是pix为单位；

获取view fling的最小每秒滚动距离，同样pix为单位；

这里有scroll和fling，我的理解是scroll表示手没有离开屏幕产生的滑动效果，二fling则是用力一划，然后view自己开始滚动的效果。

最后实例化一个Scroller，这是专门用来处理滚动的一个类，这里用的是扩展包里的campact类做版本兼容。

到此DrawerLayout已经准备好所有资源，接下来就是手势分发时候的各种调用，这一部分留到下一篇文章在做分析

Source：

git clone https://github.com/avenwu/DrawerDemo.git

在[UI]抽屉菜单DrawerLayout分析（一）和[UI]抽屉菜单DrawerLayout分析（二）中分别介绍了DrawerLayout得基本框架结构和ViewDragerHelper的作用以及手势分发，本文一起来分析其中的Scroller的使用情况。

在ViewDragerHelper中可以发现private ScrollerCompat mScroller;说明抽屉菜单的具体滑动也是依赖于Scroller的使用，检索一下mScroller的引用，定位到forceSettleCapturedViewAt，这个方法回调用Scroller的startScroll来计算位移，它本身适用于计算和保存位移在特定时间的变化情况，最终的在绘制view时我可以获取其保存的x，y坐标值。

/**

* Settle the captured view at the given (left, top) position.

*

* @param finalLeft Target left position for the captured view

* @param finalTop Target top position for the captured view

* @param xvel Horizontal velocity

* @param yvel Vertical velocity

* @return true if animation should continue through {@link #continueSettling(boolean)} calls

*/

private boolean forceSettleCapturedViewAt(int finalLeft, int finalTop, int xvel, int yvel) {

final int startLeft = mCapturedView.getLeft();

final int startTop = mCapturedView.getTop();

final int dx = finalLeft - startLeft;

final int dy = finalTop - startTop;

if (dx == 0 && dy == 0) {

// Nothing to do. Send callbacks, be done.

mScroller.abortAnimation();

setDragState(STATE_IDLE);

returnfalse;

}

final int duration = computeSettleDuration(mCapturedView, dx, dy, xvel, yvel);

mScroller.startScroll(startLeft, startTop, dx, dy, duration);

setDragState(STATE_SETTLING);

returntrue;

}

这里用的是v4扩展包里的ScrollerCompat用于低版本兼容，它继承自ScrollerCompatImpl，可以看到里面主要的方法声明：

interface ScrollerCompatImpl{

Object createScroller(Context context, Interpolator interpolator);

boolean isFinished(Object scroller);

int getCurrX(Object scroller);

int getCurrY(Object scroller);

float getCurrVelocity(Object scroller);

boolean computeScrollOffset(Object scroller);

void startScroll(Object scroller, int startX, int startY, int dx, int dy);

void startScroll(Object scroller, int startX, int startY, int dx, int dy, int duration);

void fling(Object scroller, int startX, int startY, int velX, int velY,

int minX, int maxX, int minY, int maxY);

void fling(Object scroller, int startX, int startY, int velX, int velY,

int minX, int maxX, int minY, int maxY, int overX, int overY);

void abortAnimation(Object scroller);

void notifyHorizontalEdgeReached(Object scroller, int startX, int finalX, int overX);

void notifyVerticalEdgeReached(Object scroller, int startY, int finalY, int overY);

boolean isOverScrolled(Object scroller);

int getFinalX(Object scroller);

int getFinalY(Object scroller);

}

从Scroller一直往上追溯，可以得到如图的调用流程。

当滑动屏幕时，DrawerLayout中的手势分发被触发，先执行onInterceptTouchEvent根据返回结果确定是否执行onTouchEvent,之后就是一些和ViewDragHelper之间的回调接口处理。

接下来追踪一下什么时候从Scroller中取出x，y来使用：

在View里面有一个实现为空的computeScroll，DrawerLayout对它进行重写，这个方法应该是在view自动重绘是会被调用，回到continueSettling：

/**

* Move the captured settling view by the appropriate amount for the current time.

* If <code>continueSettling</code> returns true, the caller should call it again

* on the next frame to continue.

*

* @param deferCallbacks true if state callbacks should be deferred via posted message.

*                       Set this to true if you are calling this method from

*                       {@link android.view.View#computeScroll()} or similar methods

*                       invoked as part of layout or drawing.

* @return true if settle is still in progress

*/

public boolean continueSettling(boolean deferCallbacks) {

if (mDragState == STATE_SETTLING) {

boolean keepGoing = mScroller.computeScrollOffset();

final int x = mScroller.getCurrX();

final int y = mScroller.getCurrY();

final int dx = x - mCapturedView.getLeft();

final int dy = y - mCapturedView.getTop();

if (dx != 0) {

mCapturedView.offsetLeftAndRight(dx);

}

if (dy != 0) {

mCapturedView.offsetTopAndBottom(dy);

}

if (dx != 0 || dy != 0) {

mCallback.onViewPositionChanged(mCapturedView, x, y, dx, dy);

}

if (keepGoing && x == mScroller.getFinalX() && y == mScroller.getFinalY()) {

// Close enough. The interpolator/scroller might think we're still moving

// but the user sure doesn't.

mScroller.abortAnimation();

keepGoing = mScroller.isFinished();

}

if (!keepGoing) {

if (deferCallbacks) {

mParentView.post(mSetIdleRunnable);

} else {

setDragState(STATE_IDLE);

}

}

}

return mDragState == STATE_SETTLING;

}

当状态处于STATE_SETTLING时开始获取Scroller中的x，y值，结合当前运动view的left，top位置，计算出偏移量，通过offsetLeftAndRight设置，里面是一些具体的位置改变，挺复杂的。

/**

* Offset this view's horizontal location by the specified amount of pixels.

*

* @param offset the number of pixels to offset the view by

*/

public void offsetLeftAndRight(int offset) {

if (offset != 0) {

updateMatrix();

final boolean matrixIsIdentity = mTransformationInfo == null

|| mTransformationInfo.mMatrixIsIdentity;

if (matrixIsIdentity) {

if (mDisplayList != null) {

invalidateViewProperty(false, false);

} else {

final ViewParent p = mParent;

if (p != null && mAttachInfo != null) {

final Rect r = mAttachInfo.mTmpInvalRect;

int minLeft;

int maxRight;

if (offset < 0) {

minLeft = mLeft + offset;

maxRight = mRight;

} else {

minLeft = mLeft;

maxRight = mRight + offset;

}

r.set(0, 0, maxRight - minLeft, mBottom - mTop);

p.invalidateChild(this, r);

}

}

} else {

invalidateViewProperty(false, false);

}

mLeft += offset;

mRight += offset;

if (mDisplayList != null) {

mDisplayList.offsetLeftAndRight(offset);

invalidateViewProperty(false, false);

} else {

if (!matrixIsIdentity) {

invalidateViewProperty(false, true);

}

invalidateParentIfNeeded();

}

}

}

小结

至此DrawerLayout的基本工作流程分析完毕，简单做一个总结，v4包提供了ViewDragHelper类，里面封装了对scroller合view的位移操作，和Callback接口，通过DrawerLayout内的onInterceptTouchEvent和onTouchEvent的重载，触发ViewDragHelper内的相关方法，同时在DrawerLayout内实现ViewDragHelp.Callback.