loading系列之左右两侧小圆点向两侧移动

目录

效果

思路

实现

效果:

思路:

实现：按照步骤拆解，首先创建6个实心小圆点，布局文件就不贴了，主要是代码逻辑。

 /***
     *创建六个小圆点
     */
    public void getPoints(){
        for(int i=0;i<6;i++){
            ImageView point=new ImageView(this);
            point.setBackgroundResource(R.drawable.round_bg);
            LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(30, 30);
            params.gravity= Gravity.CENTER_VERTICAL;
            ll_loading_1.addView(point,params);
            points.add(point);

        }
//        startLeftMove();
        //开启动画
        startAnimation();
    }

步骤二、三：先从最左侧小圆点开始执行动画，执行一段距离之后再通过相反的动画将其复位到起点。

public void startAnimation(){
        //先从左侧开始
        startLeft();

    }
//最左侧小圆点沿着X轴先向左平移80，然后复位结束左侧动画，之后开启右侧平移动画
public void startLeft(){
        final ImageView left=points.get(0);
        ObjectAnimator leftmove1=ObjectAnimator.ofFloat(left,"translationX",-80);
        AnimatorSet set=new AnimatorSet();
        set.setDuration(400);
        set.play(leftmove1);
        set.start();
        set.addListener(new Animator.AnimatorListener() {
            @Override
            public void onAnimationStart(Animator animation) {

            }

            @Override
            public void onAnimationEnd(Animator animation) {
                ObjectAnimator    leftmove2=ObjectAnimator.ofFloat(left,"translationX",0);
                AnimatorSet set=new AnimatorSet();
                set.setDuration(400);
                set.play(leftmove2);
                set.start();
                set.addListener(new Animator.AnimatorListener() {
                    @Override
                    public void onAnimationStart(Animator animation) {

                    }

                    @Override
                    public void onAnimationEnd(Animator animation) {
                        //左侧圆点复位，开始右侧动画
                        startRight();
                    }

                    @Override
                    public void onAnimationCancel(Animator animation) {

                    }

                    @Override
                    public void onAnimationRepeat(Animator animation) {

                    }
                });
//
            }

            @Override
            public void onAnimationCancel(Animator animation) {

            }

            @Override
            public void onAnimationRepeat(Animator animation) {

            }
        });
    }

步骤四：左侧平移动画结束之后开始右侧平移动画，原理同左侧小圆点平移过程。

@Override
public void onAnimationEnd(Animator animation) {
     //左侧圆点复位，开始右侧动画
     startRight();
}

步骤五：右侧平移动画结束之后重新开启左侧动画过程

步骤六：重复上述过程

---

上面的代码有些问题，稍后会对代码的逻辑进行修改

代码详见：https://github.com/henkun614/demos

---