您的位置:首页 > 其它

好吧,这又是一个圆形进度条!

2016-06-05 11:20 239 查看
项目需要,需要一个圆形渐变进度条,自己写了一个,完事后完善了一下细节。先上图



关键代码如下:

mPaint.setAntiAlias(true);
rectF.set(strokeWidth / 2f, strokeWidth / 2, width - strokeWidth / 2, width - strokeWidth / 2);
mPaint.setStrokeWidth(strokeWidth);
mPaint.setStyle(Paint.Style.STROKE);

//画环形底色
mPaint.setColor(underColor);
canvas.drawArc(rectF, 0, 360, false, mPaint);

//画环形
setShaderColor();
//mPaint.setStrokeCap(Paint.Cap.ROUND);
mPaint.setStrokeWidth(strokeWidth - lineWidth);
canvas.drawArc(rectF, 270, angle, false, mPaint);
mPaint.setShader(null);//画完后清除渲染

//画中间的文字
mPaint.setTextSize(indexSize);
mPaint.setStyle(Paint.Style.FILL);
mPaint.setColor(percentColor);
int number = (int) (angle * 100 / 360f);
number = number < 0 ? 0 : number;
number = number > 100 ? 100 : number;
String index = String.valueOf(number);
float indexW = mPaint.measureText(index);
mPaint.getTextBounds(index, 0, 1, mRect);//获取中间数字的高度
float indexH = mRect.height();
if (isFirst) {
indexFinalH = indexH;
isFirst = false;
}
canvas.drawText(index, (width - indexW) / 2.0f, (height + indexFinalH) / 2.0f, mPaint);

//画百分比的符号
mPaint.setTextSize(symbolSize);
canvas.drawText("%", (width + indexW) / 2.0f, (height + indexFinalH) / 2.0f, mPaint);

private void setShaderColor() {
int[] color = new int[]{Color.parseColor("#FFBF80"), Color.parseColor("#FF8080")};
color = shaderColor == null ? color : shaderColor;
//使用矩阵将Shader旋转-90度
mMatrix.setRotate(-90, getWidth() / 2, getHeight() / 2);
Shader shader = new SweepGradient(getWidth() / 2, getHeight() / 2, color, null);
shader.setLocalMatrix(mMatrix);
mPaint.setShader(shader);
}

关键代码就这些,具体看源码吧:https://github.com/HzwSunshine/ProgressView
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  进度条 渐变 圆形