自定义控件Indicator

来源：互联网发布：2015年网络作家排行榜编辑：程序博客网时间：2024/06/05 03:54

点击打开链接

说一下思路：

在ViewPager翻动的时候，会调用

01.public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels);

其中positionOffset为翻动的百分比，所以只要将这个参数传入自定义控件，就可以计算出实心圆点的坐标

实战：

PagerIndicator.java

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 PagerIndicator extends View {// 空心圆半径private int RADIUS = 10;// 空心圆画笔private Paint mBgPaint;// 实心圆画笔（当前页）private Paint mPaint;// 圆点个数,默认为5,设计布局时可以预览private int mCount = 5;// 当前实心圆的位置private int mPosition;// 偏移量（百分比）private float mOffset;// 第一个空心圆的圆心坐标private int startY;private int startX;@Overrideprotected void onDraw(Canvas canvas) {super.onDraw(canvas);// 画出空心的小圆点for (int i = 0; i < mCount; i++) {canvas.drawCircle(startX + i * 3 * RADIUS, startY, RADIUS, mBgPaint);}// 画出指示当前位置的原点,由于高度固定，所以只计算了X坐标float x = startX + (mPosition + mOffset) * 3 * RADIUS;canvas.drawCircle(x, startY, RADIUS - 1, mPaint);}@Overrideprotected void onSizeChanged(int w, int h, int oldw, int oldh) {// 获取第一个空心圆的圆心坐标startX = w - 3 * RADIUS * mCount;startY = h / 2;super.onSizeChanged(w, h, oldw, oldh);}// 设置圆个数public void setCount(int count) {mCount = count;}// 获取偏移量并重绘indicatorpublic void onPageScrolled(int position, float offset) {mPosition = position;mOffset = offset;invalidate();}// 创建带AttributeSet参数的构造方法使控件可以直接拖动到布局中并预览public PagerIndicator(Context context, AttributeSet attrs) {super(context, attrs);initPaint();}// 初始化画笔private void initPaint() {// 空心圆画笔mBgPaint = new Paint();mBgPaint.setColor(Color.GRAY);mBgPaint.setAntiAlias(true);mBgPaint.setStyle(Paint.Style.STROKE);mBgPaint.setStrokeWidth(2);// 实心圆画笔mPaint = new Paint();mPaint.setColor(Color.rgb(197, 135, 87));mPaint.setAntiAlias(true);}}

布局的设置：

<?xml version="1.0" encoding="utf-8"?><RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="match_parent"    android:layout_height="100dp" >    <android.support.v4.view.ViewPager        android:id="@+id/banner_pager"        android:layout_width="match_parent"        android:layout_height="100dp"        android:background="#C0FFFF" />    <这里改成你自己的包名.PagerIndicator        android:id="@+id/pagerIndicate1"        android:layout_width="match_parent"        android:layout_height="20dp"        android:background="#C0C0C0"        android:layout_alignParentBottom="true"        android:layout_alignParentRight="true" /></RelativeLayout>

在使用到的地方：

初始化的方法，反正只要比使用早调用到就行

private void initPagerIndicator() {mPagerIndicator = (PagerIndicator) mLayout.findViewById(R.id.pagerIndicate1);//此处直接设置为7，有需求可自己更改成其他值mPagerIndicator.setCount(7);}

设置ViewPager监听器：

mPager.setOnPageChangeListener(new OnPageChangeListener() {@Overridepublic void onPageSelected(int arg0) {}@Overridepublic void onPageScrolled(int position, float offset, int arg2) {//重点在这里，调用控件内的方法mPagerIndicator.onPageScrolled(position , offset);}@Overridepublic void onPageScrollStateChanged(int arg0) {}});

完成的效果：

0 0