Android自定义圆形带刻度渐变色的进度条样式实例代码

public void drawArc (RectF oval, float startAngle, float sweepAngle, boolean useCenter, Paint paint)

 //circleCenter 整个圆半径 radius圆环的半径
RectF oval = new RectF(circleCenter - radius, circleCenter - radius, circleCenter + radius, circleCenter + radius);
//因为-90°才是从12点钟方向开始 所以从-90开始 progress 为进度
canvas.drawArc(oval, -90, (float) (progress * 3.6), false, paint);

//渐变颜色 你可以添加很多种但是至少要保持在2种颜色以上
int[] colors = {0xffff4639, 0xffCDD513, 0xff3CDF5F};
 //circleWidth 圆的直径 取中心点 
 SweepGradient sweepGradient = new SweepGradient(this.circleWidth / 2, this.circleWidth / 2, colors, null);

 //旋转 不然是从0度开始渐变
 Matrix matrix = new Matrix();
 matrix.setRotate(-90, this.circleWidth / 2, this.circleWidth / 2);
 sweepGradient.setLocalMatrix(matrix);

paint.setShader(sweepGradient);

paint.setShader(null);

//同样的因为是反向绘制的 也可以根据当前的有颜色的角度结束角度开始绘制到-90°
 canvas.drawArc(oval, -90, (float) (-(100 - progress) * 3.6), false, paint);

 float start = -90f;
   float p = ((float) maxColorNumber / (float) 100);
   p = (int) (progress * p);
   for (int i = 0; i 

 //绘制文字刻度
  for (int i = 1; i <= 10; i++) {
   canvas.save();// 保存当前画布
   canvas.rotate(360 / 10 * i, circleCenter, circleCenter);
   canvas.drawText(i * 10 + "", circleCenter, circleCenter - radius + roundWidth / 2 + getDpValue(4) + textSize, mPaintText);
   canvas.restore();//
  }

package com.example.shall.myapplication;
import android.content.Context;
import android.content.res.TypedArray;
import android.graphics.Canvas;
import android.graphics.Matrix;
import android.graphics.Paint;
import android.graphics.RectF;
import android.graphics.SweepGradient;
import android.util.AttributeSet;
import android.util.TypedValue;
import android.view.View;
public class CircularRingPercentageView extends View {
 private Paint paint;
 private int circleWidth;
 private int roundBackgroundColor;
 private int textColor;
 private float textSize;
 private float roundWidth;
 private float progress = 0;
 private int[] colors = {0xffff4639, 0xffCDD513, 0xff3CDF5F};
 private int radius;
 private RectF oval;
 private Paint mPaintText;
 private int maxColorNumber = 100;
 private float singlPoint = 9;
 private float lineWidth = 0.3f;
 private int circleCenter;
 private SweepGradient sweepGradient;
 private boolean isLine;
 /**
  * 分割的数量
  *
  * @param maxColorNumber 数量
  */
 public void setMaxColorNumber(int maxColorNumber) {
  this.maxColorNumber = maxColorNumber;
  singlPoint = (float) 360 / (float) maxColorNumber;
  invalidate();
 }
 /**
  * 是否是线条
  *
  * @param line true 是 false否
  */
 public void setLine(boolean line) {
  isLine = line;
  invalidate();
 }
 public int getCircleWidth() {
  return circleWidth;
 }
 public CircularRingPercentageView(Context context) {
  this(context, null);
 }
 public CircularRingPercentageView(Context context, AttributeSet attrs) {
  this(context, attrs, 0);
 }
 public CircularRingPercentageView(Context context, AttributeSet attrs, int defStyle) {
  super(context, attrs, defStyle);
  TypedArray mTypedArray = context.obtainStyledAttributes(attrs, R.styleable.CircularRing);
  maxColorNumber = mTypedArray.getInt(R.styleable.CircularRing_circleNumber, 40);
  circleWidth = mTypedArray.getDimensionPixelOffset(R.styleable.CircularRing_circleWidth, getDpValue(180));
  roundBackgroundColor = mTypedArray.getColor(R.styleable.CircularRing_roundColor, 0xffdddddd);
  textColor = mTypedArray.getColor(R.styleable.CircularRing_circleTextColor, 0xff999999);
  roundWidth = mTypedArray.getDimension(R.styleable.CircularRing_circleRoundWidth, 40);
  textSize = mTypedArray.getDimension(R.styleable.CircularRing_circleTextSize, getDpValue(8));
  colors[0] = mTypedArray.getColor(R.styleable.CircularRing_circleColor1, 0xffff4639);
  colors[1] = mTypedArray.getColor(R.styleable.CircularRing_circleColor2, 0xffcdd513);
  colors[2] = mTypedArray.getColor(R.styleable.CircularRing_circleColor3, 0xff3cdf5f);
  initView();
  mTypedArray.recycle();
 }
 /**
  * 空白出颜色背景
  *
  * @param roundBackgroundColor
  */
 public void setRoundBackgroundColor(int roundBackgroundColor) {
  this.roundBackgroundColor = roundBackgroundColor;
  paint.setColor(roundBackgroundColor);
  invalidate();
 }
 /**
  * 刻度字体颜色
  *
  * @param textColor
  */
 public void setTextColor(int textColor) {
  this.textColor = textColor;
  mPaintText.setColor(textColor);
  invalidate();
 }
 /**
  * 刻度字体大小
  *
  * @param textSize
  */
 public void setTextSize(float textSize) {
  this.textSize = textSize;
  mPaintText.setTextSize(textSize);
  invalidate();
 }
 /**
  * 渐变颜色
  *
  * @param colors
  */
 public void setColors(int[] colors) {
  if (colors.length <2) {
   throw new IllegalArgumentException("colors length <2");
  }
  this.colors = colors;
  sweepGradientInit();
  invalidate();
 }
 /**
  * 间隔角度大小
  *
  * @param lineWidth
  */
 public void setLineWidth(float lineWidth) {
  this.lineWidth = lineWidth;
  invalidate();
 }
 private int getDpValue(int w) {
  return (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, w, getContext().getResources().getDisplayMetrics());
 }
 /**
  * 圆环宽度
  *
  * @param roundWidth 宽度
  */
 public void setRoundWidth(float roundWidth) {
  this.roundWidth = roundWidth;
  if (roundWidth > circleCenter) {
   this.roundWidth = circleCenter;
  }
  radius = (int) (circleCenter - this.roundWidth / 2); // 圆环的半径
  oval.left = circleCenter - radius;
  oval.right = circleCenter + radius;
  oval.bottom = circleCenter + radius;
  oval.top = circleCenter - radius;
  paint.setStrokeWidth(this.roundWidth);
  invalidate();
 }
 /**
  * 圆环的直径
  *
  * @param circleWidth 直径
  */
 public void setCircleWidth(int circleWidth) {
  this.circleWidth = circleWidth;
  circleCenter = circleWidth / 2;
  if (roundWidth > circleCenter) {
   roundWidth = circleCenter;
  }
  setRoundWidth(roundWidth);
  sweepGradient = new SweepGradient(this.circleWidth / 2, this.circleWidth / 2, colors, null);
  //旋转 不然是从0度开始渐变
  Matrix matrix = new Matrix();
  matrix.setRotate(-90, this.circleWidth / 2, this.circleWidth / 2);
  sweepGradient.setLocalMatrix(matrix);
 }
 /**
  * 渐变初始化
  */
 public void sweepGradientInit() {
  //渐变颜色
  sweepGradient = new SweepGradient(this.circleWidth / 2, this.circleWidth / 2, colors, null);
  //旋转 不然是从0度开始渐变
  Matrix matrix = new Matrix();
  matrix.setRotate(-90, this.circleWidth / 2, this.circleWidth / 2);
  sweepGradient.setLocalMatrix(matrix);
 }
 public void initView() {
  circleCenter = circleWidth / 2;//半径
  singlPoint = (float) 360 / (float) maxColorNumber;
  radius = (int) (circleCenter - roundWidth / 2); // 圆环的半径
  sweepGradientInit();
  mPaintText = new Paint();
  mPaintText.setColor(textColor);
  mPaintText.setTextAlign(Paint.Align.CENTER);
  mPaintText.setTextSize(textSize);
  mPaintText.setAntiAlias(true);
  paint = new Paint();
  paint.setColor(roundBackgroundColor);
  paint.setStyle(Paint.Style.STROKE);
  paint.setStrokeWidth(roundWidth);
  paint.setAntiAlias(true);
  // 用于定义的圆弧的形状和大小的界限
  oval = new RectF(circleCenter - radius, circleCenter - radius, circleCenter + radius, circleCenter + radius);
 }
 @Override
 protected void onDraw(Canvas canvas) {
  super.onDraw(canvas);
  //背景渐变颜色
  paint.setShader(sweepGradient);
  canvas.drawArc(oval, -90, (float) (progress * 3.6), false, paint);
  paint.setShader(null);
  //是否是线条模式
  if (!isLine) {
   float start = -90f;
   float p = ((float) maxColorNumber / (float) 100);
   p = (int) (progress * p);
   for (int i = 0; i