自定义View——可拖动设置时间的时钟具体实现1

博主前年的项目中，做过一个自定义的时钟，效果如图所示：

手指按住圆环上的黄色圆圈位置绕圆环拖动，圆盘中间位置显示时间，0～24h的范围，超出24点之后从0重新开始计算。
实现这样一款时钟，只能自定义View，从自定义View的流程上看比较简单，稍微复杂的是由转动角度换算时间。

1. 时钟控件分解

我们把时钟拆解成三部分：白色圆环、黄色变动圆环、、黄色圆圈、中间文字。

1.1 绘制白色圆环

白色圆环就是一个360度的圆弧

Paint paint = new Paint();
paint.setStrokeWidth(30); //设置圆环的宽度，可配置
paint.setStyle(Paint.Style.STROKE);
paint.setAntiAlias(true);  //消除锯齿
RectF oval = new RectF(centerx - distance, centery - distance, centerx+ distance, centery + distance); 
/**
* 背景圆环
*/
paint.setColor(Color.WHITE);  //设置颜色
canvas.drawArc(oval, -90, 360, true, paint);

1.2 绘制黄色圆环

黄色圆环的角度随转动的弧度变化

paint.setColor(Color.rgb(244, 242, 10));  //设置进度环颜色
canvas.drawArc(oval, -90, angle, false, paint);  //根据进度画圆弧

angle表示需要绘制的圆环度数，显然angle在0到360之间。

1.3 绘制黄色圆圈

黄色圆圈位于黄色圆环的终点位置，以正北方向作为黄色圆环的起始位置。

paint.setColor(Color.rgb(