android 自定义view实现进度条加载效果

这个其实很简单,思路是这样的,就是拿view的宽度,除以点的点的宽度+二个点 之间的间距,就可以算出大概能画出几个点出来,然后就通过canvas画出点,再然后就是每隔多少时间把上面移动的点不断的去改变它的坐标就可以,

效果如下:

分析图:

代码如下:

package com.example.dotloadview;
import android.content.Context;
import android.graphics.Bitmap;
import android.graphics.BitmapFactory;
import android.graphics.Canvas;
import android.graphics.Paint;
import android.os.Handler;
import android.util.AttributeSet;
import android.view.View;
/**
 * Created by zhouguizhi on 6/18/15.
 */
public class DotLoadProgressView extends View {
    private boolean isStart = false;
    private int dotIndex =0;//点下面的角标
    private int dotNumber = 0;
    private Paint mPaint;
    private int paddingTop = 50;
    private int paddingBottom = 50;
    private int paddingLeft = 30;
    private int paddingRight = 30;
    private Handler mHandler  = new Handler();
    private long DELAY_TIME = 300;
    private Bitmap bitmap;
    private int itemDotSpace = 10;//二个点之间的距离
    private Bitmap moveBitmap ;
    private Runnable mRunnable = new Runnable() {
        @Override
        public void run() {
            if (dotNumber != 0){
                dotIndex = (dotIndex + 1) % dotNumber;
            }
            invalidate();
            mHandler.postDelayed(mRunnable, DELAY_TIME);
        }
    };
    public DotLoadProgressView(Context context, AttributeSet attrs) {
        super(context, attrs);
        moveBitmap = BitmapFactory.decodeResource(getResources(),R.drawable.active_dot);
        init();
    }
    private void init() {
        mPaint = new Paint(Paint.ANTI_ALIAS_FLAG);
        mPaint.setStyle(Paint.Style.FILL);
        mPaint.setDither(true);
        mPaint.setAntiAlias(true);
    }
    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        for(int i=0;i<dotNumber;i++){
            canvas.drawBitmap(bitmap,paddingLeft+i*itemDotSpace+bitmap.getWidth()*i,paddingTop,mPaint);
        }
        if(isStart){
            canvas.drawBitmap(moveBitmap,paddingLeft+dotIndex*itemDotSpace+moveBitmap.getWidth()*dotIndex,paddingTop,mPaint);
        }
    }
    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        int parentWidth = MeasureSpec.getSize(widthMeasureSpec);
        bitmap = BitmapFactory.decodeResource(getResources(),R.drawable.inactive_dot);
        setMeasuredDimension(parentWidth,bitmap.getHeight()+paddingTop+paddingBottom);
        int widthWithoutPadding = parentWidth - paddingLeft - paddingRight;
        dotNumber = calculateDotsNumber(widthWithoutPadding);
    }
    private int calculateDotsNumber(int width) {
        int number = (width / (itemDotSpace + bitmap.getWidth()));
        return number;
    }
    public void startProgress() {
        isStart = true;
        dotIndex = -1;
        mHandler.removeCallbacks(mRunnable);
        mHandler.post(mRunnable);
    }
    public void stopProgress() {
        isStart = false;
        mHandler.removeCallbacks(mRunnable);
        invalidate();
    }

    @Override
    protected void onAttachedToWindow() {
        super.onAttachedToWindow();
        startProgress();
    }
    @Override
    protected void onDetachedFromWindow() {
        super.onDetachedFromWindow();
        stopProgress();
    }
}

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">
    <com.example.dotloadview.DotLoadProgressView
        android:id="@+id/progress1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        />
</RelativeLayout>

最终的效果图还是这样的: