【Android】仿支付宝支付成功自定义动画

功能

1.支持成功，失败，延迟的回调监听
2.支持自定义圆环颜色，路径颜色，圆环宽度，路径宽度

import android.animation.ValueAnimator;
import android.content.Context;
import android.content.res.TypedArray;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.RectF;
import android.util.AttributeSet;
import android.view.View;
import android.view.animation.LinearInterpolator;

import androidx.annotation.Nullable;

import com.example.binder.R;

public class PayView extends View {
    private Paint ring_paint;//圆环画笔
    private Paint arc_paint;//圆弧画笔
    private int ring_back_width;//圆环宽度
    private int arc_run_width;//圆弧宽度
    private int ring_back_color;//圆环背景颜色
    private int arc_run_color;//圆弧的颜色
    private int width;//宽度
    private int height;//高度
    public onPayListener payListener;
    private ValueAnimator animator;
    private int start_angle;
    private int currentValue;
    private ValueAnimator sencondAnimator = ValueAnimator.ofInt(0,360);;
    private boolean IsFinish = false;
    private int current_angle;

    private int i=0;
    public interface onPayListener{
        public void onSuccess();//支付成功
        public void onFail();//支付失败
        public void onDelay();//网速慢
    }
    public PayView(Context context) {
        this(context,null);
    }

    public PayView(Context context, @Nullable AttributeSet attrs) {
        this(context, attrs,0);
    }

    public PayView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        TypedArray ty = context.obtainStyledAttributes(attrs, R.styleable.PayView);
        ring_back_color = ty.getColor(R.styleable.PayView_ring_back_color, Color.GREEN);
        ring_back_width = (int) ty.getDimension(R.styleable.PayView_ring_back_width, getResources().getDimension(R.dimen.default_ring_width));
        arc_run_color = ty.getColor(R.styleable.PayView_arc_run_color, Color.RED);
        arc_run_width = (int) ty.getDimension(R.styleable.PayView_arc_run_width,getResources().getDimension(R.dimen.default_arc_width));
        ty.recycle();
        InitPaint();
    }

    private void InitPaint() {
        ring_paint = new Paint();
        arc_paint = new Paint();
        ring_paint.setStrokeWidth(ring_back_width);
        ring_paint.setColor(ring_back_color);
        ring_paint.setAntiAlias(true);
        ring_paint.setStyle(Paint.Style.STROKE);
        arc_paint.setColor(arc_run_color);
        arc_paint.setStrokeWidth(arc_run_width);
        arc_paint.setStyle(Paint.Style.STROKE);
    }

    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        int widthPixel = getResources().getDisplayMetrics().widthPixels;
        int heightPixel = getResources().getDisplayMetrics().heightPixels;
        width = MeasureSpec.getSize(widthMeasureSpec);
        height = MeasureSpec.getSize(heightMeasureSpec);
        int layout_width = Math.min(width,widthPixel);
        int layout_height = Math.min(height, heightPixel);
        int final_width = Math.min(layout_width, layout_height);
        //等下把padding和margin解决
        setMeasuredDimension(final_width, final_width);
    }

    @Override
    protected void onDraw(Canvas canvas) {
        //计算半径
        int radius = getWidth()/2-Math.max(arc_run_width, ring_back_width);
        int center = getWidth()/2;
        //画圆环
        drawRing(canvas,radius,center);
        if(!IsFinish){
            drawArc(canvas,center,radius);
        }else{
            drawCircle(canvas,center,radius);
        }


    }

    private void drawCircle(Canvas canvas, int center, int radius) {
        RectF rectF = new RectF(center-radius,center-radius,center+radius,center+radius);
        canvas.drawArc(rectF,start_angle*1.0f,current_angle*1.0f,false,arc_paint);
        if(current_angle==360){
            canvas.drawLine(center-30, center, center, center+30, arc_paint);
            canvas.drawLine(center, center+30, center+30, center-30,arc_paint);
        }
    }

    private void drawArc(Canvas canvas, int center, int radius) {
        //重点是标记起点角度
        int sweep_angle = 60;
        RectF rectF = new RectF(center-radius,center-radius,center+radius,center+radius);
        canvas.drawArc(rectF,start_angle*1.0f,sweep_angle*1.0f,false,arc_paint);
    }


    private void drawRing(Canvas canvas, int radius,int center) {
        canvas.drawCircle(center,center,radius,ring_paint);
    }

    public void setOnPayListenter(onPayListener listenter){
        this.payListener = listenter;
    }

    public void start(int duration){
        if(animator==null){
            animator = ValueAnimator.ofInt(0,360);
        }
        animator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
            @Override
            public void onAnimationUpdate(ValueAnimator animation) {

                  start_angle = (int) animation.getAnimatedValue();
                  currentValue+=start_angle;
                  if(currentValue>360*20&&currentValue<360*30){
                      payListener.onSuccess();
                      animator.cancel();
                      //暂停动画，继续花园
                      IsFinish=true;
                      sencondAnimator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
                              @Override
                              public void onAnimationUpdate(ValueAnimator animation) {
                                  current_angle = (int) animation.getAnimatedValue();
                                  invalidate();
                              }
                          });
                          sencondAnimator.setDuration(720);
                          sencondAnimator.start();

                  }
                  if(currentValue>=360*10&&currentValue<360*20){
                      payListener.onDelay();
                  }
                  if(currentValue>=360*30){
                      payListener.onFail();//超时未支付成功，失败
                  }
                  invalidate();

            }
        });
        animator.setDuration(duration);
        animator.setRepeatCount(-1);//永不停止，除非任务完成了
        animator.setRepeatMode(ValueAnimator.RESTART);
        animator.setInterpolator(new LinearInterpolator());
        animator.start();
    }

}

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <dimen name="width">20dp</dimen>
    <dimen name="textSize">28sp</dimen>
    <dimen name="default_ring_width">1dp</dimen>
    <dimen name="default_arc_width">1dp</dimen>
</resources>

 <declare-styleable name="PayView">
        <!--圆环颜色-->
        <attr name="ring_back_color" format="color"></attr>
        <!--圆弧颜色-->
        <attr name="arc_run_color" format="color"></attr>
        <!--圆环的宽度-->
        <attr name="ring_back_width" format="dimension"></attr>
        <!--圆弧的宽度-->
        <attr name="arc_run_width" format="dimension"></attr>
    </declare-styleable>