Android自定义控件 倒计时

码个蛋第273次推文

倒数5个数~

作者：容华谢后

博客：https://www.jianshu.com/u/34ece31cd6eb

文章目录

写在前面

实现

初始化一些数据

定义控件的大小

绘制刻度盘

绘制刻度盘

绘制定时进度条

绘制时间

滑动事件

写在最后

GitHub传送门（https://link.jianshu.com/?t=https://github.com/alidili/Demos/tree/master/CountdownDemo）

写在前面

本篇文章实现了一个简单的倒计时控件，主要运用了画布的操作，滑动角度计算等知识点，非常适合自定义控件的初学者进行学习，看下效果图：

1

实现

初始化一些数据

定义控件的大小

绘制刻度盘

首先绘制一个圆，然后把坐标原点移动到控件中心，原点移动到控件中心后向上为负值，接着绘制小时刻度，一共有12个刻度，time的单位为分钟，要注意如果刻度被定时进度条覆盖就不再绘制，绘制分钟刻度同理，代码中已经写了很全的注释，不再多说，看下效果：

绘制定时进度条

如果定时时间大于0则开始绘制定时进度条，重点说下绘制进度，在这里并没有使用绘制圆弧的方法，依然是通过旋转画布的方式绘制的，设置一个15分钟的进度，看下效果：

绘制时间

在控件中心绘制一段文本，重点在于如何获取文本的宽高，宽度直接测量就可以了，高度比较特殊，因为绘制的是数字，所以使用Math.abs(timePaint.ascent() + timePaint.descent());这种方式来获取文本高度，先挖个坑，下一篇文章详细讲一下文本的绘制，看下效果：

滑动事件

通过计算滑过的角度增量来设置当前的定时时间，看下如何来计算当前触摸点的角度：

前方高能，请减速慢行！

首先了解下弧度与角度的计算公式：

完整圆的弧度为2π，角度为360度，所以180度等于π弧度

弧度 = 角度 / 180 * π

角度 = 弧度 / π * 180

然后以第一象限的点为例，计算一下触摸点的角度：

看图理解：

根据滑过的角度计算当前的定时时间：

最后提供设置倒计时，和监听倒计时状态的方法:

大功告成，再看下效果：

2

写在最后

源码已经上传到GitHub上了，欢迎Fork，觉得还不错就Start一下吧！

GitHub传送门（https://link.jianshu.com/?t=https://github.com/alidili/Demos/tree/master/CountdownDemo）

点我下载本文Demo的Apk（https://link.jianshu.com/?t=https://github.com/alidili/Demos/raw/master/CountdownDemo/CountdownDemo.apk）