By Long Luo
Android中自定义控件 一直都是Android开发中的一个难点。
最近看大牛 @Tomcat的猫 写的 《Android群英传》 里面的第六章Android绘图机制及处理技巧 ,里面通过Canvas实现了一个如下所示的仪表盘:仪表盘
在书中详细描述了如何实现这个仪表盘,这里就不赘述了,可以参考其 具体实现代码 。
但是这个表盘的指针是静止不动 的,如果我们能让这个表盘的指针展示当前时间,随着时间而转动,那么我们就可以一款模拟时钟了。
那么,问题就来了:
如何才能让时钟的指针动起来呢?
这个问题,我们可以考虑分为2步去实现,第一步先绘制出当前的时间,第二部再让指针动起来。通过这样我们就可以实现一款模拟时钟 。
一、绘制当前时间 1.1 获取当前时间 要绘制当前时间,我们要先获取当前时间。
1.2 获取指针角度 当前时间可分为时,分,秒 。
我们最终要获取的是时分秒3个指针对应的精确角度 。
秒针角度:最简单,直接乘以6即可获得。 分针角度:当前分钟 * 6 + 6 * 秒 / 60F 时针角度:(当前小时 % 12) * 30 + 30 * 当前分钟角度 / 360F;
1.3 绘制指针 获取到指针角度之后,接下来就是在表盘绘制指针了。这里我们要利用canvas.rotate()这个方法来实现绘制指针,具体实现代码如下所示:1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 private void drawTime (Canvas canvas) { mTime.setToNow(); float secRot = mTime.second * 6 ; float minRot = mTime.minute * 6 + 6 * mTime.second / 60F ; float hrRot = (mTime.hour % 12 ) * 30 + 30 * minRot / 360F ; Log.d(TAG, "hrRot=" + hrRot + ",minRot=" + minRot + ",secRot=" + secRot); Paint paintHour = new Paint (); paintHour.setStrokeWidth(20 ); Paint paintMinute = new Paint (); paintMinute.setStrokeWidth(10 ); Paint paintSecond = new Paint (); paintSecond.setStrokeWidth(5 ); canvas.save(); canvas.rotate(hrRot, mWidth / 2 , mHeight / 2 ); canvas.drawLine(mWidth / 2 , mHeight / 2 , mWidth / 2 , mHeight / 2 - mWidth / 2 + 320 , paintHour); canvas.rotate(-hrRot, mWidth / 2 , mHeight / 2 ); canvas.rotate(minRot, mWidth / 2 , mHeight / 2 ); canvas.drawLine(mWidth / 2 , mHeight / 2 , mWidth / 2 , mHeight / 2 - mWidth / 2 + 230 , paintMinute); canvas.rotate(-minRot, mWidth / 2 , mHeight / 2 ); canvas.rotate(secRot, mWidth / 2 , mHeight / 2 ); canvas.drawLine(mWidth / 2 , mHeight / 2 , mWidth / 2 , mHeight / 2 - mWidth / 2 + 150 , paintSecond); canvas.rotate(-secRot, mWidth / 2 , mHeight / 2 ); canvas.restore(); }