自定义圆形进度条

/**

Created by CirclePercentBar
Time: 2020/8/3
Tunction:圆形进度条
*/
public class CirclePercentBar extends View {

private Context mContext;

private int mArcColor;
private int mArcWidth;
private int mCenterTextColor;
private int mCenterTextSize;
private int mCircleRadius;
private Paint arcPaint;
private Paint arcCirclePaint;
private Paint centerTextPaint;
private RectF arcRectF;
private Rect textBoundRect;
private float mCurData = 0;
private String mSuffix = “%”;
private int arcStartColor;
private int arcEndColor;
private Paint startCirclePaint;
private int astextColor;

public CirclePercentBar(Context context) {
this(context, null);
}

public CirclePercentBar(Context context, AttributeSet attrs) {
this(context, attrs, 0);
}

public CirclePercentBar(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
mContext = context;
TypedArray typedArray = context.obtainStyledAttributes(attrs, R.styleable.CirclePercentBar, defStyleAttr, 0);
mArcColor = typedArray.getColor(R.styleable.CirclePercentBar_arcColor, 0xff0000);
mArcWidth = typedArray.getDimensionPixelSize(R.styleable.CirclePercentBar_arcWidth, SizeUtils.dp2px(context, 20));
mCenterTextColor = typedArray.getColor(R.styleable.CirclePercentBar_centerTextColor, 0x0000ff);
mCenterTextSize = typedArray.getDimensionPixelSize(R.styleable.CirclePercentBar_centerTextSize, SizeUtils.dp2px(context, 20));
mCircleRadius = typedArray.getDimensionPixelSize(R.styleable.CirclePercentBar_circleRadius, SizeUtils.dp2px(context, 100));
arcStartColor = typedArray.getColor(R.styleable.CirclePercentBar_arcStartColor,
ContextCompat.getColor(mContext, R.color.color287DFD));
arcEndColor = typedArray.getColor(R.styleable.CirclePercentBar_arcEndColor,
ContextCompat.getColor(mContext, R.color.color287DFD));
```
 typedArray.recycle(); initPaint();
```
}

private void initPaint() {
```
 startCirclePaint = new Paint(Paint.ANTI_ALIAS_FLAG); startCirclePaint.setStyle(Paint.Style.FILL); //startCirclePaint.setStrokeWidth(mArcWidth); startCirclePaint.setColor(arcEndColor); arcCirclePaint = new Paint(Paint.ANTI_ALIAS_FLAG); arcCirclePaint.setStyle(Paint.Style.STROKE); arcCirclePaint.setStrokeWidth(mArcWidth); arcCirclePaint.setColor(ContextCompat.getColor(mContext, R.color.color7D8398)); arcCirclePaint.setStrokeCap(Paint.Cap.ROUND); arcPaint = new Paint(Paint.ANTI_ALIAS_FLAG); arcPaint.setStyle(Paint.Style.STROKE); arcPaint.setStrokeWidth(mArcWidth); arcPaint.setColor(mArcColor); arcPaint.setStrokeCap(Paint.Cap.ROUND); centerTextPaint = new Paint(Paint.ANTI_ALIAS_FLAG); centerTextPaint.setStyle(Paint.Style.STROKE);
```

// centerTextPaint.setColor(mCenterTextColor);
centerTextPaint.setTextSize(mCenterTextSize);

    //圓弧的外接矩形    arcRectF = new RectF();    //文字的边界矩形    textBoundRect = new Rect();}@Overrideprotected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {    super.onMeasure(widthMeasureSpec, heightMeasureSpec);    setMeasuredDimension(measureDimension(widthMeasureSpec), measureDimension(heightMeasureSpec));}private int measureDimension(int measureSpec) {    int result;    int specMode = MeasureSpec.getMode(measureSpec);    int specSize = MeasureSpec.getSize(measureSpec);    if (specMode == MeasureSpec.EXACTLY) {        result = specSize;    } else {        result = mCircleRadius * 2;        if (specMode == MeasureSpec.AT_MOST) {            result = Math.min(result, specSize);        }    }    return result;}@Overrideprotected void onDraw(Canvas canvas) {    canvas.rotate(-90, getWidth() / 2, getHeight() / 2);    arcRectF.set(getWidth() / 2 - mCircleRadius + mArcWidth / 2, getHeight() / 2 - mCircleRadius + mArcWidth / 2            , getWidth() / 2 + mCircleRadius - mArcWidth / 2, getHeight() / 2 + mCircleRadius - mArcWidth / 2);    canvas.drawArc(arcRectF, 0, 360, false, arcCirclePaint);    arcPaint.setShader(new SweepGradient(getWidth() / 2, getHeight() / 2, arcEndColor, arcEndColor));    canvas.drawArc(arcRectF, 0, 360 * mCurData / 100, false, arcPaint);    canvas.rotate(90, getWidth() / 2, getHeight() / 2);    canvas.drawCircle(getWidth() / 2, getHeight() / 2 - mCircleRadius + mArcWidth / 2, mArcWidth / 2, startCirclePaint);    String data = String.valueOf(mCurData) + mSuffix;    centerTextPaint.getTextBounds(data, 0, data.length(), textBoundRect);    canvas.drawText(data, getWidth() / 2 - textBoundRect.width() / 2, getHeight() / 2 + textBoundRect.height() / 2, centerTextPaint);}public void setmCenterTextColor(int mCenterTextColor) {    astextColor = mCenterTextColor;    centerTextPaint.setColor(astextColor);}public void setPercentData(float data, final String suffix, TimeInterpolator interpolator) {    ValueAnimator valueAnimator = ValueAnimator.ofFloat(mCurData, data);    valueAnimator.setDuration((long) (Math.abs(mCurData - data) * 30));    valueAnimator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {        @Override        public void onAnimationUpdate(ValueAnimator valueAnimator) {            float value = (float) valueAnimator.getAnimatedValue();            mCurData = (float) (Math.round(value * 10)) / 10;            mSuffix = suffix;            invalidate();        }    });    valueAnimator.setInterpolator(interpolator);    valueAnimator.start();}

}

~~//布局~~
android:id="@+id/circle_bar"
android:layout_width=“40dp”
android:layout_height=“40dp”
android:layout_centerHorizontal=“true”
android:layout_centerVertical=“true”
android:layout_margin=“1dp”
app:arcColor="@color/color7D8398"
app:arcStartColor="@color/color7D8398"
app:arcWidth=“2dp”
app:centerTextSize=“13sp”
app:circleRadius=“20dp” />

//代码中中使用根据判断设置圈内字体颜色
if (data == 60) {
mBar.setmCenterTextColor(getResources().getColor(R.color.color287DFD));
} else {
mBar.setmCenterTextColor(getResources().getColor(R.color.colorAccent));
}
mBar.setPercentData(66, “%”, new DecelerateInterpolator());
// new DecelerateInterpolator() 额…不懂的话自行百度

//布局效果图

更多相关文章

随机推荐