绚丽加载中的自定义动画

使用简单，效果好看。

1、五条线动画

public class FiveLine extends View {
    private Paint paint;
    private boolean init = false;
    private float width = 0;
    private float height = 0;
    private ValueAnimator valueAnimator;
    private float numb = 0;
    private boolean stop = false;
    private float[] initLine = new float[]{0.6f, 0.3f, 0, 0.3f, 0.6f};

    public FiveLine(Context context, AttributeSet attrs) {
        super(context, attrs);
        paint = new Paint(Paint.ANTI_ALIAS_FLAG);
        paint.setStrokeWidth(10);
        paint.setColor(Color.parseColor("#ff0099cc"));
    }

    public void initLine(float[] floats) {
        if (floats.length >= 5) {
            this.initLine = floats;
        }
    }

    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        if (!init) {
            width = getWidth();
            height = getHeight();
            init = true;
            start();
        }
        numb = (Float) valueAnimator.getAnimatedValue();
        //三
        canvas.drawLine(width / 2, 0f + fx(numb + initLine[2]) * width, width / 2, height - fx(numb) * width, paint);
        //二
        canvas.drawLine(width / 3, 0f + fx(numb + initLine[1]) * width, width / 3, height - fx(numb + 0.3f) * width, paint);
        //一
        canvas.drawLine(width / 6, 0f + fx(numb + initLine[0]) * width, width / 6, height - fx(numb + 0.6f) * width, paint);
        //四
        canvas.drawLine(width / 3 * 2, 0f + fx(numb + initLine[3]) * width, width / 3 * 2, height - fx(numb + 0.3f) * width, paint);
        //第五根
        canvas.drawLine(width / 6 * 5, 0f + fx(numb + initLine[4]) * width, width / 6 * 5, height - fx(numb + 0.6f) * width, paint);
        if (valueAnimator.isRunning()) {
            invalidate();
        }
    }


    //分段周期函数，做为偏移量
    private float fx(float numb) {
        if (numb <= 0 && numb > -1) {
            numb = Math.abs(numb);
        }
        if (numb <= -1) {
            numb = numb + 2;
        }
        if (numb > 1) {
            numb = -numb + 2;
        }
        return numb;
    }

    public void start() {
        if (valueAnimator == null) {
            valueAnimator = getValueAnimator();
        } else {
            valueAnimator.start();
        }
        if (stop == false) {
            postDelayed(new Runnable() {
                @Override
                public void run() {
                    start();
                    invalidate();
                }
            }, valueAnimator.getDuration());
        }
    }

    public void stop() {
        this.stop = true;
    }

    private ValueAnimator getValueAnimator() {
        ValueAnimator valueAnimator = ValueAnimator.ofFloat(-1f, 1f);
        valueAnimator.setDuration(1500);
        valueAnimator.setInterpolator(new LinearInterpolator());
        valueAnimator.start();
        return valueAnimator;
    }
}

2、两球来回

public class PPTVLoading extends View {
    private Paint paint1;
   private Paint paint2;
   // default color
   private int color1 = Color.parseColor("#ff0099cc");
   private int color2 = Color.parseColor("#ff669900");

   private boolean init = false;
   private ValueAnimator valueAnimator;
   private float numb = 0;

   private boolean stop = false;

   private int R = 0;

   public PPTVLoading(Context context, AttributeSet attrs) {
      super(context, attrs);
      paint1 = new Paint(Paint.ANTI_ALIAS_FLAG);
      paint2 = new Paint(Paint.ANTI_ALIAS_FLAG);
      paint1.setColor(color1);
      paint2.setColor(color2);

   }

   @Override
   protected void onDraw(Canvas canvas) {
      super.onDraw(canvas);
      if (!init) {
         init = true;
         R = getWidth() / 8;
         start();
      }
      numb = (Float) valueAnimator.getAnimatedValue();
      if (numb < 0) {
         canvas.drawCircle((getWidth() - 2 * R) * (1 - Math.abs(numb)) + R,
               getHeight() / 2, R - 5, paint2);
         canvas.drawCircle((getWidth() - 2 * R) * Math.abs(numb) + R,
               getHeight() / 2,
               R - 5 * (float) Math.abs(Math.abs(numb) - 0.8), paint1);
      } else {
         canvas.drawCircle((getWidth() - 2 * R) * (1 - Math.abs(numb - 1))
               + R, getHeight() / 2, R - 5, paint1);
         canvas.drawCircle((getWidth() - 2 * R) * Math.abs(numb - 1) + R,
               getHeight() / 2,
               R - 5 * (float) Math.abs(Math.abs(numb) - 0.8), paint2);
      }
      if (valueAnimator.isRunning()) {
         invalidate();
      }
   }

   public void start() {
      if (valueAnimator == null) {
         valueAnimator = getValueAnimator();
      } else {
         valueAnimator.start();
      }
      if (stop == false) {
         postDelayed(new Runnable() {
            @Override
            public void run() {
               start();
               invalidate();
            }
         }, valueAnimator.getDuration());
      }
   }

   public void stop() {
      this.stop = true;
   }

   private ValueAnimator getValueAnimator() {
      ValueAnimator valueAnimator = ValueAnimator.ofFloat(-1f, 1f);
      valueAnimator.setDuration(1500);
      valueAnimator.setInterpolator(new LinearInterpolator());
      valueAnimator.start();
      return valueAnimator;
   }

}

更多更好的自定义动画在下面两个链接都可以都可以下载；感谢github让我找到精致资源，以此分享感谢原作者。

上面两个类，对应的是最下面的动画效果。

百度云资源

http://pan.baidu.com/s/1pKLAOkV

源头github资源

https://github.com/guohuanwen/AndroidLoadingAnimation

转载于:https://my.oschina.net/u/3015461/blog/916442