自定义view快速入门-－基础概念

　　对于自定义view一直都处于模模糊糊的状态，在这短暂的寒假里，索性买了《Android开发艺术探索》和《Android群英传》，沉下心来，吃透自定义。

三种自定义view的方式

 1. 扩张现有的view，即继承现有的view，添加新的功能。 2. 自定义viewgroup，将现有的view集成起来，并添加一些新的属性或者功能。 3. 继承view 这个基类，属于创造一个新的控件的过程。

自定义view时，重写的方法

 1. onMeasure()                   测量view的大小 2. onDraw()                      绘制图形，文字等 3. onLayout()                    确定view的位置 4. onTouchEvent()                处理各种事件

以下为四个方法的参数详解

onMeasure()

先上代码，随便浏览一下，有个大概的印象就行。（以下代码可以当作模版代码，再次使用时，基本不用修改）

    @Override    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {        super.onMeasure(widthMeasureSpec, heightMeasureSpec);        int widthSpecMode = MeasureSpec.getMode(widthMeasureSpec);        int widthSpecSize = MeasureSpec.getSize(widthMeasureSpec);        int widthResult = 0;        int heightSpecMode = MeasureSpec.getMode(heightMeasureSpec);        int heightSpecSize = MeasureSpec.getSize(heightMeasureSpec);        int heightResult = 0;        if (widthSpecMode == MeasureSpec.EXACTLY) {            widthResult = widthSpecSize;        } else {            widthResult = 200;            if (widthSpecMode == MeasureSpec.AT_MOST) {                widthResult = Math.min(widthResult, widthSpecSize);            }        }        if (heightSpecMode == MeasureSpec.EXACTLY) {            heightResult = heightSpecSize;        } else {            heightResult = 200;            if (widthSpecMode == MeasureSpec.AT_MOST) {                heightResult = Math.min(heightResult, heightSpecSize);            }        }        setMeasuredDimension(widthResult, heightResult);    }

MeasureSpec是一个32位的int值，它的高2位代表测量模式，剩下的代表测量的数值。通常情况下我们为了表示两个信息，一般会用两个变量分别来表示，这里为了减少内存的消耗，将他们合并成一个对象。当然，系统也给出了相应的解析方法，如下面的代码：

MeasureSpec.getMode(heightMeasureSpec)  获取测量模式MeasureSpec.getSize(heightMeasureSpec)  获取测量数值

说了那么多次测量模式，那么测量模式是什么鬼呢？
进入MeasureSpec类查看，可以看到如下三种模式：

1. EXACTLY
2. AT_MOST
3. UNSPECIFIED

如果你英语还行的话，可以大概猜出意思来。（前面部分为直接翻译，后面部分为解释）

1. 精确模式，你在xml中设置参数是多少，就会获取响应的值。
2. 尽可能多，在父类容器允许的情况下，尽可能多

3. 不确切的，父容器不对view进行限制，要多大就有多大，一般很少用。

   关于这三个测量模式的具体讲解将在下一篇中解释，这里先有个基础的了解。

onDraw()

先上代码，有个基本印象：

    @Override    protected void onDraw(Canvas canvas) {        super.onDraw(canvas);        mWidth = getWidth();        mHeight = getHeight();        canvas.drawCircle(mWidth / 2, mHeight / 2, mWidth / 2, mPaint);        invalidate();    }

Canvas 画布，所有的图像信息都上在Canvas中显示的。

小知识：invalidate()与postInvalidate()的区别
invalidate()用于刷新UI，在 main thread 中使用，即UI线程
postInvalidate() 用于刷新UI，但是它在 worker thread 中使用，即非UI线程

onLayout()

上代码

    @Override    protected void onLayout(boolean changed, int l, int t, int r, int b) {    }

lef,top,right,bottom, 左，上，右，底，
onLayout() 一般在自定义viewgroup的时候才要用到， 为了确定子view的位置。

onTouchEvent()

上代码：

    @Override    public boolean onTouchEvent(MotionEvent event) {        switch (event.getAction()) {            case MotionEvent.ACTION_DOWN:                mLastX = (int) event.getX();                mLastY = (int) event.getY();                break;            case MotionEvent.ACTION_MOVE:                LinearLayout.LayoutParams params = (LinearLayout.LayoutParams)getLayoutParams();                params.leftMargin = getLeft() + dx;                params.topMargin = getTop() + dy;                setLayoutParams(params);                break;            case MotionEvent.ACTION_UP:                break;        }        invalidate();        return true;    }

MotionEvent中封装了一些常量，它定义了触控事件的类型。常见的有如下：

1. MotionEvent.ACTION_DOWN
2. MotionEvent.ACTION_MOVE
3. MotionEvent.ACTION_UP

分别是 1，手指按下屏幕 2，在屏幕中移动 3，手指抬起　　三个动作。
view自身提供一下方法，都是view相对于父容器来获取的。

getLeft() 获取view到父容器左边的距离

getRight() 获取view到父容器右边的距离

getTop() 获取view到父容器上边的距离

getBottom() 获取view到父容器底部的距离

MotionEvent提供以下方法，都是触控点相对于view来获取的

getX() 获取触控点到view左边的距离

getY()

getRawX() 获取触控点到屏幕左边的距离

getRawY()

小实例

基础概念如是，下面来一个简单的例子，体验一下自定义。
需求描述：自定义一个字符串属性，设置该属性之后，将字符串显示在view中，添加点击事件，点击之后改变字符串，变成一个随机数。

1. 首先我们在继承Textview的基础上进行自定义，新的View命名为AddTextView。然后，在valus目录下新建attrs.xml，里面的内容如下：

<?xml version="1.0" encoding="utf-8"?><resources>    <declare-styleable name="MyString">        <attr name="myTitle" format="string"/>    </declare-styleable></resources>

声明styleable，name属性为MyString，name属性为后期调用这个styleable而准备，有点像id的作用。
声明attr标签，name属性为myTitle，格式format为字符串，myTitle为后期在xml中调用的属性名，例如：TextView中的text属性，format为字符串或者引用资源。
2. 在view的两个参数的构造方法中获取xml中声明的属性值，因为默认是通过两个参数的构造方法获取的：

    public AddTextView(Context context, AttributeSet attrs) {        super(context, attrs);        num= 0;        translateNum=0;        TypedArray ta = context.obtainStyledAttributes(attrs, R.styleable.MyString);        mTitle = ta.getString(R.styleable.MyString_myTitle);        setText(mTitle);        setOnClickListener(new OnClickListener() {            @Override            public void onClick(View v) {                int num = (int) (Math.random()*10);                setText(String.valueOf(num));            }        });    }

TypedArray 用于保存从xml中获取到的属性数组，R.styleable.MyString则为第一步中声明的styleable，这里通过name获取到相应的数据。

那么，整个AddTextView的代码是这样的：

import android.content.Context;import android.content.res.TypedArray;import android.graphics.LinearGradient;import android.os.Handler;import android.util.AttributeSet;import android.view.MotionEvent;import android.view.View;import android.widget.TextView;/** * Created by zone on 2017/1/22. */public class AddTextView extends TextView {    private String mTitle;    public AddTextView(Context context) {        super(context);    }    public AddTextView(Context context, AttributeSet attrs) {        super(context, attrs);        TypedArray ta = context.obtainStyledAttributes(attrs, R.styleable.MyString);        mTitle = ta.getString(R.styleable.MyString_myTitle);        setText(mTitle);        setOnClickListener(new OnClickListener() {            @Override            public void onClick(View v) {                int num = (int) (Math.random()*10);                setText(String.valueOf(num));            }        });    }    public AddTextView(Context context, AttributeSet attrs, int defStyleAttr) {        super(context, attrs, defStyleAttr);    }}

<?xml version="1.0" encoding="utf-8"?><LinearLayout    xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:custom="http://schemas.android.com/apk/res-auto"    xmlns:tools="http://schemas.android.com/tools"    android:id="@+id/activity_main"    android:layout_width="match_parent"    android:layout_height="match_parent"    android:orientation="vertical"    tools:context="com.zone.custonview.MainActivity">    <com.zone.custonview.AddTextView        android:id="@+id/mytextview"        android:layout_width="120px"        android:layout_height="120px"        android:layout_below="@+id/topbar"        android:gravity="center"        android:textSize="20dp"        android:background="@color/colorAccent"        custom:myTitle="111111111111111"/></LinearLayout>

运行起来的效果是这样的：

自定义view初体验，做到这里算是踏出一小步了。