Android自定义View——绘制一个会动的时钟

一、效果图

二、整体思路以及流程

时钟可以分为几个独立的部分：

• 外圆—— 时钟的外环圆
• 刻度—— 包括刻度线和刻度值
• 指针—— 包括时针、分针、秒针

按照绘制的流程也可以按照外圆、刻度、指针这样由外到内的顺序绘制。

Step1: 绘制外圆

这是最简单的一步。只需要指定半径、圆心坐标之后即可绘制外圆。

Step2:绘制刻度以及刻度值

一般来说，时钟都是12小时制的，因此一般总共有60条刻度线（包括整点刻度、和非整点刻度）。计算每一条刻度线的首尾坐标，从正午12点刻度开始，每5个刻度线绘制时刻度以及刻度值（即12小时制的值），其余绘制分刻度。

小技巧：绘制刻度线的时候，由于Android系统采用的坐标系原点为视图的左上角，这样使得计算每个刻度线的首尾坐标变得复杂。但如果每一次绘制完一个刻度线就将坐标系旋转刻度间夹角度数的话，那么每一次绘制都等于在坐标轴上进行，那么就会使得坐标的计算及其简化，绘制过程变得简单。

Step3:绘制指针
绘制时针比较繁琐一些。首先，考虑Android坐标系原点在左上角的原因，计算时针的坐标相对麻烦，因此需要将坐标系原点平移到圆心，简化计算；其次，秒针、分针、时针的指向的角度（相对于12点）确定牵扯到进位的问题；再次，需要将相对于12点的角度转换然为相对于Android坐标系X轴的角度，然后，计算指针坐标；最后，画线。

下面列出各个步骤：
（1）将坐标原点平移到圆心。

（2）计算时针、分针、秒针偏移角（相对于12点，数学直角坐标系中的y轴）。首先，需要计算出秒针的偏移量（此处以后的偏移量是相对于正午12点来说的）；其次，计算分针偏移量（考虑到秒针偏移量）；最后，计算时针偏移量（考虑到分针偏移量）。

（3）将坐标系逆时针旋转90度，计算得到相对于Android坐标系X轴的偏移角（这样过后Android坐标系的X、Y轴相当于原数学直角坐标系的Y、X轴，两轴替换）。

（4）计算秒针、分针、时针的首尾坐标。

（5）绘制指针。

三、ShowYouMyCode

/**
 * Created by David on 2017/1/14.
 */

public class ClockView extends View {
   
    private Date time;
    private float centerX, centerY, radius;//圆心坐标以及半径
    private float width, height; //视图宽高
    private float lengthOfHourScale; // 时刻度线长度
    private float lengthOfMinuteScale; // 分刻度线长度
    private float lengthOfHourHand;  // 时针长度
    private float lengthOfMinuteHand;  // 分针长度
    private float lengthOfSecondHand;  // 秒针长度
    /**
     * 各种画笔
     */
    private Paint paintCircle, paintScaleHour, paintScaleMinute, paintHourHand, paintSecondHand, paintMinuteHand;
    private boolean is24HourSystem; // 小时制（24、12）
    private int currentHour;
    private int currentMinute;

    public ClockView(Context context) {
        super(context);
        initView(context);
    }

    public ClockView(Context context, AttributeSet attrs) {
        super(context, attrs);
        initView(context);
    }

    publ