标题说渐变进度条是为了方便理解,这里本身的项目背景是一款表盘的分针。先上图:
周圈蓝色的渐变条(分针)就是本次要实现的东西。
1、拆分
首先,熟悉Canvas的朋友应该知道它可以画出各种形状,但偏偏没有一头是圆的环形(这里不考虑使用path绘制)。
所以我们不得不把它拆分为2个形状:圆环与圆.
2、绘制圆环
绘制圆环有很多种方法,比如画2个圆取补集之类的。这里直接使用canvas.drawArc()函数来画。
先看看函数原型:
void drawArc (RectF oval,
float startAngle,
float sweepAngle,
boolean useCenter,
Paint paint)
drawArc()有2个重载函数,此处只用到其一,另一个很是相似,只不过把oval参数换成了具体的4个值。
第一个参数是一个矩形,所绘制的圆环将会是此矩形的内切椭圆。如果给的是正方形那画出来的就是正圆环了。RectF的构造函数有4个参数分别是left top right bottom,直接看字面意思不是很好理解。其实就是矩形左上和右下2个点的坐标。left top分别是左上顶点的x和y,剩下2个同理。
第二参数是开始角度。由于屏幕坐标系关系,默认x轴正方向(就是水平向右)为0度。
第三个参数是圆环扫过的角度,顺时针为正。
第四个参数比较重要。这里为true则画出来的是扇形(即连接圆心),为false画出来的是圆弧。我们要画的是圆环,自然填false.
第五个参数就是画笔了,可以定义颜色粗细(即圆环宽度)等等。渐变问题稍后再说。这里要主要设置下画笔的style为stroke,否则画出来的只有边框没有填充。
下面是画纯色圆环的代码:
/*为了便于说明,先定义几个变量*/
float mMinOvalR; //圆环外接矩形边长的一半
float mMinWidth; //圆环宽度
float mMinOffsetY; //外接矩形top属性向上的偏移(这个下文会解释)
float degree = 315; //圆弧扫过的角度
//创建画笔:
mMinPaint = new Paint();
mMinPaint.setColor(Color.BLUE); //先随便给个颜色
mMinPaint.setAnt