Android仿微软系统加载动画效果-技术圈

效果图：

实现步骤：

初始化五个圆球分别设置中心点,方便画圆
利用ValueAnimator的值变化来获取旋转角度
onDraw来分别画每个圆

具体代码实现:

1、创建Circle对象

package com.sjl.keeplive.track;
import android.graphics.Canvas;import android.graphics.Paint;import android.graphics.PointF;
public class Circle {    private PointF center;    private float radius;
    public Circle() {        center = new PointF();    }
    /**     * 设置圆球半径     */    public void setRadius(float radius) {        this.radius = radius;    }
    /**     * 设置中心点     *     * @param x     * @param y     */    public void setCenter(float x, float y) {        center.set(x, y);    }
    public void draw(Canvas canvas, Paint paint) {        canvas.drawCircle(center.x,center.y,radius,paint);    }}

2、自定义MinSoftLoadingView实现代码

package com.sjl.keeplive.track;
import android.animation.ValueAnimator;import android.content.Context;import android.graphics.Canvas;import android.graphics.Color;import android.graphics.Paint;import android.graphics.PointF;import android.support.annotation.Nullable;import android.util.AttributeSet;import android.view.View;
public class MinSoftLoadingView extends View {    private int circleCount = 5;    private Circle[] circles;    private Paint paint;    private int width;    private int height;    private PointF center;    private float circleRadius;    private float[] rotates;    private float roateRadius;
    public MinSoftLoadingView(Context context) {        this(context, null);    }
    public MinSoftLoadingView(Context context, @Nullable AttributeSet attrs) {        this(context, attrs, 0);    }
    public MinSoftLoadingView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {        super(context, attrs, defStyleAttr);        paint = new Paint();        paint.setAntiAlias(true);        paint.setColor(Color.WHITE);        //每个点旋转的角度        rotates = new float[circleCount];    }
    @Override    protected void onLayout(boolean changed, int left, int top, int right, int bottom) {        super.onLayout(changed, left, top, right, bottom);        width = getWidth();        height = getHeight();        center = new PointF(width / 2.0f, height / 2.0f);        //旋转扫描半径        roateRadius = Math.min(width, height);        //圆球最大的那个半径        circleRadius = roateRadius / 10.0f;        initCircle();    }
    /**     * 初始化5个圆球     */    private void initCircle() {        circles = new Circle[circleCount];        for (int i = 0; i < circleCount; i++) {            circles[i] = new Circle();            circles[i].setCenter(center.x, center.y - roateRadius / 2 + circleRadius);            circles[i].setRadius(circleRadius - circleRadius * i / 5);        }        //开始执行动画        startAnimation();    }
    private void startAnimation() {        for (int i = 0; i < circleCount; i++) {            final int index = i;            ValueAnimator animator = ValueAnimator.ofFloat(0, 360);            animator.setRepeatCount(ValueAnimator.INFINITE);//重复            animator.setDuration(2000);            animator.setStartDelay(index * 100); //每一个随后的延迟时间            animator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {                @Override                public void onAnimationUpdate(ValueAnimator animation) {                    rotates[index] = (float) animation.getAnimatedValue();                    invalidate();                }            });            animator.start();        }    }
    @Override    protected void onDraw(Canvas canvas) {        super.onDraw(canvas);        for (int i = 0; i < circleCount; i++) {            canvas.save();            canvas.rotate(rotates[i], center.x, center.y);            circles[i].draw(canvas, paint);            canvas.restore();        }    }}

3、布局文件中使用

<com.sjl.keeplive.track.MinSoftLoadingView        android:layout_width="60dp"        android:layout_height="60dp"        android:layout_gravity="center"/>

核心思想就是让每个球出发的时间不同,这样每个球锁旋转的位置也不同,就形成了一种视觉差!如果把* animator.setStartDelay(index * 100)*的时间改的大一些就可以看得更明显了!

到这里就结束啦.