View 的工作原理（上）

作者: kongjn | 来源:发表于2017-05-10 17:53 被阅读0次

View 的工作原理

4.1 初识 ViewRoot 和 DecorView

ViewRoot 对应于 ViewRootImpl 类，它是连接 WindowManager 和 DecorView 的纽带，View 的三大流程均是通过 ViewRoot 来完成的。在 ActivityThread 中，当 Activity 对象被创建完毕后，会将 DecorView 添加到 Window 中，同时会创建 ViewRootImpl 对象，并将 ViewRootImpl 对象和 DecorView 建立关联。

View 的绘制流程是从 ViewRoot 的 performTaversals 方法开始的，它经过三个过程才能最终将一个 View 绘制出来。

measure： 测量 View 的宽和高，Measure 完成之后可以通过 getMeasureWidth 和 getMeasureHeight 来获取 View 测量后的高宽。
layout： 确定 View 在父容器中的放置位置，四个顶点的坐标和实际View的宽高，完成之后，通过 getTop，getLeft，getRight，getBottom 获得。
draw： 则负责将 View 绘制在屏幕上，只有 draw 方法完成了之后，View 才会显示在屏幕上。

performTaversals 的工作流程图

image.png

DecorView 作为顶级 View，DecorView其实是一个FrameLayout，其中包含了一个竖直方向的LinearLayout，上面是标题栏，下面是内容栏（id为android.R.id.content）。View层的事件都先经过DecorView，然后才传给我们的View。

4.2 理解 MeasureSpec

4.2.1 MeasureSpec

MeasureSpec代表一个32位int值，高两位代表SpecMode，低30位代表SpecSize，SpecMode是指测量模式，而SpecSize是指在某个测量模式下的规格大小，下面先看一下，MeasureSpec内部的一些常量定义，通过这些就不难理解MeasureSpec的工作原理了。

private static final int MODE_SHIFT = 30;
private static final int MODE_MASK  = 0x3 << MODE_SHIFT;
public static final int UNSPECIFIED = 0 << MODE_SHIFT;
public static final int EXACTLY     = 1 << MODE_SHIFT;
public static final int AT_MOST     = 2 << MODE_SHIFT;

     public static int makeMeasureSpec(@IntRange(from = 0, to = (1 << MeasureSpec.MODE_SHIFT) - 1) int size,
                                          @MeasureSpecMode int mode) {
            if (sUseBrokenMakeMeasureSpec) {
                return size + mode;
            } else {
                return (size & ~MODE_MASK) | (mode & MODE_MASK);
            }
        }

        @MeasureSpecMode
        public static int getMode(int measureSpec) {
            //noinspection ResourceType
            return (measureSpec & MODE_MASK);
        }

        public static int getSize(int measureSpec) {
            return (measureSpec & ~MODE_MASK);
        }

MeasureSpec 通过将 SpecMode 和 SpecSize 打包成一个int值来避免过多的内存分配，为了方便操作，其提供了打包和解包方法。SpecMode 和 SpecSize 也是一个int值，一组 SpecMode 和 SpecSize 可以打包为一个 MeasureSpec，而一个 MeasureSpec 可以通过解包的形式来得出其原始的 SpecMode 和 SpecSize。

MeasureSpec 包含了 size 和 mode

UNSPECIFIED
父容器不对View有任何的限制，要多大给多大，这种情况一般用于系统内部，表示一种测量的状态。
EXACTLY
父容器已经检测出View所需要的精度大小，这个时候View的最终大小就是 SpecSize 所指定的值，它对应于 LayoutParams 中的 match_parent,和具体的数值这两种模式。
AT_MOST
父容器指定了一个可用大小，即 SpecSize，view 的大小不能大于这个值，具体是什么值要看不同view的具体实现，它对应于 LayoutParams 中 wrap_content。

4.2.2 MeasureSpec 和 LayoutParams 的对应关系

MeasureSpec 流程图

View 的 MeasureSpec 创建规则

LayoutParams.MATCH_PARENT： （EXACTLY）精确模式，大小就是窗口大小。
LayoutParams.WRAP_CONTENT：（AT_MOST）最大模式，大小不定，但是不能超过窗口的大小。
固定大小（比如 100dp）：（EXACTLY ）精确模式，大小为 LayoutParams 中指定的大小。

View 的 measure 过程由 ViewGroup 传递过来，请看源码。

public abstract class ViewGroup ...{
...
//遍历所有的子元素
protected void measureChildren(int widthMeasureSpec, int heightMeasureSpec) {
        final int size = mChildrenCount;
        final View[] children = mChildren;
        for (int i = 0; i < size; ++i) {
            final View child = children[i];
            if ((child.mViewFlags & VISIBILITY_MASK) != GONE) {
                measureChild(child, widthMeasureSpec, heightMeasureSpec);
            }
        }
    }
//调用子元素的 measure 方法
protected void measureChildWithMargins(View child,
            int parentWidthMeasureSpec, int widthUsed,
            int parentHeightMeasureSpec, int heightUsed) {
          //获取子元素的 layoutParams
        final MarginLayoutParams lp = (MarginLayoutParams) child.getLayoutParams();
        //getChildMeasureSpec 此处获取 getChildMeasureSpec
        final int childWidthMeasureSpec = getChildMeasureSpec(parentWidthMeasureSpec,
                mPaddingLeft + mPaddingRight + lp.leftMargin + lp.rightMargin
                        + widthUsed, lp.width);
        final int childHeightMeasureSpec = getChildMeasureSpec(parentHeightMeasureSpec,
                mPaddingTop + mPaddingBottom + lp.topMargin + lp.bottomMargin
                        + heightUsed, lp.height);
        //调用子元素的 measure 方法（子元素宽MeasureSpec，子元素高MeasureSpec）
        child.measure(childWidthMeasureSpec, childHeightMeasureSpec);
    }
...
}

getChildMeasureSpec 源码就不贴了，看上图 View 的 MeasureSpec 创建规则，会更方便理解。

4.3 View 的工作流程

View的工作流程主要指：measure、layout、draw，即测量，布局和绘制。

4.3.1 measure

１.View 的 measure 过程
　　ViewGroup 的 measureChildWithMargins 方法传递到 View 的 measure 方法。

public class View...{
...
    public final void measure(int widthMeasureSpec, int heightMeasureSpec) {
    ...
    if (cacheIndex < 0 || sIgnoreMeasureCache) {
                // 测量自己
                onMeasure(widthMeasureSpec, heightMeasureSpec);
                mPrivateFlags3 &= ~PFLAG3_MEASURE_NEEDED_BEFORE_LAYOUT;
            } else {
    ...
    }

看方法 onMeasure：

public class View...{
...//开始测量自己
      protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        setMeasuredDimension(getDefaultSize(getSuggestedMinimumWidth(), widthMeasureSpec),
                getDefaultSize(getSuggestedMinimumHeight(), heightMeasureSpec));
    }
}

再看方法 getDefaultSize：

public static int getDefaultSize(int size, int measureSpec) {
        int result = size;
        int specMode = MeasureSpec.getMode(measureSpec);
        int specSize = MeasureSpec.getSize(measureSpec);

        switch (specMode) {
        case MeasureSpec.UNSPECIFIED:
            result = size;
            break;
        case MeasureSpec.AT_MOST:
        case MeasureSpec.EXACTLY:
            result = specSize;
            break;
        }
        return result;
    }

getDefaultSize 这个方法逻辑很简单，对于我们来说，只要考虑 AT_MOST 和 EXACTLY 这两种情况。其实 getDefaultSize 返回的大小就是 measureSpec 中的 specSize，而这种 specSize 就是 View 测量后的大小，这里提到测量后的大小，因为 View 最终的大小是 layout 阶段确定的，但是几乎所有情况下 View 的测量大小就是最终大小。
　　至于 UNSPECIFIED 这种情况，一般用于系统内部的测量过程，我们来看 getSuggestedMinimumWidth 方法。

public class View...{
...  
       protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        setMeasuredDimension(getDefaultSize(getSuggestedMinimumWidth(), widthMeasureSpec),
                getDefaultSize(getSuggestedMinimumHeight(), heightMeasureSpec));
    }
      protected int getSuggestedMinimumWidth() {
        return (mBackground == null) ? mMinWidth : max(mMinWidth, mBackground.getMinimumWidth());
    }

从 getSuggestedMinimumWidth 的代码可以看出，如果 View 没有设置背景，那么 View 的宽度微 mMinWidth，而 mMinWidth 对应于 android：minWidth 这个属性设定的指（xml），默认为0,；如果指定了背景，再看 getMinimumWidth 方法。

public abstract class Drawable {
...
    public int getMinimumWidth() {
        final int intrinsicWidth = getIntrinsicWidth();
        return intrinsicWidth > 0 ? intrinsicWidth : 0;
    }

getMinimumWidth 返回的就是 Drawable 的原始宽度，默认为0，说明一下 ShapeDrawable 无原始宽/高，而 BitmapDrawable 有原始宽/高（图片的尺寸），详细书中第 6章会介绍。

从 getDefaultSize 方法的实现来看，View 的宽高由 specSize 决定，所以我们可以得出如下结论：直接继承 View 的自定义控件需要重写 onMeasure 方法并设置 wrap_content 时的自身大小，否则在布局中使用 wrap_content 就相当于使用了 match_parent，这一问题需要结合上述代码和表 4-1 才能更好的理解，这里直接给出解决代码。

public class MyView extends View {
   ...
    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        super.onMeasure(widthMeasureSpec, heightMeasureSpec);
        //获取测量过的 MeasureSpec 的 size 和 mode
        int widthSize = MeasureSpec.getSize(widthMeasureSpec);
        int heightSize = MeasureSpec.getSize(heightMeasureSpec);
        int widthMode = MeasureSpec.getMode(widthMeasureSpec);
        int heightMode = MeasureSpec.getMode(heightMeasureSpec);
        //setMeasuredDimension 重新设置 view 的宽高  
        // xml 中设定 wrap_content 就等于 AT_MOST
        //情况1：宽高都是 wrap_content 
        if (widthMode == MeasureSpec.AT_MOST && heightMeasureSpec == MeasureSpec.AT_MOST) {
            setMeasuredDimension(200, 200);
        //情况2：只有宽设置了wrap_content 
        } else if (widthMode == MeasureSpec.AT_MOST) {
            setMeasuredDimension(200, heightSize);
        //情况3：只有高设置了wrap_content 
        } else if (heightMode == MeasureSpec.AT_MOST) {
            setMeasuredDimension(widthSize, 200);
        }
    }
}

解决方法很简单，只要判断是否使用了 wrap_content 属性，如果使用了就重新设置一下 size，这里给出一个默认的尺寸 200（实际操作尽量不要固定写死，否则万一父容器尺寸不到200 就 GG了），当宽高都是 wrap_content 时，view 的尺寸就为 200*200。

2.ViewGroup 的 measure 过程
　 ViewGroup 是一个抽象类，其测量过程的 onMeasure 方法需要各个子类去具体实现，下面看LinearLayout 的 onMeasure 。

@Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        if (mOrientation == VERTICAL) {
            measureVertical(widthMeasureSpec, heightMeasureSpec);
        } else {
            measureHorizontal(widthMeasureSpec, heightMeasureSpec);
        }
    }

竖直布局的测量过程 measureHorizontal，源码太长，只选看一段。

 void measureHorizontal(int widthMeasureSpec, int heightMeasureSpec) {
...
          //获取竖直子元素的数量，并进行遍历
          final int count = getVirtualChildCount();
          for (int i = 0; i < count; ++i) {
            final View child = getVirtualChildAt(i);
            ...
              measureChildBeforeLayout(child, i, widthMeasureSpec,
                        totalWeight == 0 ? mTotalLength : 0,
                        heightMeasureSpec, 0);

                if (oldWidth != Integer.MIN_VALUE) {
                    lp.width = oldWidth;
                }

                final int childWidth = child.getMeasuredWidth();
                if (isExactly) {
                    mTotalLength += childWidth + lp.leftMargin + lp.rightMargin +
                            getNextLocationOffset(child);
                } else {
                    final int totalLength = mTotalLength;
                    mTotalLength = Math.max(totalLength, totalLength + childWidth + lp.leftMargin +
                           lp.rightMargin + getNextLocationOffset(child));
                }
...
        //测量 LinearLayout 自己的大小
        mTotalLength += mPaddingTop + mPaddingBottom;

        int heightSize = mTotalLength;

        // Check against our minimum height
        heightSize = Math.max(heightSize, getSuggestedMinimumHeight());
        
        // Reconcile our calculated size with the heightMeasureSpec
        int heightSizeAndState = resolveSizeAndState(heightSize, heightMeasureSpec, 0);
        heightSize = heightSizeAndState & MEASURED_SIZE_MASK;
...
         setMeasuredDimension(resolveSizeAndState(maxWidth, widthMeasureSpec, childState),
                heightSizeAndState);
...

系统会遍历子元素对每个元素执行 measureChildBeforeLayout 方法，点进去这个方法，最后会进入到 ViewGroup 类中，然后各个子元素就开始依次进入 measure 过程，前面都有讲过。mTotalLength 这个变量用来储存 LinearLayout 在竖直方向所有子元素的高度，包括margin 等，最后LinearLayout 会测量自己的大小。

View 的measure 是三大流程中最复杂的一个，measure 完成以后，用过 getMeasureWidth/Height 方法就可以获取到 View 的宽高，在某些极端情况下，可能要多次measure 才能最终确定，一个比较好的习惯是在 onLayout 中获取 View 的最终宽高。

问题：如何在 Activity 中获取一个 View 的宽高，View 的 measure 过程和 Activity 的生命周期是不同步的，有时获取可能为0，解决方法有四种：

（1）Activity / View # onWindowFocusChanged。
　　onWindowFocusChanged 含义是:View 初始化完毕，当 Activity 调用 onResume 和 onPuse，该方法会被多次调用。

 @Override
    public void onWindowFocusChanged(boolean hasFocus) {
        //onResume 对应 hasFocus = true，onPuse对应 hasFocus = false
        super.onWindowFocusChanged(hasFocus);
    }

（2）*** view.post（runnable）***

通过 post 可以将一个 runnable 投递到消息队列的尾部，然后等待 Looper 调用此 runnable 的时候，View 也已经初始化好了。

    @Override
    protected void onStart() {
        super.onStart();
        view.post(new Runnable() {
            @Override
            public void run() {
                int width = view.getMeasuredWidth();
                int height = view.getMeasuredHeight();
            }
        });
    }

（3）ViewTreeObserver

使用 ViewTreeObserver 的 OnGlobaLayoutListener 接口，当 View 树的状态改变或者 View 树内部的 View 可见性发生改变时，onGlobaLayout 方法都将被回调。

@Override
    protected void onStart() {
        super.onStart();
        ViewTreeObserver observer = view.getViewTreeObserver();
        observer.addOnGlobalLayoutListener(new OnGlobalLayoutListener() {

            @SuppressWarnings("deprecation")
            @Override
            public void onGlobalLayout() {
                view.getViewTreeObserver().removeGlobalOnLayoutListener(this);
                int width = view.getMeasuredWidth();
                int height = view.getMeasuredHeight();
            }
        });
    }

（4）view.measure
　　
　　通过手动对 View 进行 measure 来得到 View 的宽 / 高，这种方法相当复杂，个人感觉没必要，忽略之。

 private void measureView() {
        int widthMeasureSpec = MeasureSpec.makeMeasureSpec((1 << 30) - 1, MeasureSpec.AT_MOST);
        int heightMeasureSpec = MeasureSpec.makeMeasureSpec(100, MeasureSpec.EXACTLY);
        view.measure(widthMeasureSpec, heightMeasureSpec);
        Log.d(TAG, "measureView, width= " + view.getMeasuredWidth() + " height= " + view.getMeasuredHeight());
    }

4.3.2 layout 过程

当 ViewGroup 的位置被确定后，它在 onLayout 中遍历所有的子元素调用其 layout 方法。

public class View{
...
@SuppressWarnings({"unchecked"})
    public void layout(int l, int t, int r, int b) {
        if ((mPrivateFlags3 & PFLAG3_MEASURE_NEEDED_BEFORE_LAYOUT) != 0) {
            onMeasure(mOldWidthMeasureSpec, mOldHeightMeasureSpec);
            mPrivateFlags3 &= ~PFLAG3_MEASURE_NEEDED_BEFORE_LAYOUT;
        }

        int oldL = mLeft;
        int oldT = mTop;
        int oldB = mBottom;
        int oldR = mRight;

        boolean changed = isLayoutModeOptical(mParent) ?
                setOpticalFrame(l, t, r, b) : setFrame(l, t, r, b);

        if (changed || (mPrivateFlags & PFLAG_LAYOUT_REQUIRED) == PFLAG_LAYOUT_REQUIRED) {
            onLayout(changed, l, t, r, b);

            ...
    }

layout 方法大致流程如下：首先通过 setFrame 方法来设定 View 的四个顶点位置；接着会调用 onLayout 方法，确定子元素的位置，onLayout 是抽象方法，需要子类来实现。

public class LinearLayout extends ViewGroup {
...
 @Override
    protected void onLayout(boolean changed, int l, int t, int r, int b) {
        if (mOrientation == VERTICAL) {
            layoutVertical(l, t, r, b);
        } else {
            layoutHorizontal(l, t, r, b);
        }
    }
...
void layoutVertical(int left, int top, int right, int bottom) {
       ...//获取竖向子元素的数量
        final int count = getVirtualChildCount();
        ...
        for (int i = 0; i < count; i++) {
            final View child = getVirtualChildAt(i);
            if (child == null) {
                childTop += measureNullChild(i);
            } else if (child.getVisibility() != GONE) {
                final int childWidth = child.getMeasuredWidth();
                final int childHeight = child.getMeasuredHeight();
                
                final LinearLayout.LayoutParams lp =
                        (LinearLayout.LayoutParams) child.getLayoutParams();

                if (hasDividerBeforeChildAt(i)) {
                    childTop += mDividerHeight;
                }
                //childTop 变大，往下排序
                childTop += lp.topMargin;
                setChildFrame(child, childLeft, childTop + getLocationOffset(child),childWidth, childHeight);
                childTop += childHeight + lp.bottomMargin + getNextLocationOffset(child);

                i += getChildrenSkipCount(child, i);
            }
        }
    }
...//调用子元素的layout
private void setChildFrame(View child, int left, int top, int width, int height) {        
        child.layout(left, top, left + width, top + height);
    }

此方法会遍历所有的子元素并调用 setChildFrame 方法来指定子元素位置，childTop 会叠加，子元素就往下排序，setChildFrame 会调用子元素的layout，这样父元素在 layout 方法中完成自己的定位以后，通过 onLayout 方法去调用子元素的 layout 方法，子元素有会通过自己的layout 方法来确定自己的位置，这样一层层传递下去就完成了整个 View 树的 layout 过程。

问题：View 的测量宽高和最终的宽高有什么区别？这个问题可以具体为：View 的getMeasureWidth 和 getWidth 有什么区别。

这种情况只会在特殊情况下出现，因为测量的 measure 过程时机比 layout 过程稍微早点。

public class MyView extends View {
...
@Override
    protected void onLayout(boolean changed, int left, int top, int right, int bottom) {
        super.onLayout(changed, left, top, right+100, bottom+100);
    }

上述代码会导致在任何情况下 View 的最终宽高总是比测量宽高大 100 px，虽然这会导致 View 显示不正常也没有实际意义。在日常开发中基本不会出现这个问题。

4.3.3 draw 过程

Draw 就是将 View 绘制到屏幕上。

（1）绘制背景 background（canvas）
　（2）绘制自己（onDraw）
　（3）绘制children（dispatchDraw）
　（4）绘制装饰（onDrawScrollBars）

public void draw(Canvas canvas) {
        final int privateFlags = mPrivateFlags;
        final boolean dirtyOpaque = (privateFlags & PFLAG_DIRTY_MASK) == PFLAG_DIRTY_OPAQUE &&
                (mAttachInfo == null || !mAttachInfo.mIgnoreDirtyState);
        mPrivateFlags = (privateFlags & ~PFLAG_DIRTY_MASK) | PFLAG_DRAWN;

        /*
         * 绘制遍历执行几个绘图步骤，必须按照适当的顺序执行：（渣百度翻译。。。）
         *
         *      1. Draw the background 画背景
         *      2. If necessary, save the canvas' layers to prepare for fading 如果有必要，保存画布图层以备褪色
         *      3. Draw view's content 绘制视图内容
         *      4. Draw children 绘制子元素
         *      5. If necessary, draw the fading edges and restore layers 如有必要，绘制衰减边并恢复图层
         *      6. Draw decorations (scrollbars for instance) 画装饰（滚动条为例）
         */

        // Step 1, draw the background, if needed
        int saveCount;

        if (!dirtyOpaque) {
            drawBackground(canvas);
        }

        // skip step 2 & 5 if possible (common case)
        final int viewFlags = mViewFlags;
        boolean horizontalEdges = (viewFlags & FADING_EDGE_HORIZONTAL) != 0;
        boolean verticalEdges = (viewFlags & FADING_EDGE_VERTICAL) != 0;
        if (!verticalEdges && !horizontalEdges) {
            // Step 3, draw the content
            if (!dirtyOpaque) onDraw(canvas);

            // Step 4, draw the children 绘制子元素
            dispatchDraw(canvas);

            // Overlay is part of the content and draws beneath Foreground
            if (mOverlay != null && !mOverlay.isEmpty()) {
                mOverlay.getOverlayView().dispatchDraw(canvas);
            }

            // Step 6, draw decorations (foreground, scrollbars)
            onDrawForeground(canvas);

            // we're done...
            return;
        }

View 绘制过程的传递是通过 dispatchDraw 来实现的，dispatchDraw 会遍历所有的子元素的 draw 方法，View 没有具体的实现 dispatchDraw ，子类需要重写 dispatchDraw 。

View 中的有一个特殊的方法，setWillNotDraw，如果一个 View 不需要绘制任何内容，那么设置这个标记位为 true，系统会进行响应的优化。（此处就不学了，以后用到再来看书）

View 的工作原理（上）

4.1 初识 ViewRoot 和 DecorView

4.2 理解 MeasureSpec

4.2.1 MeasureSpec

4.2.2 MeasureSpec 和 LayoutParams 的对应关系

4.3 View 的工作流程

4.3.1 measure

4.3.2 layout 过程

4.3.3 draw 过程

相关文章

网友评论

延伸阅读

深度阅读

栏目导航

热点阅读