Android自定义View之时钟

 

效果（gif效果不是很好）

GitHub地址

https://github.com/zuohp/My_Clock.git

绘制思路

1. 绘制表盘和长短刻度

2. 绘制各个时间点的数字

3. 绘制时针，分针，秒针

4. 让各个指针转起来，根据时间计算角度

开始绘制

1. 定义参数（attrs文件）

    <declare-styleable name="Clock">
        <!--数值-->
        <attr name="mClockRingWidth" format="dimension"/>
        <attr name="mDefaultWidth" format="dimension"/>
        <attr name="mDefaultLength" format="dimension"/>
        <attr name="mSpecialWidth" format="dimension"/>
        <attr name="mSpecialLength" format="dimension"/>
        <attr name="mHWidth" format="dimension"/>
        <attr name="mMWidth" format="dimension"/>
        <attr name="mSWidth" format="dimension"/>
        <!--颜色-->
        <attr name="mCircleColor" format="color"/>
        <attr name="mHColor" format="color"/>
        <attr name="mMColor" format="color"/>
        <attr name="mSColor" format="color"/>
        <attr name="mNumColor" format="color"/>

    </declare-styleable>

2. 继承View，定义参数

//    圆形和刻度的画笔、指针的画笔、数字的画笔
    private Paint mCirclePaint,mPointerPaint,mNumPaint;

//    时钟的外环宽度、时钟的半径、默认刻度的宽度、默认刻度的长度
//    特殊刻度的宽度、特殊刻度的长度、时针的宽度、分针的宽度、秒针的宽度
    private float mClockRingWidth,mClockRadius,mDefaultWidth,mDefaultLength,
                mSpecialWidth,mSpecialLength,mHWidth,mMWidth,mSWidth;

//    圆形和刻度的颜色，时针的颜色，分针的颜色，秒针的颜色，数字的颜色
    private int mCircleColor,mHColor,mMColor,mSColor,mNumColor;

3. 初始化参数以及画笔

    public Clock(Context context, @Nullable AttributeSet attrs) {
        super(context, attrs);
        init(context,attrs);
        initPaint();
        Calendar mCalendar= Calendar.getInstance();
        //获取当前小时数
        int hours = mCalendar.get(Calendar.HOUR);
        //获取当前分钟数
        int minutes = mCalendar.get(Calendar.MINUTE);
        //获取当前秒数
        int seconds=mCalendar.get(Calendar.SECOND);
        setTime(hours,minutes,seconds);
        //开启定时
        start();
    }

    /**
     * 初始化自定义参数
     */
    private void init(Context context,Attribute