android 仿直播中的圆点加载效果

今天实现一个很多app中使用到的加载进度条的效果,可能我们平时数据加载都使用到的是系统自带的,但是也有很多app加载进度条的效果实现挺好看,就是三个点不停的水平跑而且是变换颜色的,其实这个效果很简单,

分析:

第一步:

第二步:

为了圆的颜色 大小,以及移动的距离都对外开放,采用了自定义属性的方式,当然也可以进行设置,

分析了后 代码就直接上了,

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <declare-styleable name="CirclePointLoadView">
        <attr name="leftPointColor" format="color|reference"></attr>
        <attr name="middlePointColor" format="color|reference"></attr>
        <attr name="rightPointColor" format="color|reference"></attr>
        <attr name="radius" format="integer|reference"></attr>
        <attr name="translationDistance" format="dimension|reference"></attr>
    </declare-styleable>
</resources>

这是自定义属性,左,中,右颜色,圆的半径,以及圆x轴移动的距离

CircleItemPointView.java

是每个子view的代码,很简单就是画了圆,然后设置了下paint的颜色而已

package com.circle.load;
import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Paint;
import android.support.annotation.Nullable;
import android.util.AttributeSet;
import android.view.View;
/**
 * Created by zhouguizhijxhz on 2018/5/29.
 */
public class CircleItemPointView  extends View {
    private Paint mPaint;
    private int mColor;
    public CircleItemPointView(Context context) {
        this(context,null);
    }

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

    public CircleItemPointView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        mPaint = new Paint();
        mPaint.setAntiAlias(true);
        mPaint.setDither(true);
    }

    @Override
    protected void onDraw(Canvas canvas) {
        int cx = getWidth()/2;
        int cy = getHeight()/2;
        canvas.drawCircle(cx,cy