自定义ViewPagerIndicator（上）

大家可以参考ViewPagerIndicator开源库，看不太懂的可以先看我这篇博客，我这篇是一步一步从最基础的做起到封装成库
（1）创建一个类，继承View，这是自定义的第一步

public class PagerIndicator extends View {}

（2）添加两个参数的构造方法，初始化三个画笔

public PagerIndicator(Context context, AttributeSet attrs) {
        super(context, attrs);
        // 设置画笔抗锯齿
        paint = new Paint(Paint.ANTI_ALIAS_FLAG);
        paint.setColor(Color.RED);
        paint2 = new Paint(Paint.ANTI_ALIAS_FLAG);
        paint2.setColor(Color.BLACK);
        // 空心
        paint2.setStyle(Style.STROKE);
        // 画笔宽度
        paint2.setStrokeWidth(2);
        paint3 = new Paint(Paint.ANTI_ALIAS_FLAG);
        paint3.setColor(Color.GRAY);
    }

（3）绘制静态界面

    private static final int RADIUS = 30;
    private static final int CX = 90;
    private static final int CY = 60;
    @Override
    protected void onDraw(Canvas canvas) {
    // for循环画四个小圆
        for (int i = 0; i < 4; i++) {
        // 指定圆的x，y坐标及圆的半径RADIUS
            canvas.drawCircle(CX + 3 * RADIUS * i, CY, 
                    RADIUS, paint);
                    // 画圆的外圈
            canvas.drawCircle(CX + 3 * RADIUS * i, CY, 
                    RADIUS, paint2);
        }
        // 滑动的小圆点
        canvas.drawCircle(CX + offset, CY, RADIUS, paint3);

    }

（4）在PagerIndicator中增加move()方法，改变圆点移动的横坐标

    public void move(int position, float arg) {
        offset = (int) (arg * 3 * RADIUS) + 
                position * 3 * RADIUS;
        invalidate();
    }

（5）在主程序的xml布局拉上我们的自定义控件

 <com.xinbo.demo.PagerIndicator
        android:id="@+id/pagerIndicator1"
        android:layout_width="match_parent"
        android:layout_height="100dp"
        android:layout_alignParentLeft="true"
        android:layout_alignParentTop="true" />

（6）在主程序中的ViewPager中调用move方法

    pager.setOnPageChangeListener(new OnPageChangeListener() {
            @Override
            public void onPageScrolled(int position, float 
            arg1, int arg2) {
                indicatorView.move(position, arg1);
            }
            @Override
            public void onPageSelected(int arg0) {
            }


            @Override
            public void onPageScrollStateChanged(int arg0) {
            }
        });

代码地址：
开源库地址：http://download.csdn.net/download/sjc1010592550/9090163
下一篇我们来把图封装成库