Android 自定义 Loading加载动画

版权声明:随便转载 共同进步! https://blog.csdn.net/MacaoPark/article/details/82356613

最近在家休息,闲暇时间把自定义的东西翻出来好好研究一下,老规矩先看一下效果。

效果图
这里写图片描述

怎么样很萌吧?

实现思路
这个我采用的是用属性动画来实现的,主要是利用AnimatorUpdateListener得到动画执行每一帧所返回的值,重新设置高度。 在通过 addListener,监听每次动画执行的过程,从而赋予新的图片。

实现过程

(1) 先自定义一个ImageView

public class LoadingImageView extends android.support.v7.widget.AppCompatImageView {
  private int mTop; 
    public LoadingImageView(Context context) {
        super(context);
        Init();
    }


    public LoadingImageView(Context context, AttributeSet attrs) {
        super(context, attrs);
        Init();
    }

    public LoadingImageView(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        Init();
    }

}

(2) 确定控件的位置

    @Override
    protected void onLayout(boolean changed, int left, int top, int right, int bottom) {
        super.onLayout(changed, left, top, right, bottom);
        mTop = top;
    }

(3) Init() 中的方法 有注释呦

  private void Init() {
        ValueAnimator valueAnimator = ValueAnimator.ofInt(0, 100, 0);
        valueAnimator.setRepeatMode(ValueAnimator.RESTART); //倒序执行
        valueAnimator.setRepeatCount(ValueAnimator.INFINITE); //无限循环
        valueAnimator.setDuration(1300); //时长
        valueAnimator.setInterpolator(new AccelerateDecelerateInterpolator()); //插值器
        valueAnimator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
            @Override
            public void onAnimationUpdate(ValueAnimator animation) {
                int dx = (Integer) animation.getAnimatedValue(); //获取动画执行每一帧所返回的值
                setTop(mTop - dx); //设置高度
            }
        });


        valueAnimator.addListener(new Animator.AnimatorListener() {
            @Override
            public void onAnimationStart(Animator animation) {
                setImageDrawable(getResources().getDrawable(R.mipmap.a));
            }

            @Override
            public void onAnimationEnd(Animator animation) {

            }

            @Override
            public void onAnimationCancel(Animator animation) {

            }

            @Override
            public void onAnimationRepeat(Animator animation) {
                mCurImageIndex++;
                switch (mCurImageIndex%ImageCount){
                    case 0:
                        setImageDrawable(getResources().getDrawable(R.mipmap.a));
                        break;
                    case 1:
                        setImageDrawable(getResources().getDrawable(R.mipmap.b));
                        break;
                    case 2:
                        setImageDrawable(getResources().getDrawable(R.mipmap.c));
                        break;
                }
            }
        });
        valueAnimator.start();
    }

被遗忘的常量

private int mCurImageIndex = 0;  //图片递增索引
private static int ImageCount = 3;// 图片的个数

应用 怎么使用这个自定义的View 从而实现这个效果

这里写图片描述

怎么样 是不是很简单呢

源码地址: https://download.csdn.net/download/macaopark/10644446

猜你喜欢

转载自blog.csdn.net/MacaoPark/article/details/82356613