自定View-模仿点我达开频页加载动画

自定View-模仿点我达开频页加载动画

转载请标明出处：http://blog.csdn.net/zhijunhong/article/details/51052597 谢谢！~

• 自定义View-内部圆
• 自定义View-外部圆
• 改变外圆颜色的同时改变透明度

---

先贴出全部代码

package com.example.custome_view.diwoda;

import android.animation.AnimatorSet;
import android.animation.ValueAnimator;
import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.os.Handler;
import android.support.annotation.Nullable;
import android.util.AttributeSet;
import android.view.View;

import com.example.custome_view.R;
import com.fudaojun.fudaojunlib.utils.LibCalcUtil;

/**
 * Created by ZhijunHong on 2018/7/5.
 * 一个简单的自定义View + 动画集合
 */

public class DiWoDaView extends View {
    //控件宽度
    private int mWidth;
    //控件高度
    private int mHeight;
    //外部圆画笔
    private Paint mOutCirclePaint;
    //外部圆半径
    private float mOutCircleRaduis;
    //外部圆透明度
    private int mTransparency;
    //外部圆颜色
    private int mCircleColor;

    //内部圆画笔
    private Paint mInCirclePaint;
    //内部圆半径
    private float mInCicleRadius;

    //handler
    private Handler mHandler;

    //动画集合
    private AnimatorSet mAnimationSet;

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

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

    public DiWoDaView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);

        init();
    }

    /**
     * 初始化资源
     */
    private void init() {
        mOutCirclePaint = new Paint(Paint.ANTI_ALIAS_FLAG | Paint.LINEAR_TEXT_FLAG);
        mOutCirclePaint.setStyle(Paint.Style.FILL);
        mOutCirclePaint.setColor(Color.YELLOW);

        mInCirclePaint = new Paint(Paint.ANTI_ALIAS_FLAG | Paint.LINEAR_TEXT_FLAG);
        mInCirclePaint.setStyle(Paint.Style.FILL);
        mInCirclePaint.setColor(getResources().getColor(R.color.orange));

        mOutCircleRaduis = LibCalcUtil.dp2px(getContext(), 80);
        mInCicleRadius = LibCalcUtil.dp2px(getContext(), 40);
    }

    @Override
    protected void onSizeChanged(int w, int h, int oldw, int oldh) {
        super.onSizeChanged(w, h, oldw, oldh);
        mWidth = w;
        mHeight = h;
    }

    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        canvas.translate(mWidth / 2, mHeight / 2);
        //画外围大圆
        canvas.drawCircle(0, 0, mOutCircleRaduis, mOutCirclePaint);
        //画里面小圆
        canvas.drawCircle(0, 0, mInCicleRadius, mInCirclePaint);
    }

    /**
     * 开始动画
     */
    public void playAnimation() {
        if (mAnimationSet == null) {
            mAnimationSet = new AnimatorSet();

            //大圆半径变更动画
            ValueAnimator anim1 = ValueAnimator.ofFloat(0, mOutCircleRaduis);
            //大圆透明度变更动画
            ValueAnimator anim2 = ValueAnimator.ofInt(256, 0);

//            //沿Y轴旋转动画
//            ObjectAnimator anim3 = ObjectAnimator.ofFloat(this, "rotationY", 0f, 360f);
//            //设置一起执行动画
//            mAnimationSet.playTogether(anim1, anim2, anim3);
//            anim3.setRepeatCount(ValueAnimator.INFINITE);

            mAnimationSet.playTogether(anim1, anim2);

            //设置重复执行动画
            anim1.setRepeatCount(ValueAnimator.INFINITE);
            anim2.setRepeatCount(ValueAnimator.INFINITE);

            anim1.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
                @Override
                public void onAnimationUpdate(ValueAnimator animation) {
                    if (animation != null) {
                        //改变外围大圆半径
                        mOutCircleRaduis = (float) animation.getAnimatedValue();
                    }
                }
            });

            anim2.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
                @Override
                public void onAnimationUpdate(ValueAnimator animation) {
                    //改变外围大圆透明度
                    mTransparency = (int) animation.getAnimatedValue();
                }
            });
        }

        //启动动画
        mAnimationSet.setDuration(2000).start();

        if (mHandler == null) {
            mHandler = new Handler();
        }
        mHandler.postDelayed(new Runnable() {
            @Override
            public void run() {
                mCircleColor = Color.argb(mTransparency, 255, 143, 5);
                mOutCirclePaint.setColor(mCircleColor);

                //重绘
                postInvalidate();
                mHandler.postDelayed(this, 50);
            }
        }, 50);

    }
}

执行效果如下

Notice: 代码解释基本都在注释上

希望对正在学习自定义View 和动画的小伙伴有所帮助~~！