澳门新葡萄京官网注册 2

Android View 布局流程(Layout)完全解析

在清楚了View绘制机制中的第一步测量之后,我们继续来了解分析View绘制的第二个过程,那就是布局定位。继续跟踪分析源码,根据之前的流程分析我们知道View的绘制是从RootViewImpl的performTraversals方法开始的,在此方法中依次调用了performMeasure、performLayout、performDraw等方法进行测量、布局、绘制,那么下面我们就看看则方performLayout中都做了哪些事情,该方法的关键源码如下:

上一篇文章,笔者详细讲述了View三大工作流程的第一个,Measure流程,如果对测量流程还不熟悉的读者可以参考一下上一篇文章。测量流程主要是对View树进行测量,获取每一个View的测量宽高,那么有了测量宽高,就是要进行布局流程了,布局流程相对测量流程来说简单许多。那么我们开始对layout流程进行详细的解析。

private void performLayout(WindowManager.LayoutParams lp, int desiredWindowWidth,
            int desiredWindowHeight) {
        mLayoutRequested = false;
        mScrollMayChange = true;
        mInLayout = true;
        final View host = mView;
          ……
        try {
            host.layout(0, 0, host.getMeasuredWidth(), host.getMeasuredHeight());
……
        } finally {
            Trace.traceEnd(Trace.TRACE_TAG_VIEW);
        }
        mInLayout = false;
    }

上一篇文章提到,三大流程始于ViewRootImpl#performTraversals方法,在该方法内通过调用performMeasure、performLayout、performDraw这三个方法来进行measure、layout、draw流程,那么我们就从performLayout方法开始说,我们先看它的源码:

从中看出,最关键的代码就是调用了host.layout方法,那么大家还记不记得host是个什么东东呢?对了,正是我们之前说的根视图DecorView。那么我们就回到DecorView看看它在layout方法中到底做了什么事情。令人失望的是,我们在DecorView中并没有发现该方法,不要急,根据该类的继承体系,我们最终追踪到layout方法在View中。

private void performLayout(WindowManager.LayoutParams lp, int desiredWindowWidth, int desiredWindowHeight) { mLayoutRequested = false; mScrollMayChange = true; mInLayout = true; final View host = mView; if (DEBUG_ORIENTATION || DEBUG_LAYOUT) { Log.v(TAG, "Laying out " + host + " to (" + host.getMeasuredWidth() + ", " + host.getMeasuredHeight; } Trace.traceBegin(Trace.TRACE_TAG_VIEW, "layout"); try { host.layout(0, 0, host.getMeasuredWidth(), host.getMeasuredHeight; // 1 //省略... } finally { Trace.traceEnd(Trace.TRACE_TAG_VIEW); } mInLayout = false;}

澳门新葡萄京官网注册 1

澳门新葡萄京官网注册 ,由上面的代码可以看出,直接调用了①号的host.layout方法,host也就是DecorView,那么对于DecorView来说,调用layout方法,就是对它自身进行布局,注意到传递的参数分别是0,0,host.getMeasuredWidth,host.getMeasuredHeight,它们分别代表了一个View的上下左右四个位置,显然,DecorView的左上位置为0,然后宽高为它的测量宽高。由于View的layout方法是final类型,子类不能重写,因此我们直接看View#layout方法即可:

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);
            mPrivateFlags &= ~PFLAG_LAYOUT_REQUIRED;

            ListenerInfo li = mListenerInfo;
            if (li != null && li.mOnLayoutChangeListeners != null) {
                ArrayList<OnLayoutChangeListener> listenersCopy =
                        (ArrayList<OnLayoutChangeListener>)li.mOnLayoutChangeListeners.clone();
                int numListeners = listenersCopy.size();
                for (int i = 0; i < numListeners; ++i) {
                    listenersCopy.get(i).onLayoutChange(this, l, t, r, b, oldL, oldT, oldR, oldB);
                }
            }
        }

        mPrivateFlags &= ~PFLAG_FORCE_LAYOUT;
        mPrivateFlags3 |= PFLAG3_IS_LAID_OUT;
    }

protected void onLayout(boolean changed, int left, int top, int right, int bottom) {}
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 ? setOpticalFrame(l, t, r, b) : setFrame(l, t, r, b); // 1 if (changed || (mPrivateFlags & PFLAG_LAYOUT_REQUIRED) == PFLAG_LAYOUT_REQUIRED) { onLayout(changed, l, t, r, b); // 2 mPrivateFlags &= ~PFLAG_LAYOUT_REQUIRED; ListenerInfo li = mListenerInfo; if (li != null && li.mOnLayoutChangeListeners != null) { ArrayList<OnLayoutChangeListener> listenersCopy = (ArrayList<OnLayoutChangeListener>)li.mOnLayoutChangeListeners.clone(); int numListeners = listenersCopy.size(); for (int i = 0; i < numListeners; ++i) { listenersCopy.get.onLayoutChange(this, l, t, r, b, oldL, oldT, oldR, oldB); } } } mPrivateFlags &= ~PFLAG_FORCE_LAYOUT; mPrivateFlags3 |= PFLAG3_IS_LAID_OUT;}

该方法中的4个参数代表了当前的View与父View之间4个方向上的距离,同时从说明中可以看出,此方法不应该被子类重写,如果需要重新布局,可以在子类中重写的方法是onLayout,此方法在View中是个空方法,什么都没有写。可实际上layout的方法在View中并没有被标识为final,这就意味是可以被重写的。

首先看①号代码,调用了setFrame方法,并把四个位置信息传递进去,这个方法用于确定View的四个顶点的位置,即初始化mLeft,mRight,mTop,mBottom这四个值,当初始化完毕后,ViewGroup的布局流程也就完成了那么,我们先看View#setFrame方法:

继续查看ViewGoup中的相关代码,果然layout被重写了并添加了final标识,同时onLayout被标识为抽象方法,所以继承了ViewGroup的类是,是不能重写layout方法的,并且要实现onLayout方法。从代码可以看出,虽然ViewGroup重写了layout,实际本质上还是调用了View的layout,然后通过调用onLayout方法最终完成布局定位的。

protected boolean setFrame(int left, int top, int right, int bottom) { //省略... mLeft = left; mTop = top; mRight = right; mBottom = bottom; mRenderNode.setLeftTopRightBottom(mLeft, mTop, mRight, mBottom); //省略... return changed;}
       @Override
    public final void layout(int l, int t, int r, int b) {
        if (!mSuppressLayout && (mTransition == null || !mTransition.isChangingLayout())) {
            if (mTransition != null) {
                mTransition.layoutChange(this);
            }
            super.layout(l, t, r, b);
        } else {
            // record the fact that we noop'd it; request layout when transition finishes
            mLayoutCalledWhileSuppressed = true;
        }
    }
    @Override
    protected abstract void onLayout(boolean changed,
            int l, int t, int r, int b);

可以看出,它对mLeft、mTop、mRight、mBottom这四个值进行了初始化,对于每一个View,包括ViewGroup来说,以上四个值保存了Viwe的位置信息,所以这四个值是最终宽高,也即是说,如果要得到View的位置信息,那么就应该在layout方法完成后调用getLeft()、getTop()等方法来取得最终宽高,如果是在此之前调用相应的方法,只能得到0的结果,所以一般我们是在onLayout方法中获取View的宽高信息。

在DecorView中,并没有发现onLayout方法,所以它使用的肯定是其父类FrameLayout中的,找到FrameLayout的源码,可以查看到onLayout方法,具体如下:

在设置ViewGroup自身的位置完成后,我们看到会接着调用②号方法,即onLayout()方法,该方法在ViewGroup中调用,用于确定子View的位置,即在该方法内部,子View会调用自身的layout方法来进一步完成自身的布局流程。由于不同的布局容器的onMeasure方法均有不同的实现,因此不可能对所有布局方式都说一次,另外上一篇文章是用FrameLayout#onMeasure进行讲解的,那么现在也对FrameLayout#onLayout方法进行讲解:

  @Override
    protected void onLayout(boolean changed, int left, int top, int right, int bottom) {
        layoutChildren(left, top, right, bottom, false /* no force left gravity */);
    }

    void layoutChildren(int left, int top, int right, int bottom,
                                  boolean forceLeftGravity) {
        final int count = getChildCount();

        final int parentLeft = getPaddingLeftWithForeground();
        final int parentRight = right - left - getPaddingRightWithForeground();

        final int parentTop = getPaddingTopWithForeground();
        final int parentBottom = bottom - top - getPaddingBottomWithForeground();

        mForegroundBoundsChanged = true;

        for (int i = 0; i < count; i++) {
            final View child = getChildAt(i);
            if (child.getVisibility() != GONE) {
                final LayoutParams lp = (LayoutParams) child.getLayoutParams();

                final int width = child.getMeasuredWidth();
                final int height = child.getMeasuredHeight();

                int childLeft;
                int childTop;

                int gravity = lp.gravity;
                if (gravity == -1) {
                    gravity = DEFAULT_CHILD_GRAVITY;
                }

                final int layoutDirection = getLayoutDirection();
                final int absoluteGravity = Gravity.getAbsoluteGravity(gravity, layoutDirection);
                final int verticalGravity = gravity & Gravity.VERTICAL_GRAVITY_MASK;

                switch (absoluteGravity & Gravity.HORIZONTAL_GRAVITY_MASK) {
                    case Gravity.CENTER_HORIZONTAL:
                        childLeft = parentLeft + (parentRight - parentLeft - width) / 2 +
                        lp.leftMargin - lp.rightMargin;
                        break;
                    case Gravity.RIGHT:
                        if (!forceLeftGravity) {
                            childLeft = parentRight - width - lp.rightMargin;
                            break;
                        }
                    case Gravity.LEFT:
                    default:
                        childLeft = parentLeft + lp.leftMargin;
                }

                switch (verticalGravity) {
                    case Gravity.TOP:
                        childTop = parentTop + lp.topMargin;
                        break;
                    case Gravity.CENTER_VERTICAL:
                        childTop = parentTop + (parentBottom - parentTop - height) / 2 +
                        lp.topMargin - lp.bottomMargin;
                        break;
                    case Gravity.BOTTOM:
                        childTop = parentBottom - height - lp.bottomMargin;
                        break;
                    default:
                        childTop = parentTop + lp.topMargin;
                }

                child.layout(childLeft, childTop, childLeft + width, childTop + height);
            }
        }
    }
@Overrideprotected void onLayout(boolean changed, int left, int top, int right, int bottom) { //把父容器的位置参数传递进去 layoutChildren(left, top, right, bottom, false /* no force left gravity */);}void layoutChildren(int left, int top, int right, int bottom, boolean forceLeftGravity) { final int count = getChildCount(); //以下四个值会影响到子View的布局参数 //parentLeft由父容器的padding和Foreground决定 final int parentLeft = getPaddingLeftWithForeground(); //parentRight由父容器的width和padding和Foreground决定 final int parentRight = right - left - getPaddingRightWithForeground(); final int parentTop = getPaddingTopWithForeground(); final int parentBottom = bottom - top - getPaddingBottomWithForeground(); for (int i = 0; i < count; i++) { final View child = getChildAt; if (child.getVisibility() != GONE) { final LayoutParams lp = (LayoutParams) child.getLayoutParams(); //获取子View的测量宽高 final int width = child.getMeasuredWidth(); final int height = child.getMeasuredHeight(); int childLeft; int childTop; int gravity = lp.gravity; if (gravity == -1) { gravity = DEFAULT_CHILD_GRAVITY; } final int layoutDirection = getLayoutDirection(); final int absoluteGravity = Gravity.getAbsoluteGravity(gravity, layoutDirection); final int verticalGravity = gravity & Gravity.VERTICAL_GRAVITY_MASK; //当子View设置了水平方向的layout_gravity属性时,根据不同的属性设置不同的childLeft //childLeft表示子View的 左上角坐标X值 switch (absoluteGravity & Gravity.HORIZONTAL_GRAVITY_MASK) { /* 水平居中,由于子View要在水平中间的位置显示,因此,要先计算出以下: * (parentRight - parentLeft -width)/2 此时得出的是父容器减去子View宽度后的 * 剩余空间的一半,那么再加上parentLeft后,就是子View初始左上角横坐标(此时正好位于中间位置), * 假如子View还受到margin约束,由于leftMargin使子View右偏而rightMargin使子View左偏,所以最后 * 是 +leftMargin -rightMargin . */ case Gravity.CENTER_HORIZONTAL: childLeft = parentLeft + (parentRight - parentLeft - width) / 2 + lp.leftMargin - lp.rightMargin; break; //水平居右,子View左上角横坐标等于 parentRight 减去子View的测量宽度 减去 margin case Gravity.RIGHT: if (!forceLeftGravity) { childLeft = parentRight - width - lp.rightMargin; break; } //如果没设置水平方向的layout_gravity,那么它默认是水平居左 //水平居左,子View的左上角横坐标等于 parentLeft 加上子View的magin值 case Gravity.LEFT: default: childLeft = parentLeft + lp.leftMargin; } //当子View设置了竖直方向的layout_gravity时,根据不同的属性设置同的childTop //childTop表示子View的 左上角坐标的Y值 //分析方法同上 switch (verticalGravity) { case Gravity.TOP: childTop = parentTop + lp.topMargin; break; case Gravity.CENTER_VERTICAL: childTop = parentTop + (parentBottom - parentTop - height) / 2 + lp.topMargin - lp.bottomMargin; break; case Gravity.BOTTOM: childTop = parentBottom - height - lp.bottomMargin; break; default: childTop = parentTop + lp.topMargin; } //对子元素进行布局,左上角坐标为(childLeft,childTop),右下角坐标为(childLeft+width,childTop+height) child.layout(childLeft, childTop, childLeft + width, childTop + height); } }}

从方法中,我们可以看出在Framelayout中最终调用了layoutChildren方法,在该方法中根据测量结果和一些布局属性对容器中每一个View都调用了layout方法进行了布局。根据以上的代码分析,我们可以得出View布局定位的流程图如下。

由源码看出,onLayout方法内部直接调用了layoutChildren方法,而layoutChildren则是具体的实现。先梳理一下以上逻辑:首先先获取父容器的padding值,然后遍历其每一个子View,根据子View的layout_gravity属性、子View的测量宽高、父容器的padding值、来确定子View的布局参数,然后调用child.layout方法,把布局流程从父容器传递到子元素。

澳门新葡萄京官网注册 2

那么,现在就分析完了ViewGroup的布局流程,那么我们接着分析子元素的布局流程。

子View的布局流程也很简单,如果子View是一个ViewGroup,那么就会重复以上步骤,如果是一个View,那么会直接调用View#layout方法,根据以上分析,在该方法内部会设置view的四个布局参数,接着调用onLayout方法,我们看看View#onLayout方法:

protected void onLayout(boolean changed, int left, int top, int right, int bottom) {}

这是一个空实现,主要作用是在我们的自定义View中重写该方法,实现自定义的布局逻辑。

那么到目前为止,View的布局流程就已经全部分析完了。可以看出,布局流程的逻辑相比测量流程来说,简单许多,获取一个View的测量宽高是比较复杂的,而布局流程则是根据已经获得的测量宽高进而确定一个View的四个位置参数。在下一篇文章,将会讲述最后一个流程:绘制流程。希望这篇文章给大家对View的工作流程的理解带来帮助,谢谢阅读。

更多阅读Android View 测量流程完全解析Android View 绘制流程 完全解析

发表评论

电子邮件地址不会被公开。 必填项已用*标注