Android自定义drawable-----各种各样的Loading效果

接着我们上一年的博眼球的主题，接下来的这篇我们仍然以UI效果为题开展主题推送，相信小伙伴们或多或少都做过App开发，App中最常见的一类UI效果，自然就是各种各样的Loading了，这篇文章我们就以Loading入手，介绍一种加载动画的思路，废话不多，直接进入正题。

以上图为例，要实现一个动画，我们首先应该观察，在整个动画过程中，那些是变化的，那些是静止的，从而考虑策略，进行实现。仔细观察不难看出，这是一个圆弧以圆心为中心旋转所构成的动画。由此我们可以看出，在该动画中圆弧的弧度是没有变化的，只是绘制圆弧后，画布在旋转，这样我们就可以实现该动画效果

完整代码如下:

    public class RingRotateDrawable extends Drawable {
    private Paint mArcPaint;
    private int mRotate;

    public static final String KEY_ROTATE = "ROTATE";

    private ValueAnimator mValueAnimator;

    public RingRotateDrawable(int color) {
        super();
        mArcPaint = new Paint();
        mArcPaint.setColor(color);
        mArcPaint.setStrokeWidth(10);
        mArcPaint.setStyle(Paint.Style.STROKE);
    }

    @Override
    public void draw(@NonNull Canvas canvas) {
        canvas.rotate(mRotate,getBounds().left+getBounds().width()/2,getBounds().top+getBounds().height()/2);
        RectF rectF = new RectF(getBounds().left+10,getBounds().top+10,getBounds().right-10,getBounds().bottom-10);
        canvas.drawArc(rectF, 0, 330, false, mArcPaint);
    }

    @Override
    public void setAlpha(int alpha) {

    }

    @Override
    public void setColorFilter(@Nullable ColorFilter colorFilter) {

    }

    @Override
    public int getOpacity() {
        return PixelFormat.TRANSLUCENT;
    }

    public void start() {
        PropertyValuesHolder mPropertyRotate = PropertyValuesHolder.ofInt(KEY_ROTATE, 0, 360);
        mValueAnimator = new ValueAnimator();

        mValueAnimator.setValues(mPropertyRotate);
        mValueAnimator.setDuration(1000);
        mValueAnimator.setRepeatMode(ValueAnimator.RESTART);
        mValueAnimator.setRepeatCount(1000);
        mValueAnimator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
            @Override
            public void onAnimationUpdate(ValueAnimator animation) {
                mRotate = (int) animation.getAnimatedValue(KEY_ROTATE);
                invalidateSelf();
            }
        });
        mValueAnimator.start();
    }
}

根据上述原理，我们还可以实现如下花式Loading，大家自行尝试下吧。

[PS:简单的摆了一下，布局随便拖的，凑合看！]