在上篇播客中实现了textview的字体变色，在上一篇的基础上结合viewpager实现一个变色的viewpager指示器，效果如下；
device-2017-06-25-172024.gif
上面指示器的文字在这里是动态创建添加到LinearLayout布局中的，
for (int i = 0; i < items.length; i++) {
//动态添加颜色跟踪的textview
LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(ViewGroup.LayoutParams.WRAP_CONTENT,
ViewGroup.LayoutParams.WRAP_CONTENT);
params.weight = 1;
ColorTextView colorTextView = new ColorTextView(this);
//设置颜色
colorTextView.setTextSize(20);
colorTextView.setChangeColor(Color.RED);
colorTextView.setText(items[i]);
//把新的加入LinearLayout容器中
colorTextView.setLayoutParams(params);
mIndicatorContainer.addView(colorTextView);
//加入集合
mIndicator.add(colorTextView);
}
创建完成后给viewpager设置相应的适配器和添加一个滑动监听就可以了，
设置viewpager适配器，
mViewPager.setAdapter(new FragmentPagerAdapter(getSupportFragmentManager()) {
@Override
public Fragment getItem(int position) {
return ViewFragment.newInstance(items[position]);
}
@Override
public int getCount() {
return items.length;
}
@Override
public void destroyItem(ViewGroup container, int position, Object object) {
super.destroyItem(container, position, object);
}
});
设置viewpager滑动监听，
mViewPager.addOnPageChangeListener(new ViewPager.OnPageChangeListener() {
@Override
public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
ColorTextView left = mIndicator.get(position);
left.setDirection(ColorTextView.Direction.RIGHT_TO_LEFT);
left.setCurrentProgress(1 - positionOffset);
try {
ColorTextView right = mIndicator.get(position + 1);
right.setDirection(ColorTextView.Direction.LEFT_TO_RIGHT);
right.setCurrentProgress(positionOffset);
} catch (Exception e) {
e.printStackTrace();
}
}
@Override
public void onPageSelected(int position) {
}
@Override
public void onPageScrollStateChanged(int state) {
}
});
这里用的是addOnPageChangeListener，当然用setOnPageChangeListener也可以，不过这个方法已经过时了，在onPageScrolled方法中要注意float positionOffset，它是根据滑动时0-1的变化的值，所以刚好根据这个值计算当前的进度值，在设置右边变色的时候，position + 1在最后一个的时候会导致数组角标越界，要做一个异常的捕获，用if来判断也可以，这样整个效果就实现了。
源码地址：http://pan.baidu.com/s/1nvyp0Hb
