CircleProgressBar

今天又写了一个demo,带有两个进度值的 圆环进度条,原谅我是个小白,只能写一写简单的自定义控件,我会继续努力的。。先看效果图

《CircleProgressBar》 001.gif

<pre>
@Override
protected void onDraw(Canvas canvas) {
/*偏移量*/
float dMax = (dotDiameter – maxProgressWidth)*0.5F;
float dFirst = (dotDiameter – firstProgressWidth)*0.5F;
float dSecond = (dotDiameter – secondProgressWidth)*0.5F;
/*1.圆心(x,y)坐标值*/
float centerX = (width – getPaddingLeft() – getPaddingRight()) / 2.0f;
float centerY = (height – getPaddingTop() – getPaddingBottom()) / 2.0f;
/*2.圆环半径*/
float maxRadius = centerY – maxProgressWidth / 2;
float firstRadius = centerY – firstProgressWidth / 2;
float secondRadius = centerY – secondProgressWidth / 2;
if (getWidth() >= getHeight()) {
maxRadius = centerY – maxProgressWidth / 2;
firstRadius = centerY – firstProgressWidth / 2;
secondRadius = centerY – secondProgressWidth / 2;
} else {
maxRadius = centerX – maxProgressWidth / 2;
firstRadius = centerX – firstProgressWidth / 2;
secondRadius = centerX – secondProgressWidth / 2;
}

maxRectF.left =  centerX - maxRadius + dMax;
maxRectF.right = centerX + maxRadius - dMax;
maxRectF.top = centerY - maxRadius + dMax;
maxRectF.bottom = centerY + maxRadius - dMax;

firstRectF.left =  centerX - firstRadius + dFirst;
firstRectF.right = centerX + firstRadius - dFirst;
firstRectF.top = centerY - firstRadius + dFirst;
firstRectF.bottom = centerY + firstRadius - dFirst;

secondRectF.left = centerX - secondRadius + dSecond;
secondRectF.right = centerX + secondRadius - dSecond;
secondRectF.top = centerY - secondRadius + dSecond;
secondRectF.bottom = centerY + secondRadius - dSecond;

canvas.drawArc(maxRectF, 0, 360 , false, maxProgressPaint);

float firstAngle = (float) 360 \* firstProgress / (float) maxProgress;
float secondAngle = ((float) 360 \* secondProgress / (float) maxProgress);
float dotAngle =  (float) (Math.PI\*secondAngle/180.0F);

canvas.drawArc(firstRectF, 0 - 90, firstAngle, false, firstProgressPaint);
canvas.drawArc(secondRectF, 0 - 90, secondAngle , false, secondProgressPaint);

float dotCx = (float) (width\*0.5 + (width - dotDiameter)\*0.5 \* Math.sin(dotAngle));
float dotCy = (float) (height\*0.5 - (height -dotDiameter) \*0.5 \* Math.cos(dotAngle));
if(canDisplayDot){
    canvas.drawCircle(dotCx, dotCy, dotDiameter \* 0.5F, dotPaint);
}

}
</pre>

源码地址

<a href=”https://github.com/Alex-Cin/CircleProgressBar”>https://github.com/Alex-Cin/CircleProgressBar</a>

apk 下载地址

<a href=”http://fir.im/z3xb”>http://fir.im/z3xb</a>

    原文作者:Alex_Cin
    原文地址: https://www.jianshu.com/p/39abe90a5fcc
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞