ViewTreeObserver应用实例

Android实现自定义引导页（实现跟随式小圆点效果）

实现效果图如下

输入图片说明

具体实现过程可参看链接：http://www.jianshu.com/p/adb21180862a

这里主要看下实现跟随式小圆点效果的思路及知识点

实现小圆点动态跟随的思路：首要的是获得两个点之间的距离【mDistance 】，然后根据页面的移动，通过设置小圆点的 leftMargin 实现动态跟随。【根据mDistance * (position + positionOffset) 可以实时更新小白点的位】。

需要注意的是：在onCreate()中直接获得小白点（实时跟随的小圆点）的左边距 getLeft()结果为0，这是因为View组件布局要在onResume回调后完成。所以，我们可以根据下面方法来获取
//在布局发生改变或者某个视图的可视状态发生改变时调用该事件。但此方法会被多次调用，因此需要在获取到视图的宽度和高度后执行 remove 方法移除该监听事件。

mLight_dots.getViewTreeObserver().addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener() {
@Override
public void onGlobalLayout() {
//获得两个圆点之间的距离
mDistance = mIn_ll.getChildAt(1).getLeft() - mIn_ll.getChildAt(0).getLeft();
mLight_dots.getViewTreeObserver()
.removeGlobalOnLayoutListener(this);
}
});

监听页面的移动情况

mIn_vp.addOnPageChangeListener(new ViewPager.OnPageChangeListener() {
@Override
public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
//页面滚动时小白点移动的距离，并通过setLayoutParams(params)不断更新其位置
float leftMargin = mDistance * (position + positionOffset);
RelativeLayout.LayoutParams params = (RelativeLayout.LayoutParams) mLight_dots.getLayoutParams();
params.leftMargin = (int) leftMargin;
mLight_dots.setLayoutParams(params);
}

        @Override
        public void onPageSelected(int position) {
            //页面跳转时，设置小圆点的margin
            float leftMargin = mDistance * position;
            RelativeLayout.LayoutParams params = (RelativeLayout.LayoutParams) mLight_dots.getLayoutParams();
            params.leftMargin = (int) leftMargin;
            mLight_dots.setLayoutParams(params);
        }

        @Override
        public void onPageScrollStateChanged(int state) {

        }
    });
}

在页面移动过程中,根据mDistance * (position + positionOffset) 可以实时更新小白点的位置。

另外我们可以了解下getViewTreeObserver的用法，ViewTreeOserver用于注册可被全局通知的Listener在ViewTree状态发生变化时。这些Listener包括View开始绘制、窗口焦点发生变化等场景。