ViewPager的指示标跟随ViewPager滑动而滑动

标签：viewpager指示线

1. 实现效果：

大体上的效果如上，因为是项目中的一部分，所以只截取了部分。

2. 思路

          其实最开始，我是想通过动态的移动一个控件去实现的，但是试了试scrollBy和scrollTo好像没什么卵用，我就忧伤了，这尼玛怎么实现？

因为开始就没有想过用动画去实现移动，而且用动画实现的效果网上有现成的代码了，所以再写没什么意思啊。

我有篇文章专门谈到过关于OnPageChangeListener中的几个方法，各有什么用，大家可以移步去看看。其实今天这个东西没什么很玄的东西，自己想通了之后就觉得这也太简单了，如果我写篇博客，在技术大牛们面前估计毛线都不值一提啊，但是我还是想写。。。

好了，啰嗦了那么多，其实最后我的实现方式就是通过自定义View来实现的，代码很简单。

import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.util.AttributeSet;
import android.view.View;

public class RedCursorView extends View {

	private int cursorColor = Color.RED; // 线的颜色
	private int counts = 2; // 被分成了几块
	private float posX = 0f; // 当前X坐标的位置
	private Paint paint;
	
	public RedCursorView(Context context, AttributeSet attrs, int defStyleAttr) {
		super(context, attrs, defStyleAttr);
		init();
	}

	public RedCursorView(Context context, AttributeSet attrs) {
		super(context, attrs);
		init();
	}

	public RedCursorView(Context context) {
		super(context);
		init();
	}

	private void init() {
		// 初始化画笔
		paint = new Paint();
		paint.setAntiAlias(true);
		paint.setDither(true);
		paint.setColor(cursorColor);
	}
	
	/**
	 * 设置ViewPager有几块
	 * @param counts
	 */
	public void setCounts(int counts) {
		this.counts = counts;
	}
	
	/**
	 * 设置坐标
	 * @param pos 当前的item
	 * @param rate 变化率
	 */
	public void setXY(int pos, float rate) {
		int single = getMeasuredWidth() / counts;
		posX = pos * single + single * rate;
		invalidate();
	}
	
	@Override
	protected void onDraw(Canvas canvas) {
		super.onDraw(canvas);
		paint.setStrokeWidth(getMeasuredHeight());
		int width = getMeasuredWidth() / counts - 2;
		canvas.drawLine(posX, 0, posX + width, 0, paint);
	}
	
}

一看就懂，调用的时候只用调用：

@Override
public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
	cursor.setXY(position, positionOffset);
}

ViewPager的指示标跟随ViewPager滑动而滑动

标签：viewpager指示线

原文地址：http://blog.csdn.net/zhoudailiang/article/details/46553477