<declare-styleable name="CountDownProgressBar">
  <attr name="countDown_circleWidth" format="dimension" />
  <attr name="countDown_centerTextSize" format="dimension" />
  <attr name="countDown_betaAngle" format="integer" />
  <attr name="countDown_firstColor" format="color" />
  <attr name="countDown_secondColor" format="color" />
  <attr name="countDown_centerTextColor" format="color" />
  <attr name="countDown_isShowGradient" format="boolean" />
</declare-styleable>

import android.animation.ValueAnimator;
import android.content.Context;
import android.content.res.Resources;
import android.content.res.TypedArray;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.LinearGradient;
import android.graphics.Paint;
import android.graphics.Paint.FontMetricsInt;
import android.graphics.Rect;
import android.graphics.RectF;
import android.graphics.Shader;
import android.util.AttributeSet;
import android.util.TypedValue;
import android.view.View;
import android.view.animation.LinearInterpolator;
 
import com.daodaojk.myapplication.R;
 
public class CountDownProgressBar extends View {
 /**
  * 進度條最大值
  */
 private int maxValue = 200;
 
 /**
  * 當(dāng)前進度值
  */
 private int currentValue ;
 
 /**
  * 每次掃過的角度，用來設(shè)置進度條圓弧所對應(yīng)的圓心角，alphaAngle=(currentValue/maxValue)*360
  */
 private float alphaAngle;
 
 /**
  * 底部圓弧的顏色，默認(rèn)為Color.LTGRAY
  */
 private int firstColor;
 
 /**
  * 進度條圓弧塊的顏色
  */
 private int secondColor;
 /**
  * 中間文字顏色(默認(rèn)藍色)
  */
 private int centerTextColor = Color.BLUE;
 /**
  * 中間文字的字體大小(默認(rèn)40dp)
  */
 private int centerTextSize;
 
 /**
  * 圓環(huán)的寬度
  */
 private int circleWidth;
 
 /**
  * 畫圓弧的畫筆
  */
 private Paint circlePaint;
 
 /**
  * 畫文字的畫筆
  */
 private Paint textPaint;
 /**
  * 是否使用漸變色
  */
 private boolean isShowGradient = false;
 
 /**
  * 漸變圓周顏色數(shù)組
  */
 private int[] colorArray = new int[]{Color.parseColor("#2773FF"),
   Color.parseColor("#27C0D2"), Color.parseColor("#40C66E")};
 private int duration;
 private OnFinishListener listener;
 private ValueAnimator animator;
 
 public CountDownProgressBar(Context context) {
  this(context, null);
 }
 
 
 public CountDownProgressBar(Context context, AttributeSet attrs) {
  this(context, attrs, 0);
 }
 
 
 public CountDownProgressBar(Context context, AttributeSet attrs, int defStyleAttr) {
  super(context, attrs, defStyleAttr);
 
  TypedArray ta = context.getTheme().obtainStyledAttributes(attrs, R.styleable.CountDownProgressBar,
    defStyleAttr, 0);
  int n = ta.getIndexCount();
 
  for (int i = 0; i < n; i++) {
   int attr = ta.getIndex(i);
   switch (attr) {
    case R.styleable.CountDownProgressBar_countDown_firstColor:
     firstColor = ta.getColor(attr, Color.LTGRAY); // 默認(rèn)底色為亮灰色
     break;
    case R.styleable.CountDownProgressBar_countDown_secondColor:
     secondColor = ta.getColor(attr, Color.BLUE); // 默認(rèn)進度條顏色為藍色
     break;
    case R.styleable.CountDownProgressBar_countDown_centerTextSize:
     centerTextSize = ta.getDimensionPixelSize(attr, (int) dip2px(40)); // 默認(rèn)中間文字字體大小為40dp
     break;
    case R.styleable.CountDownProgressBar_countDown_circleWidth:
     circleWidth = ta.getDimensionPixelSize(attr, (int) dip2px(6f)); // 默認(rèn)圓弧寬度為6dp
     break;
    case R.styleable.CountDownProgressBar_countDown_centerTextColor:
     centerTextColor = ta.getColor(attr, Color.BLUE); // 默認(rèn)中間文字顏色為藍色
     break;
    case R.styleable.CountDownProgressBar_countDown_isShowGradient:
     isShowGradient = ta.getBoolean(attr, false); // 默認(rèn)不適用漸變色
     break;
    default:
     break;
   }
  }
  ta.recycle();
 
  circlePaint = new Paint();
  circlePaint.setAntiAlias(true); // 抗鋸齒
  circlePaint.setDither(true); // 防抖動
  circlePaint.setStrokeWidth(circleWidth);//畫筆寬度
 
  textPaint = new Paint();
  textPaint.setAntiAlias(true);
  textPaint.setDither(true);
 }
 
 @Override
 protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
  // 分別獲取期望的寬度和高度，并取其中較小的尺寸作為該控件的寬和高,并且不超過屏幕寬高
  int widthPixels = this.getResources().getDisplayMetrics().widthPixels;//獲取屏幕寬
  int heightPixels = this.getResources().getDisplayMetrics().heightPixels;//獲取屏幕高
  int width = MeasureSpec.getSize(widthMeasureSpec);
  int hedight = MeasureSpec.getSize(heightMeasureSpec);
  int minWidth = Math.min(widthPixels, width);
  int minHedight = Math.min(heightPixels, hedight);
  setMeasuredDimension(Math.min(minWidth, minHedight), Math.min(minWidth, minHedight));
 }
 
 @Override
 protected void onDraw(Canvas canvas) {
  int center = this.getWidth() / 2;
  int radius = center - circleWidth / 2;
 
  drawCircle(canvas, center, radius); // 繪制進度圓弧
  drawText(canvas, center);
 }
 
 /**
  * 繪制進度圓弧
  *
  * @param canvas 畫布對象
  * @param center 圓心的x和y坐標(biāo)
  * @param radius 圓的半徑
  */
 private void drawCircle(Canvas canvas, int center, int radius) {
  circlePaint.setShader(null); // 清除上一次的shader
  circlePaint.setColor(firstColor); // 設(shè)置底部圓環(huán)的顏色，這里使用第一種顏色
  circlePaint.setStyle(Paint.Style.STROKE); // 設(shè)置繪制的圓為空心
  canvas.drawCircle(center, center, radius, circlePaint); // 畫底部的空心圓
  RectF oval = new RectF(center - radius, center - radius, center + radius, center + radius); // 圓的外接正方形
  if (isShowGradient) {
   // 繪制顏色漸變圓環(huán)
   // shader類是Android在圖形變換中非常重要的一個類。Shader在三維軟件中我們稱之為著色器，其作用是來給圖像著色。
   LinearGradient linearGradient = new LinearGradient(circleWidth, circleWidth, getMeasuredWidth()
     - circleWidth, getMeasuredHeight() - circleWidth, colorArray, null, Shader.TileMode.MIRROR);
   circlePaint.setShader(linearGradient);
  }
  circlePaint.setShadowLayer(10, 10, 10, Color.BLUE);
  circlePaint.setColor(secondColor); // 設(shè)置圓弧的顏色
  circlePaint.setStrokeCap(Paint.Cap.ROUND); // 把每段圓弧改成圓角的
 
  alphaAngle = currentValue * 360.0f / maxValue * 1.0f; // 計算每次畫圓弧時掃過的角度，這里計算要注意分母要轉(zhuǎn)為float類型，否則alphaAngle永遠為0
  canvas.drawArc(oval, -90, alphaAngle, false, circlePaint);
 }
 
 /**
  * 繪制文字
  *
  * @param canvas 畫布對象
  * @param center 圓心的x和y坐標(biāo)
  */
 private void drawText(Canvas canvas, int center) {
  int result = ((maxValue - currentValue) * (duration / 1000) / maxValue); // 計算進度
  String percent;
  if (maxValue == currentValue) {
   percent = "完成";
   textPaint.setTextSize(centerTextSize); // 設(shè)置要繪制的文字大小
  } else {
   percent = (result / 60 < 10 ? "0" + result / 60 : result / 60) + ":" + (result % 60 < 10 ? "0" + result % 60 : result % 60);
//   percent = result+"秒";
   textPaint.setTextSize(centerTextSize+centerTextSize/3); // 設(shè)置要繪制的文字大小
  }
  textPaint.setTextAlign(Paint.Align.CENTER); // 設(shè)置文字居中，文字的x坐標(biāo)要注意
  textPaint.setColor(centerTextColor); // 設(shè)置文字顏色
 
  textPaint.setStrokeWidth(0); // 注意此處一定要重新設(shè)置寬度為0,否則繪制的文字會重疊
  Rect bounds = new Rect(); // 文字邊框
  textPaint.getTextBounds(percent, 0, percent.length(), bounds); // 獲得繪制文字的邊界矩形 
  FontMetricsInt fontMetrics = textPaint.getFontMetricsInt(); // 獲取繪制Text時的四條線 
  int baseline = center + (fontMetrics.bottom - fontMetrics.top) / 2 - fontMetrics.bottom; // 計算文字的基線  canvas.drawText(percent, center, baseline, textPaint); // 繪制表示進度的文字
 
 }
 
 /**
  * 設(shè)置圓環(huán)的寬度
  *
  * @param width
  */
 public void setCircleWidth(int width) {
  this.circleWidth = (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, width, getResources()
    .getDisplayMetrics());
  circlePaint.setStrokeWidth(circleWidth);
  //一般只是希望在View發(fā)生改變時對UI進行重繪。invalidate()方法系統(tǒng)會自動調(diào)用 View的onDraw()方法。
  invalidate();
 }
 
 /**
  * 設(shè)置圓環(huán)的底色，默認(rèn)為亮灰色LTGRAY
  *
  * @param color
  */
 public void setFirstColor(int color) {
  this.firstColor = color;
  circlePaint.setColor(firstColor);
  //一般只是希望在View發(fā)生改變時對UI進行重繪。invalidate()方法系統(tǒng)會自動調(diào)用 View的onDraw()方法。
  invalidate();
 }
 
 /**
  * 設(shè)置進度條的顏色，默認(rèn)為藍色<br>
  *
  * @param color
  */
 public void setSecondColor(int color) {
  this.secondColor = color;
  circlePaint.setColor(secondColor);
  //一般只是希望在View發(fā)生改變時對UI進行重繪。invalidate()方法系統(tǒng)會自動調(diào)用 View的onDraw()方法。
  invalidate();
 }
 
 /**
  * 設(shè)置進度條漸變色顏色數(shù)組
  *
  * @param colors 顏色數(shù)組，類型為int[]
  */
 public void setColorArray(int[] colors) {
  this.colorArray = colors;
  //一般只是希望在View發(fā)生改變時對UI進行重繪。invalidate()方法系統(tǒng)會自動調(diào)用 View的onDraw()方法。
  invalidate();
 }
 
 
 /**
  * 按進度顯示百分比，可選擇是否啟用數(shù)字動畫
  *
  * @param duration 動畫時長
  */
 public void setDuration(int duration, OnFinishListener listener) {
   this.listener = listener;
  this.duration = duration + 1000;
  if (animator != null) {
   animator.cancel();
  } else {
   animator = ValueAnimator.ofInt(0, maxValue);
   animator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
    @Override
    public void onAnimationUpdate(ValueAnimator animation) {
     currentValue = (int) animation.getAnimatedValue();
     //一般只是希望在View發(fā)生改變時對UI進行重繪。invalidate()方法系統(tǒng)會自動調(diào)用 View的onDraw()方法。
     invalidate();
     if (maxValue == currentValue && CountDownProgressBar.this.listener != null) {
      CountDownProgressBar.this.listener.onFinish();
     }
    }
   });
   animator.setInterpolator(new LinearInterpolator());
  }
  animator.setDuration(duration);
  animator.start();
 }
 
 public interface OnFinishListener {
  void onFinish();
 }
 
 public void setOnFinishListener(OnFinishListener listener) {
  this.listener = listener;
 }
 
 public static int px2dip(int pxValue) {
  final float scale = Resources.getSystem().getDisplayMetrics().density;
  return (int) (pxValue / scale + 0.5f);
 }
 
 
 public static float dip2px(float dipValue) {
  final float scale = Resources.getSystem().getDisplayMetrics().density;
  return (dipValue * scale + 0.5f);
 }
} 

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
 android:layout_width="match_parent"
 android:layout_height="match_parent"
 xmlns:app="http://schemas.android.com/apk/res-auto"
 android:orientation="vertical">
<Button
 android:layout_width="match_parent"
 android:text="開始"
 android:id="@+id/btn_start"
 android:layout_height="wrap_content" />
 <com.daodaojk.myapplication.view.CountDownProgressBar
  android:id="@+id/cpb_countdown"
  android:layout_width="200dp"
  android:layout_marginTop="100dp"
  android:layout_gravity="center_horizontal"
  app:countDown_centerTextSize="25dp"
  app:countDown_circleWidth="4dp"
  app:countDown_firstColor="@color/text_gray_ccc"
  app:countDown_secondColor="@color/text_blue"
  app:countDown_isShowGradient="true"
  app:countDown_centerTextColor="#2395FF"
  android:layout_height="200dp" />
</LinearLayout>

package com.daodaojk.myapplication.ui;
 
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.Toast;
 
import com.daodaojk.myapplication.R;
import com.daodaojk.myapplication.view.CountDownProgressBar;
 
public class CountDownActivity extends AppCompatActivity {
 
 private CountDownProgressBar cpb_countdown;
 
 @Override
 protected void onCreate(Bundle savedInstanceState) {
  super.onCreate(savedInstanceState);
  setContentView(R.layout.activity_count_down);
  Button btn_start = findViewById(R.id.btn_start);
  cpb_countdown = (CountDownProgressBar) findViewById(R.id.cpb_countdown);
  btn_start.setOnClickListener(new View.OnClickListener() {
   @Override
   public void onClick(View v) {
    cpb_countdown.setDuration(10000, new CountDownProgressBar.OnFinishListener() {
     @Override
     public void onFinish() {
      Toast.makeText(CountDownActivity.this, "完成了", Toast.LENGTH_SHORT).show();
     }
    });
   }
  });
 }
}