引导页圆点的滑动两种实现方式

首先看一下页面的布局：

就是通过向悬浮在viewpager上的LinearLayout里面添加ImageView,
添加是需要注意，不能将同一对象添加多次，所以每个图片都的创建然后再添加到LinearLayout里面去，在LinearLayout的最右边在放一个FrameLayout，也就是FocusImage（当前获得页面的指示器）。
方法一：用属性动画（不能实时跟随页面的滑动）
重点就是计算所添加图片相互之间的距离，其实就是先获得Linearlayout的两个ImageView的水平位置差:

m2PointWidth = mcontainer.getChildAt(1).getLeft()-mcontainer.getChildAt(0).getLeft();

这里也是要注意的，不能立即得到这个值，需要等界面都渲染完了之后才能得到。可以通过这种方式得到：

ViewTreeObserver treeObserver2=mcontainer.getViewTreeObserver();        treeObserver2.addOnGlobalLayoutListener(new OnGlobalLayoutListener() {            @Override            public void onGlobalLayout() {                mcontainer.getViewTreeObserver().removeOnGlobalLayoutListener(this);                 m2PointWidth = mcontainer.getChildAt(1).getLeft()-mcontainer.getChildAt(0).getLeft();                System.out.println("两个圆点之间的距离:" + m2PointWidth);            }        });

有时间会介绍几种计算获得控件大小的方法
然后再给ViewPager加PageChangeListener，就是在它的onPageSelected方法中去添加属性动画将FocusImage作为Target
之前说不能跟随滑动是因为该方法是在页面选中之后才会触发，
圆点移动计算：当前页position*两个小圆点的距离
属性动画就是滑动后停在那个位置，所以移动顺序0*m2PointWidthl—>1*m2PointWidthl—->2*m2PointWidthl, 反向也是类似
具体代码：

viewpager.addOnPageChangeListener(new OnPageChangeListener() {            @Override            public void onPageSelected(int pageindex) {                ObjectAnimator animator = ObjectAnimator.ofFloat(focusdot, "translationX", pageindex*m2PointWidthl);                animator.setDuration(600);                animator.start();            }            @Override            public void onPageScrolled(int arg0, float arg1, int arg2) {                // 再次添加动画            }            @Override            public void onPageScrollStateChanged(int arg0) {            }        });

方法二：用LayoutParam动画（可以实时跟随页面的滑动）
第二种方式和之前的那种前面的步骤其实一样，就是动画实现放在viewpager的pagerChangerListener中的方法不一样，而是放在onPageScrolled方法中，这个方法会在页面滑动时一直触发，所以才能跟随页面的滑动。
圆点移动计算：当前位置+手指滑动的距离=（小圆点间的距离当前页面position）+（小圆点间的距离*滑动的百分比positionOffset）

        viewpager.addOnPageChangeListener(new OnPageChangeListener() {            @Override            public void onPageSelected(int pageindex) {            }            @Override            public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {                // 再次添加动画                 int len = (int) (m2PointWidth * positionOffset) + position * m2PointWidth;                FrameLayout.LayoutParams params = (FrameLayout.LayoutParams) focusdot.getLayoutParams();// 获取当前蓝点的布局参数                params.leftMargin = len;// 设置左边距                focusdot.setLayoutParams(params);            }            @Override            public void onPageScrollStateChanged(int arg0) {            }        });

运行效果：
第一种

第二种