仿百度搜索加载动画

   <p>因为百度的加载动画不是经常出现，以前就想做一个，今天有时间做了一个类似效果的加载动画，给大家分享一下。</p>    <h3>这是百度的效果</h3>    <p style="text-align:center"><img src="https://simg.open-open.com/show/a5cd5d2879ce8bfec59ff99412de3434.gif"></p>    <p style="text-align:center">百度效果</p>    <p>这是我上仿百度的效果</p>    <p style="text-align:center"><img src="https://simg.open-open.com/show/b453c820728fee84ebcfc7e791f7a1ae.gif"></p>    <p style="text-align:center">demo效果</p>    <h3>相关代码</h3>    <pre>  <code class="language-java">public class BaiduProgress extends View {  /**   * 开始执行的第一个动画的索引，   * 由于第一个和第二个同时当执行，   * 当第一遍执行完毕后就让第一个停下来在中间位置，换原来中间位置的第三个开始执行动画，   * 以此类推，当第二遍执行完毕后第二个停下来，中间位置的开始执行动画。   */    private int changeIndex = 0;  /** * 交换执行动画的颜色数组 */   private int[] colors = new int[]{    getResources().getColor(R.color.color_red),   getResources().getColor(R.color.color_blue),   getResources().getColor(R.color.color_black)};     /** * 动画所执行的最大偏移量（即中间点和最左边的距离） */   private Float maxWidth = 150f;   /** * 三个圆的半径 *   /private Float radius = 20f;   /** * 当前偏移的X坐标 */   private Float currentX = 0f;   /** * 画笔 */private Paint paint;   /** * 属性动画 */   private ValueAnimator valueAnimator;   public BaiduProgress(Context context) {    this(context, null);   }   public BaiduProgress(Context context, AttributeSet attrs) {       this(context, attrs, 0);   }   public BaiduProgress(Context context, AttributeSet attrs, int defStyleAttr) {       super(context, attrs, defStyleAttr);       startAnimator();   }      /** * 用属性动画实现位移动画 */    private void startAnimator() {       valueAnimator = ValueAnimator.ofFloat(0f, maxWidth, 0);    valueAnimator.addUpdateListener(    new   ValueAnimator.AnimatorUpdateListener() {           @Override            public void onAnimationUpdate(ValueAnimator animation) {             currentX = (Float) animation.getAnimatedValue();                   invalidate();       }   });   valueAnimator.addListener(new Animator.AnimatorListener() {       @Override       public void onAnimationStart(Animator animation) {      }   @Override       public void onAnimationEnd(Animator animation) {       }       @Override       public void onAnimationCancel(Animator animation) {        }       @Override       public void onAnimationRepeat(Animator animation) {           changePoint(changeIndex);       }   });     valueAnimator.setInterpolator(new LinearInterpolator());   paint = new Paint(Paint.ANTI_ALIAS_FLAG);   valueAnimator.setRepeatCount(-1);valueAnimator.setRepeatMode(ValueAnimator.REVERSE);   valueAnimator.setDuration(1000);   valueAnimator.start();       @Overrideprotected void onDraw(Canvas canvas) {       super.onDraw(canvas);       int centerX = getWidth() / 2;       int centerY = getHeight() / 2;       /**画左边的圆**/       paint.setColor(colors[0]);       canvas.drawCircle(centerX - currentX, centerY, radius, paint);       /**画右边的圆**/       paint.setColor(colors[1]);    canvas.drawCircle(centerX + currentX, centerY, radius, paint);      /**画中间的圆**/       paint.setColor(colors[2]);      canvas.drawCircle(centerX, centerY, radius, paint);}     /** * 每次让先执行动画的目标和中间停止的动画目标交换 * * @param a 最先执行 的动画的索引 */   private void changePoint(int a) {       int temp = colors[2];       colors[2] = colors[a];       colors[a] = temp;      if (a == 0) {           changeIndex = 1;       } else {           changeIndex = 0;      }}     /** * 在View销毁时停止动画 */   @Overrideprotected void onDetachedFromWindow() {       super.onDetachedFromWindow();       valueAnimator.cancel();}</code></pre>    <h3>重点</h3>    <p>1、中间的圆固定不动，两边的圆对称运动。</p>    <p>2、每次当两边的圆在中点相遇，则改变颜色。</p>    <p> </p>    <p> </p>    <p>来自：http://www.jianshu.com/p/e546df8f90bc</p>    <p> </p>