Android custom circular countdown display control

This example shares the specific code of Android custom circular countdown display control for your reference. The specific contents are as follows

Effect drawing first

-The countdown is over

Code block

Attributes required for attr.xml control:

<?xml version="1.0" encoding="utf-8"?>
<resources>

 <declare-styleable name="CountDownView">
  <!--颜色-->
  <attr name="ringColor" format="color" />
  <!-- 进度文本的字体大小 -->
  <attr name="progressTextSize" format="dimension" />
  <!-- 圆环宽度 -->
  <attr name="ringWidth" format="float" />
  <!--进度文本颜色-->
  <attr name="progressTextColor" format="color"/>
  <!--倒计时-->
  <attr name="countdownTime" format="integer"/>
 </declare-styleable>
</resources>

CountDownView.java

public class CountDownView extends View {
 //圆轮颜色
 private int mRingColor;
 //圆轮宽度
 private float mRingWidth;
 //圆轮进度值文本大小
 private int mRingProgessTextSize;
 //宽度
 private int mWidth;
 //高度
 private int mHeight;
 private Paint mPaint;
 //圆环的矩形区域
 private RectF mRectF;
 //
 private int mProgessTextColor;
 private int mCountdownTime;
 private float mCurrentProgress;
 private OnCountDownFinishListener mListener;

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

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

 public CountDownView(Context context,AttributeSet attrs,int defStyleAttr) {
  super(context,defStyleAttr);
  TypedArray a = context.obtainStyledAttributes(attrs,R.styleable.CountDownView);
  mRingColor = a.getColor(R.styleable.CountDownView_ringColor,context.getResources().getColor(R.color.colorAccent));
  mRingWidth = a.getFloat(R.styleable.CountDownView_ringWidth,40);
  mRingProgessTextSize = a.getDimensionPixelSize(R.styleable.CountDownView_progressTextSize,DisplayUtils.sp2px(context,20));
  mProgessTextColor = a.getColor(R.styleable.CountDownView_progressTextColor,context.getResources().getColor(R.color.colorAccent));
  mCountdownTime = a.getInteger(R.styleable.CountDownView_countdownTime,60);
  a.recycle();
  mPaint = new Paint(Paint.ANTI_ALIAS_FLAG);
  mPaint.setAntiAlias(true);
  this.setWillNotDraw(false);
 }

 public void setCountdownTime(int mCountdownTime) {
  this.mCountdownTime = mCountdownTime;
 }

 @Override
 protected void onLayout(boolean changed,int left,int top,int right,int bottom) {
  super.onLayout(changed,left,top,right,bottom);
  mWidth = getMeasuredWidth();
  mHeight = getMeasuredHeight();
  mRectF = new RectF(0 + mRingWidth / 2,0 + mRingWidth / 2,mWidth - mRingWidth / 2,mHeight - mRingWidth / 2);
 }

 @Override
 protected void onDraw(Canvas canvas) {
  super.onDraw(canvas);
  /**
   *圆环
   */
  //颜色
  mPaint.setColor(mRingColor);
  //空心
  mPaint.setStyle(Paint.Style.stroke);
  //宽度
  mPaint.setstrokeWidth(mRingWidth);
  canvas.drawArc(mRectF,-90,mCurrentProgress - 360,false,mPaint);
  //绘制文本
  Paint textPaint = new Paint();
  textPaint.setAntiAlias(true);
  textPaint.setTextAlign(Paint.Align.CENTER);
  String text = mCountdownTime - (int) (mCurrentProgress / 360f * mCountdownTime) + "";
  textPaint.setTextSize(mRingProgessTextSize);
  textPaint.setColor(mProgessTextColor);

  //文字居中显示
  Paint.FontMetricsInt fontMetrics = textPaint.getFontMetricsInt();
  int baseline = (int) ((mRectF.bottom + mRectF.top - fontMetrics.bottom - fontMetrics.top) / 2);
  canvas.drawText(text,mRectF.centerX(),baseline,textPaint);
 }

 private ValueAnimator getValA(long countdownTime) {
  ValueAnimator valueAnimator = ValueAnimator.ofFloat(0,100);
  valueAnimator.setDuration(countdownTime);
  valueAnimator.setInterpolator(new LinearInterpolator());
  valueAnimator.setRepeatCount(0);
  return valueAnimator;
 }
 /**
  * 开始倒计时
  */
 public void startCountDown() {
  setClickable(false);
  ValueAnimator valueAnimator = getValA(mCountdownTime * 1000);
  valueAnimator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
   @Override
   public void onAnimationUpdate(ValueAnimator animation) {
    float i = Float.valueOf(String.valueOf(animation.getAnimatedValue()));
    mCurrentProgress = (int) (360 * (i / 100f));
    invalidate();
   }
  });
  valueAnimator.start();
  valueAnimator.addListener(new AnimatorListenerAdapter() {
   @Override
   public void onAnimationEnd(Animator animation) {
    super.onAnimationEnd(animation);
    //倒计时结束回调
    if (mListener != null) {
     mListener.countDownFinished();
    }
    setClickable(true);
   }

  });
 }
 public void setAddCountDownListener(OnCountDownFinishListener mListener) {
  this.mListener = mListener;
 }
 public interface OnCountDownFinishListener {
  void countDownFinished();
 }

}

MainActivity.java

package com.ouyuan.demo.myapplication;

import android.animation.ValueAnimator;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.TextView;
import android.widget.Toast;

public class MainActivity extends AppCompatActivity {

 CountDownView cdv;
 TextView textView;

 @Override
 protected void onCreate(Bundle savedInstanceState) {
  super.onCreate(savedInstanceState);
  setContentView(R.layout.activity_main);

  cdv = (CountDownView) findViewById(R.id.countDownView);

  cdv.setAddCountDownListener(new CountDownView.OnCountDownFinishListener() {
   @Override
   public void countDownFinished() {
    Toast.makeText(MainActivity.this,"倒计时结束",Toast.LENGTH_SHORT).show();
   }
  });

  cdv.setOnClickListener(new View.OnClickListener() {
   @Override
   public void onClick(View v) {
    cdv.startCountDown();
   }
  });
 }
}

The above is the whole content of this article. I hope it will help you in your study, and I hope you will support us a lot.