自定义View--（1）基础/measure/layout/draw

Android：一篇文章带你完全梳理自定义View工作流程！

基础

0. setContentView

// PhoneWindow
Window.setContentView(layoutId);

// 1. 设置DecorView
// 2. 设置contentParent（用来放置activity的布局layoutId）
// 会决定使用哪种window布局（R.layout.screen_title，R.layout.screen_simple等， 布局中存在android:id="@android:id/content"）
// 3. 使用contentParent的"@android:id/content"来加载activity的布局

1. View的构造方法

自定义View的4个构造方法：

// 如果View是在Java代码里面new的，则调用第一个构造函数
public TextView(Context context) {
    this(context, null);
}

// 如果View是在.xml里声明的，则调用第二个构造函数
// 自定义属性是从AttributeSet参数传进来的
public TextView(Context context, @Nullable AttributeSet attrs) {
    this(context, attrs, com.android.internal.R.attr.textViewStyle);
}

// 不会自动调用，一般是在第二个构造函数里主动调用
// 如View有style属性时
public TextView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
    this(context, attrs, defStyleAttr, 0);
}

//API21之后才使用
// 不会自动调用， 一般是在第二个构造函数里主动调用
// 如View有style属性时
public TextView(
        Context context, @Nullable AttributeSet attrs, int defStyleAttr, int defStyleRes) {
    super(context, attrs, defStyleAttr, defStyleRes);
    TypedArray a = theme.obtainStyledAttributes(attrs,
                com.android.internal.R.styleable.TextViewAppearance, defStyleAttr, defStyleRes);
}

属性值定义的优先级：xml > style > Theme中的默认Sytle > 默认Style（通过obtainStyledAttributes的第四个参数指定）> 在Theme中直接指定属性值。
详见：Android中自定义样式与View的构造函数中的第三个参数defStyle的意义

无论是measure过程、layout过程还是draw过程，永远都是从View树的根节点开始测量或计算（即从树的顶端开始），一层一层、一个分支一个分支地进行（即树形递归），最终计算整个View树中各个View，最终确定整个View树的相关属性。

2. Android坐标系

View的位置是通过view.getxxx()函数进行获取

// 获取Top位置
public final int getTop() {  
    return mTop;  
}  
// 其余如下：
  getLeft();      //获取子View左上角距父View左侧的距离
  getBottom();    //获取子View右下角距父View顶部的距离
  getRight();     //获取子View右下角距父View左侧的距离

MotionEvent中 get()和getRaw()的区别：

//get() ：触摸点相对于其所在组件坐标系的坐标
 event.getX();       
 event.getY();

//getRaw() ：触摸点相对于屏幕默认坐标系的坐标
 event.getRawX();    
 event.getRawY();

3. 角度（angle）& 弧度（radian）

在默认的屏幕坐标系中角度增大方向为顺时针。

注：在常见的数学坐标系中角度增大方向为逆时针

4. 颜色相关

ARGB：

属性	取值范围 0(0x00)~255(0xff)
A	透明 ~ 不透明
R	无色 ~ 红色
G	无色 ~ 绿色
B	无色 ~ 蓝色

取色工具
取色工具我强推Markman：一款设计师用于标注的工具，主要用于尺寸标注、字体大小标注、颜色标注，而且使用简单。本人强烈推荐！

Measure过程

1. 作用

测量View的宽 / 高。

• 在某些情况下，需要多次测量（measure）才能确定View最终的宽/高；
• 该情况下，measure过程后得到的宽 / 高可能不准确；
• 此处建议：在layout过程中onLayout()去获取最终的宽 / 高。

2. 储备知识

MeasureSpec （View的内部类MeasureSpec）
测量规格（MeasureSpec） = 测量模式（mode） + 测量大小（size）

测量模式（Mode）的类型有3种：UNSPECIFIED、EXACTLY 和
AT_MOST。具体如下：

/**
  * MeasureSpec类的具体使用
  **/
    // 1. 获取测量模式（Mode）
    int specMode = MeasureSpec.getMode(measureSpec)

    // 2. 获取测量大小（Size）
    int specSize = MeasureSpec.getSize(measureSpec)

    // 3. 通过Mode 和 Size 生成新的SpecMode
    int measureSpec=MeasureSpec.makeMeasureSpec(size, mode);

子View的MeasureSpec值根据子View的布局参数（LayoutParams）和父容器的MeasureSpec值计算得来的，具体计算逻辑封装在getChildMeasureSpec()里。
对于普通View：

3. measure过程详解

3.1 单一View的measure过程

	// 入口方法
	// View.java， final修饰，子类不可重写
    public final void measure(int widthMeasureSpec, int heightMeasureSpec) {
    	....
    	onMeasure(widthMeasureSpec, heightMeasureSpec);
    	......
    }

3.2 ViewGroup的measure过程

原理：

1. 遍历 测量所有子View的尺寸；（自上而下）
2. 合并将所有子View的尺寸进行，最终得到ViewGroup父视图的测量值。
   

Layout过程

1. 作用

计算视图（View）的位置，即计算View的四个顶点位置：Left、Top、Right 和 Bottom。

2. layout过程详解

2.1 单一View的layout过程

2.2 ViewGroup的layout过程

3. 细节问题：getWidth/getMeasuredWidth

getWidth() （ getHeight()）与 getMeasuredWidth() （getMeasuredHeight()）获取的宽 （高）有什么区别？

首先明确定义：

• getWidth() / getHeight()：获得View最终的宽 / 高
• getMeasuredWidth() / getMeasuredHeight()：获得 View测量的宽 / 高
  
  上面标红：一般情况下，二者获取的宽 / 高是相等的。那么，“非一般”情况是什么？
  答：人为设置：通过重写View的 layout（）强行设置。

@Override
public void layout( int l , int t, int r , int b){
   // 改变传入的顶点位置参数
   // 如此一来，在任何情况下，getWidth() / getHeight()获得的宽/高 总比 getMeasuredWidth() / getMeasuredHeight()获取的宽/高大100px
   // 即：View的最终宽/高 总比 测量宽/高 大100px
   super.layout(l，t，r+100，b+100)；
}

结论：在非人为设置的情况下，View的最终宽/高（getWidth() / getHeight()）
与 View的测量宽/高 （getMeasuredWidth() / getMeasuredHeight()）永远是相等。

#getMeasuredWidth在measure之后可以调用；#getWidth在layout之后可以调用。
除了#onLayout方法中采用#getMeasuredWidth方法外在其之外的其他地方一般采用getWidth方法来获取控件的宽度。

Draw过程

1. draw过程详解

1.1 单一View的draw过程

步骤：

1. View绘制自身（含背景、内容）；
2. 绘制装饰（滚动指示器、滚动条、和前景）。
   

// 以下源码为API-30， 与上图中的方法有差别
public void draw(Canvas canvas) {
    // Step 1, draw the background, if needed
    drawBackground(canvas);

    // Step 2, draw the content
    onDraw(canvas);

    // Step 3, draw the children
    dispatchDraw(canvas);
    drawAutofilledHighlight(canvas);

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

    // Step 5, draw the default focus highlight
    drawDefaultFocusHighlight(canvas);
    if (isShowingLayoutBounds()) {
        debugDrawFocus(canvas);
    }
}

1.2 ViewGroup的draw过程

步骤：

1. 绘制自身（含背景、内容）；
2. 遍历子View & 绘制其所有子View；
3. 绘制装饰（滚动指示器、滚动条、和前景）。

参考：
自定义View-Carson_Ho