1. 根据Android Developers官网的介绍,自定义控件你需要以下的步骤:

(1)创建View

(2)处理View的布局

(3)绘制View

(4)与用户进行交互

(5)优化已定义的View

上面列出的五项就是android官方给出的自定义控件的步骤。

每个步骤里面又包括了很多细小的知识点。

我们可以记住这五个点,并且了解每个点里包含的小知识点。再加上一些自定义控件的练习。不断的将这些知识熟练于心,相信我们每个人都能够定义出优秀的自定义控件。接下来我们开始对上面列出的5个要点进行细化解说


2. 自定义控件之 创建View:

(1)继承View:

对Android有一些了解的朋友都知道,Android为我们提供的很多View都是继承与View的。所以我们自定义的View当然也是继承于View,当然如果你要自定义的View拥有某些Android已经提供的控件的功能,你可以直接继承于已经提供的控件。


1 class PieChart extends View {//继承View 2  3     public PieChart(Context context, AttributeSet attrs) { 4         super(context, attrs); 5     }//为了支持.xml中进行创建和编辑 6 }


使用AttributeSet来完成控件类的构造函数,并在构造函数中将自定义控件类中变量attrs.xml中的属性连接起来。


(2)自定义属性:

大部分情况我们的自定义View需要有更多的灵活性,比如我们在xml中指定了颜色大小等属性,在程序运行时候控件就能展示出相应的颜色和大小。

所以我们需要自定义属性。

自定义属性通常写在在res/values/attrs.xml文件中 下面是自定义属性的标准写法:


1 <declare-styleable name="PieChart"> 2        <attr name="showText" format="boolean" /> 3        <attr name="labelPosition" format="enum"> 4            <enum name="left" value="0"/> 5            <enum name="right" value="1"/> 6        </attr> 7 </declare-styleable>


这段代码声明了两个自定义属性,showText和labelPosition,它们都是属于styleable PieChart的,为了方便,一般styleable的name和我们自定义控件的类名一样。自定义控件定义好了之后就是使用了。

使用代码示例:


1 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 2    xmlns:custom="http://schemas.android.com/apk/res/com.example.customviews"> 3  <com.example.customviews.charting.PieChart 4      custom:showText="true" 5      custom:labelPosition="left" /> 6 LinearLayout>


如果你是在eclipse,使用自定义属性的时候需要指定命名空间,固定写法就是​​http://schemas.android.com/apk/res/​你的包名

如果你是在android studio,也可以用​​http://schemas.android.com/apk/res/res-auto​


(3)获取自定义属性:

在xml中设置了控件自定义属性,我们就需要拿到属性做一些事情。否则定义自定义属性就没有意义了。

固定的获取自定义属性代码如下:


1 public PieChart(Context context, AttributeSet attrs) {  2    super(context, attrs);  3    TypedArray a = context.getTheme().obtainStyledAttributes(  4         attrs,  5         R.styleable.PieChart,  6         0, 0);  7   8    try {  9        mShowText = a.getBoolean(R.styleable.PieChart_showText, false); 10        mTextPos = a.getInteger(R.styleable.PieChart_labelPosition, 0); 11    } finally { 12        a.recycle(); 13    } 14 }


当我们在xml中创建了一个view时,所有在xml中声明的属性都会被传入到view的构造方法中的AttributeSet类型的参数当中。

通过调用Context的obtainStyledAttributes()方法返回一个TypedArray对象。然后直接用TypedArray对象获取自定义属性的值。

由于TypedArray对象是共享的资源,所以在获取完值之后必须要调用recycle()方法来回收。


(4)添加设置属性事件:

在xml中指定的自定义属性只有在view被初始化的时候能够获取到,有时候我们可能在运行时做一些操作,这种情况就需要我们为自定义属性设置getter和setter方法,以下代码展示了自定义控件暴露的set 和get方法:


1 public boolean isShowText() { 2    return mShowText; 3 } 4  5 public void setShowText(boolean showText) { 6    mShowText = showText; 7    invalidate(); 8    requestLayout(); 9 }


重点看setShowText方法,在为mShowText赋值之后,调用了invalidate()和requestLayout()方法,我们自定义控件的属性发生改变之后,控件的样子也可能发生改变,在这种情况下就需要调用invalidate()方法让系统去调用view的onDraw()重新绘制。同样的,控件属性的改变可能导致控件所占的大小和形状发生改变,所以我们需要调用requestLayout()来请求测量获取一个新的布局位置。



3. 自定义控件之 处理View的布局:

(1)测量:

一个View是在展示时总是有它的宽和高,测量View就是为了能够让自定义的控件能够根据各种不同的情况以合适的宽高去展示。提到测量就必须要提到onMeasure方法了。onMeasure方法是一个view确定它的宽高的地方。


1 @Override 2     protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) { 3  4     }


onMeasure方法里有两个重要的参数, widthMeasureSpec, heightMeasureSpec。在这里你只需要记住它们包含了两个信息:mode 和 size

我们可以通过以下代码拿到mode和size:


1 int specMode = MeasureSpec.getMode(measureSpec); 2 int specSize = MeasureSpec.getSize(measureSpec);



那么获取到的mode和size又代表了什么呢?

mode代表了我们当前控件的父控件告诉我们控件,你应该按怎样的方式来布局。

mode有三个可选值:EXACTLY, AT_MOST,UNSPECIFIED。它们的含义是:

EXACTLY:父控件告诉我们子控件了一个确定的大小,你就按这个大小来布局。比如我们指定了确定的dp值和macth_parent的情况。

AT_MOST:当前控件不能超过一个固定的最大值,一般是wrap_content的情况。

UNSPECIFIED:当前控件没有限制,要多大就有多大,这种情况很少出现。

size其实就是父布局传递过来的一个大小,父布局希望当前布局的大小。

下面是一个重写onMeasure的固定伪代码写法:


1 if mode is EXACTLY{ 2      父布局已经告诉了我们当前布局应该是多大的宽高, 所以我们直接返回从measureSpec中获取到的size  3 }else{ 4      计算出希望的desiredSize 5      if mode is AT_MOST 6           返回desireSize和specSize当中的最小值 7      else: 8           返回计算出的desireSize 9 }


上面的代码虽然基本都是固定的,但是需要写的步骤还是有点多,如果你不想自己写,你也可以用android为我们提供的工具方法:resolveSizeAndState,该方法需要传入两个参数:我们测量的大小和父布局希望的大小,它会返回根据各种情况返回正确的大小。这样我们就可以不需要实现上面的模版,只需要计算出想要的大小然后调用resolveSizeAndState。之后在做自定义View的时候我会展示用这个方法来确定view的大小。

计算出height和width之后在onMeasure中别忘记调用setMeasuredDimension()方法。否则会出现运行时异常。


(2)计算一些自定义控件需要onSizeChange():

onSizeChange() 方法在view第一次被指定了大小值、或者view的大小发生改变时会被调用。所以一般用来计算一些位置和与view的size有关的值。



4. 自定义控件之 绘制View(Draw):

 一旦自定义控件被创建并且测量代码写好之后,接下来你就可以实现onDraw()来绘制View了,onDraw方法包含了一个Canvas叫做画布的参数,onDraw()简单来说就两点:

    Canvas决定要去画什么

    Paint决定怎么画

比如,Canvas提供了画线方法,Paint就来决定线的颜色。Canvas提供了画矩形,Paint又可以决定让矩形是空心还是实心。

在onDraw方法中开始绘制之前,你应该让画笔Paint对象的信息初始化完毕。这是因为View的重新绘制是比较频繁的,这就可能多次调用onDraw,所以初始化的代码不应该放在onDraw方法里。Canvas和Paint提供的很多方法在本文中就不一一列举了。大家可以自己去查看api,之后的文章中我们也会用到,现在你只需要理解定义的大体步骤,然后再慢慢锻炼加深理解。


5. 自定义控件之 与用户进行交互:

也许某些情况你的自定义控件不仅仅只是展示一个漂亮的内容,还需要支持用户点击,拖动等等操作,这时候我们的自定义控件就需要做用户交互这一步骤了。

在android系统中最常见的事件就是触摸事件了,它会调用view的onTouchEvent(android.view.MotionEvent),重写这个方法去处理我们的事件逻辑:


1 @Override 2    public boolean onTouchEvent(MotionEvent event) { 3     return super.onTouchEvent(event); 4    }


对与onTouchEvent方法相信大家都有一定了解,如果不了解的话,你就先记住这是处理Touch的地方。

现在的触控有了更多的手势,比如轻点,快速滑动等等,所以在支持特殊用户交互的时候你需要用到android提供的GestureDetector.你只需要实现GestureDetector中相对应的接口,并且处理相应的回调方法。

除了手势之外,如果有移动之类的情况我们还需要让滑动的动画显示得比较平滑。动画应该是平滑的开始和结束,而不是突然消失突然开始。在这种情况下,我们需要用到属性动画 property animation framework

由于与用户进行交互中涉及到的知识举例子会比较多,所以我在之后的自定义控件文章中再讲解。


6. 自定义控件之 优化你的自定义View:

在上面的步骤结束之后,其实一个完善的自定义控件已经出来了。接下来你要做的只是确保自定义控件运行得流畅,官方的说法是:为了避免你的控件看得来迟缓,确保动画始终保持每秒60帧.

下面是官网给出的优化建议:

(1)避免不必要的代码
(2)在onDraw()方法中不应该有会导致垃圾回收的代码。
(3)尽可能少让onDraw()方法调用,大多数onDraw()方法调用都是手动调用了invalidate()的结果,所以如果不是必须,不要调用invalidate()方法。



7. 总结:

到这里基本上自定义控件的大致步骤和可能涉及到的知识点都说完了,看一张图:

自定义控件(视图)2期笔记01:自定义控件之自定义View的步骤_控件

图片基本描述了自定义View的大致流程,右边是相对应的流程所涉及到的一些知识点。可以看到自定义控件包括了很多android知识。所以学习android自定义控件是很有必要的。当你能够轻松的定义出一个完美的自定义控件的时候,相信你已经是大牛了。

本篇文章只对自定义控件的步骤进行了大体的介绍,如果你对自定义的流程还不清楚,请你记住上面所说的步骤,至少也要有个大致的印象。在之后的文章中,我在按照这个步骤去讲解一些自定义控件,用这里列出的步骤去一步步实现我们想要的自定义控件。