Android知識架構 · 電話面試 · View的繪製流程

阿新 • • 發佈：2019-01-06

View的繪製流程：OnMeasure()——>OnLayout()——>OnDraw()

各步驟的主要工作：

OnMeasure()：測量檢視大小。從頂層父View到子View遞迴呼叫measure方法，measure方法又回撥OnMeasure。
OnLayout()：確定View位置，進行頁面佈局。從頂層父View向子View的遞迴呼叫view.layout方法的過程，即父View根據上一步measure子View所得到的佈局大小和佈局引數，將子View放在合適的位置上。
OnDraw()：繪製檢視。ViewRoot建立一個Canvas物件，然後呼叫OnDraw()。六個步驟：①、繪製檢視的背景；②、儲存畫布的圖層（Layer）；③、繪製View的內容；④、繪製View子檢視，如果沒有就不用；⑤、還原圖層（Layer）；⑥、繪製滾動條。

OnMeasure

View樹的繪製是從ViewRoot的performTraversals()方法開始，這個方法的主要作用是判斷是否重新measure、是否重新layout、是否重新draw。

    private void performTraversals() {
        ......
        int childWidthMeasureSpec = getRootMeasureSpec(mWidth, lp.width);
        int childHeightMeasureSpec = getRootMeasureSpec(mHeight, lp.height);
        ......
        mView.measure(childWidthMeasureSpec, childHeightMeasureSpec);
        ......
        mView.layout(0 
, 0, mView.getMeasuredWidth(), mView.getMeasuredHeight());
        ......
        mView.draw(canvas);
        ......
    }

    private int getRootMeasureSpec(int windowSize, int rootDimension) {
        int measureSpec;
        switch (rootDimension) {
            case ViewGroup.LayoutParams.MATCH_PARENT:
                measureSpec = MeasureSpec.makeMeasureSpec(windowSize, MeasureSpec.EXACTLY);
                break 
;
            case ViewGroup.LayoutParams.WRAP_CONTENT:
                measureSpec = MeasureSpec.makeMeasureSpec(windowSize, MeasureSpec.AT_MOST);
                break;
            default:
                measureSpec = MeasureSpec.makeMeasureSpec(rootDimension, MeasureSpec.EXACTLY);
                break;
        }
        return measureSpec;
    } 

    public final void measure(int widthMeasureSpec, int heightMeasureSpec) {
        if ((mPrivateFlags & FORCE_LAYOUT) == FORCE_LAYOUT ||
                widthMeasureSpec != mOldWidthMeasureSpec ||
                heightMeasureSpec != mOldHeightMeasureSpec) {
            mPrivateFlags &= ~MEASURED_DIMENSION_SET;
            if (ViewDebug.TRACE_HIERARCHY) {
                ViewDebug.trace(this, ViewDebug.HierarchyTraceType.ON_MEASURE);
            }
            onMeasure(widthMeasureSpec, heightMeasureSpec);
            if ((mPrivateFlags & MEASURED_DIMENSION_SET) != MEASURED_DIMENSION_SET) {
                throw new IllegalStateException("onMeasure() did not set the"
                        + " measured dimension by calling"
                        + " setMeasuredDimension()");
            }
            mPrivateFlags |= LAYOUT_REQUIRED;
        }
        mOldWidthMeasureSpec = widthMeasureSpec;
        mOldHeightMeasureSpec = heightMeasureSpec;

    //View的onMeasure預設實現方法，設定View的長和寬；如果寫死，則外邊變化時介面不變化
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        setMeasuredDimension(getDefaultSize(getSuggestedMinimumWidth(), widthMeasureSpec),
                getDefaultSize(getSuggestedMinimumHeight(), heightMeasureSpec));
    }

    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;
    }

如果是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);
            }
        }
    }

    protected void measureChild(View child, int parentWidthMeasureSpec,
                                int parentHeightMeasureSpec) {
        final LayoutParams lp = child.getLayoutParams();
        final int childWidthMeasureSpec = getChildMeasureSpec(parentWidthMeasureSpec,
                mPaddingLeft + mPaddingRight, lp.width);
        final int childHeightMeasureSpec = getChildMeasureSpec(parentHeightMeasureSpec,
                mPaddingTop + mPaddingBottom, lp.height);
        child.measure(childWidthMeasureSpec, childHeightMeasureSpec);
    }  

    public static int getChildMeasureSpec(int spec, int padding, int childDimension) {
        int specMode = MeasureSpec.getMode(spec);
        int specSize = MeasureSpec.getSize(spec);
        int size = Math.max(0, specSize - padding);
        int resultSize = 0;
        int resultMode = 0;
        switch (specMode) {
            case MeasureSpec.EXACTLY:
                if (childDimension >= 0) {
                    resultSize = childDimension;
                    resultMode = MeasureSpec.EXACTLY;
                } else if (childDimension == LayoutParams.MATCH_PARENT) {
                    resultSize = size;
                    resultMode = MeasureSpec.EXACTLY;
                } else if (childDimension == LayoutParams.WRAP_CONTENT) {
                    // Child wants to determine its own size. It can't be
                    // bigger than us.
                    resultSize = size;
                    resultMode = MeasureSpec.AT_MOST;
                }
                break;
            ......
        }
        //將mode與size通過MeasureSpec方法整合為32位整數返回
        return MeasureSpec.makeMeasureSpec(resultSize, resultMode);
    }

MeasureSpec 的值由specSize和specMode共同組成的，高2位代表specMode，低30代表spceSize，其中specSize記錄的是大小，specMode記錄的是規格。

specMode一共有三種類型：

EXACTLY
表示父檢視希望子檢視的大小應該是由specSize的值來決定的，系統預設會按照這個規則來設定子檢視的大小，開發人員當然也可以按照自己的意願設定成任意的大小。
AT_MOST
表示子檢視最多隻能是specSize中指定的大小，開發人員應該儘可能小得去設定這個檢視，並且保證不會超過specSize。系統預設會按照這個規則來設定子檢視的大小，開發人員當然也可以按照自己的意願設定成任意的大小。
UNSPECIFIED
表示開發人員可以將檢視按照自己的意願設定成任意的大小，沒有任何限制。這種情況比較少見。

每個View控制元件的實際寬高都是由父檢視和自身決定的。實際的測量是在onMeasure方法進行，所以在View的子類需要重寫onMeasure方法，這是因為measure方法是final的，不允許過載，所以View子類只能通過過載onMeasure來實現自己的測量邏輯。

OnLayout

測量完各個元件的大小之後，就可以排列他們的位置了。

    private void performTraversals() {
        ......
        int childWidthMeasureSpec = getRootMeasureSpec(mWidth, lp.width);
        int childHeightMeasureSpec = getRootMeasureSpec(mHeight, lp.height);
        ......
        mView.measure(childWidthMeasureSpec, childHeightMeasureSpec);
        ......
        mView.layout(0, 0, mView.getMeasuredWidth(), mView.getMeasuredHeight());
        ......
        mView.draw(canvas);
        ......
    }

    public void layout(int l, int t, int r, int b) {
        int oldL = mLeft;
        int oldT = mTop;
        int oldB = mBottom;
        int oldR = mRight;
        boolean changed = setFrame(l, t, r, b);//檢視大小是否發生變化
        if (changed || (mPrivateFlags & LAYOUT_REQUIRED) == LAYOUT_REQUIRED) {
            if (ViewDebug.TRACE_HIERARCHY) {
                ViewDebug.trace(this, ViewDebug.HierarchyTraceType.ON_LAYOUT);
            }
            onLayout(changed, l, t, r, b);
            mPrivateFlags &= ~LAYOUT_REQUIRED;
            if (mOnLayoutChangeListeners != null) {
                ArrayList<OnLayoutChangeListener> listenersCopy =
                        (ArrayList<OnLayoutChangeListener>) 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 &= ~FORCE_LAYOUT;
    }

View中的onLayout()方法就是一個空方法，因為onLayout()過程是為了確定檢視在佈局中所在的位置，而這個操作應該是由佈局來完成的，即父檢視決定子檢視的顯示位置。

@Override  
/**
*ViewGroupd的onLayout方法
*/
protected abstract void onLayout(boolean changed, int l, int t, int r, int b);

然而，ViewGroup中的onLayout()方法是一個抽象方法，這就意味著所有ViewGroup的子類都必須重寫這個方法。自定義ViewGroup控制元件中，onLayout配合onMeasure方法一起使用可以實現自定義View的複雜佈局。自定義View首先呼叫onMeasure進行測量，然後呼叫onLayout方法動態獲取子View和子View的測量大小，然後進行layout佈局。過載onLayout的目的就是安排其children在父View的具體位置，過載onLayout通常做法就是寫一個for迴圈呼叫每一個子檢視的layout(l, t, r, b)函式，傳入不同的引數l, t, r, b來確定每個子檢視在父檢視中的顯示位置。

下面程式碼以LinearLayout舉例：

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 paddingLeft = mPaddingLeft;
        int childTop;
        int childLeft;
        final int width = right - left;
        int childRight = width - mPaddingRight;
        int childSpace = width - paddingLeft - mPaddingRight;
        final int count = getVirtualChildCount();
        final int majorGravity = mGravity & Gravity.VERTICAL_GRAVITY_MASK;
        final int minorGravity = mGravity & Gravity.RELATIVE_HORIZONTAL_GRAVITY_MASK;
        switch (majorGravity) {
            case Gravity.BOTTOM:
                childTop = mPaddingTop + bottom - top - mTotalLength;
                break;
            case Gravity.CENTER_VERTICAL:
                childTop = mPaddingTop + (bottom - top - mTotalLength) / 2;
                break;
            case Gravity.TOP:
            default:
                childTop = mPaddingTop;
                break;
        }
        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();
                int gravity = lp.gravity;
                if (gravity < 0) {
                    gravity = minorGravity;
                }
                final int layoutDirection = getLayoutDirection();
                final int absoluteGravity = Gravity.getAbsoluteGravity(gravity, layoutDirection);
                switch (absoluteGravity & Gravity.HORIZONTAL_GRAVITY_MASK) {
                    case Gravity.CENTER_HORIZONTAL:
                        childLeft = paddingLeft + ((childSpace - childWidth) / 2)
                                + lp.leftMargin - lp.rightMargin;
                        break;
                    case Gravity.RIGHT:
                        childLeft = childRight - childWidth - lp.rightMargin;
                        break;
                    case Gravity.LEFT:
                    default:
                        childLeft = paddingLeft + lp.leftMargin;
                        break;
                }
                if (hasDividerBeforeChildAt(i)) {
                    childTop += mDividerHeight;
                }
                childTop += lp.topMargin;
                setChildFrame(child, childLeft, childTop + getLocationOffset(child),
                        childWidth, childHeight);
                childTop += childHeight + lp.bottomMargin + getNextLocationOffset(child);
                i += getChildrenSkipCount(child, i);
            }
        }
    }

到這裡就不得不提getWidth()、getHeight()和getMeasuredWidth()、getMeasuredHeight()這兩對方法之間的區別（上面分析measure過程已經說過getMeasuredWidth()、getMeasuredHeight()必須在onMeasure之後使用才有效）。可以看出來getWidth()與getHeight()方法必須在layout(int l, int t, int r, int b)執行之後才有效。那我們看下View原始碼中這些方法的實現吧，如下：

     public final int getMeasuredWidth() {
        return mMeasuredWidth & MEASURED_SIZE_MASK;
    }

    public final int getMeasuredHeight() {
        return mMeasuredHeight & MEASURED_SIZE_MASK;
    }

    public final int getWidth() {
        return mRight - mLeft;
    }

    public final int getHeight() {
        return mBottom - mTop;
    }

    public final int getLeft() {
        return mLeft;
    }

    public final int getRight() {
        return mRight;
    }

    public final int getTop() {
        return mTop;
    }

    public final int getBottom() {
        return mBottom;
    }

OnDraw


public void draw(Canvas canvas) {  
    if (ViewDebug.TRACE_HIERARCHY) {  
        ViewDebug.trace(this, ViewDebug.HierarchyTraceType.DRAW);  
    }  
    final int privateFlags = mPrivateFlags;  
    final boolean dirtyOpaque = (privateFlags & DIRTY_MASK) == DIRTY_OPAQUE &&  
            (mAttachInfo == null || !mAttachInfo.mIgnoreDirtyState);  
    mPrivateFlags = (privateFlags & ~DIRTY_MASK) | DRAWN;  
    // Step 1, draw the background, if needed  
    int saveCount;  
    if (!dirtyOpaque) {  
        final Drawable background = mBGDrawable;  
        if (background != null) {  
            final int scrollX = mScrollX;  
            final int scrollY = mScrollY;  
            if (mBackgroundSizeChanged) {  
                background.setBounds(0, 0,  mRight - mLeft, mBottom - mTop);  
                mBackgroundSizeChanged = false;  
            }  
            if ((scrollX | scrollY) == 0) {  
                background.draw(canvas);  
            } else {  
                canvas.translate(scrollX, scrollY);  
                background.draw(canvas);  
                canvas.translate(-scrollX, -scrollY);  
            }  
        }  
    }  
    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);  
        // Step 6, draw decorations (scrollbars)  
        onDrawScrollBars(canvas);  
        // we're done...  
        return;  
    }  
}

6個步驟在開始部分已經介紹。

Android知識架構 · 電話面試 · View的繪製流程

OnMeasure

OnLayout

OnDraw

View的invalidate和postInvalidate方法原始碼分析

Android知識架構 · 電話面試 · View的繪製流程

Android知識架構 · 電話面試 · Android執行緒和程序以及安全問題

Android系統原始碼分析--View繪製流程之-setContentView

自定義View繪製流程（面試專用）

Android應用層View繪製流程之DecorView與ViewRootImpl

Android GUI之View繪製流程

Android View繪製流程

Android開發——View繪製流程

android-進階（3）-自定義view(2)-Android中View繪製流程以及相關方法的分析

Android中View繪製流程以及invalidate()等相關方法分析

Android View繪製流程原始碼淺析

Android View 繪製流程(Draw) 完全解析

Android View 繪製流程與invalidate 和postInvalidate 分析－－從原始碼角度

Android應用層View繪製流程與原始碼分析

Android View繪製流程看這篇就夠了

View繪製流程簡述

對View繪製流程的一些理解

ndroid系統原始碼分析--View繪製流程之-inflate

Android知識架構 · Java的程式設計思想上

Android知識體系總結(全方面覆蓋Android知識結構，面試&進階)

Android知識架構 · 電話面試 · View的繪製流程

OnMeasure

OnLayout

OnDraw

View的invalidate和postInvalidate方法原始碼分析

相關推薦