图片轮轮播器的时候,通常有几个点点指示当前是第几张图片,有的实现是切好几张图片,但这样的点点不能修改样式大小,不够灵活。由于这是一个很常用的控件,于是就写了一个自定义控件,功能如下:
1、单独调用。
2、可以控制每个点大小。
3、有内环、处环,效果好。
4、可以控制点点的间距。
5、控制哪个点被选中。
6、动态控制有几个点。
效果如下:
自定义View代码:
import android.content.Context; import android.content.res.TypedArray; import android.graphics.Canvas; import android.graphics.Paint; import android.graphics.Paint.Style; import android.util.AttributeSet; import android.view.View; import android.widget.LinearLayout; /** * 滑动图片点点指示器 * * @author zhougang * * 2014-1-17 下午5:23:17 */ public class DotIndicatorView extends View { private Context mContext; private int innerColor; private int outerColor; private float size; private float distance; private int number; private int selectedIndex; private Paint mPaint1; private Paint mPaint2; private Paint mPaint3; private int border = 2; public DotIndicatorView(Context context) { super(context); } public DotIndicatorView(Context context, AttributeSet attrs) { super(context, attrs); mPaint1 = new Paint(); mPaint2 = new Paint(); mPaint3 = new Paint(); TypedArray typedArray = context.obtainStyledAttributes(attrs,R.styleable.DotIndicatorView); innerColor = typedArray.getColor(R.styleable.DotIndicatorView_innerColor, 0XFF0000); outerColor = typedArray.getColor(R.styleable.DotIndicatorView_outerColor, 0XFFFFFF); size = typedArray.getDimension(R.styleable.DotIndicatorView_size, 8); distance = typedArray.getDimension( R.styleable.DotIndicatorView_distance, 10); number = typedArray.getInteger(R.styleable.DotIndicatorView_number, 4); selectedIndex = typedArray.getInteger( R.styleable.DotIndicatorView_selectedIndex, 0); typedArray.recycle(); } @Override protected void onDraw(Canvas canvas) { super.onDraw(canvas); mPaint1.setStyle(Style.FILL); mPaint1.setColor(outerColor); mPaint1.setAntiAlias(true); mPaint2.setStyle(Style.FILL); mPaint2.setColor(innerColor); mPaint2.setAntiAlias(true); mPaint3.setColor(outerColor); mPaint3.setAntiAlias(true); mPaint3.setStyle(Style.STROKE); mPaint3.setStrokeWidth(2); for (int index = 0; index < number; index++) { if(number==1){ return ; } if (index == selectedIndex ) { canvas.drawCircle((index+1) * (distance+ size), size/2, size/2-border,mPaint2); canvas.drawCircle((index+1) * (distance+size), size/2, size/2-border,mPaint3); } else { canvas.drawCircle((index+1) * (distance+size), size/2, size/2-1,mPaint1); } } } public void setPosition(int position) { selectedIndex = position; invalidate(); } public void setNumber(int number) { this.number = number; invalidate(); } protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) { int desiredWidth = (int)(number*size +(number+1)*distance); int desiredHeight = (int)size; int widthMode = MeasureSpec.getMode(widthMeasureSpec); int widthSize = MeasureSpec.getSize(widthMeasureSpec); int heightMode = MeasureSpec.getMode(heightMeasureSpec); int heightSize = MeasureSpec.getSize(heightMeasureSpec); int width; int height; //Measure Width if (widthMode == MeasureSpec.EXACTLY) { //Must be this size width = widthSize; } else if (widthMode == MeasureSpec.AT_MOST) { //Can‘t be bigger than... width = Math.min(desiredWidth, widthSize); } else { //Be whatever you want width = desiredWidth; } //Measure Height if (heightMode == MeasureSpec.EXACTLY) { //Must be this size height = heightSize; } else if (heightMode == MeasureSpec.AT_MOST) { //Can‘t be bigger than... height = Math.min(desiredHeight, heightSize); } else { //Be whatever you want height = desiredHeight; } //MUST CALL THIS setMeasuredDimension(width, height); } }
<com.view.PagerSlidingTabStripandroid:id="@+id/tabs"android:layout_width="fill_parent"android:layout_height="40dip"android:background="#009ABB"app:pstsDividerColor="#00000000"app:pstsIndicatorColor="#FF0000"app:pstsIndicatorHeight="1dip"app:pstsShouldExpand="true" />
记住调用的布局文件中要添加自定义命名空间:
xmlns:app="http://schemas.android.com/apk/res-auto"
自定义的属性需要在res/values/attrs.xml中定义:
<?xml version="1.0" encoding="utf-8"?><resources><declare-styleable name="PagerSlidingTabStrip"><attr name="pstsIndicatorColor" format="color" /><attr name="pstsUnderlineColor" format="color" /><attr name="pstsDividerColor" format="color" /><attr name="pstsIndicatorHeight" format="dimension" /><attr name="pstsUnderlineHeight" format="dimension" /><attr name="pstsDividerPadding" format="dimension" /><attr name="pstsTabPaddingLeftRight" format="dimension" /><attr name="pstsScrollOffset" format="dimension" /><attr name="pstsTabBackground" format="reference" /><attr name="pstsShouldExpand" format="boolean" /><attr name="pstsTextAllCaps" format="boolean" /></declare-styleable><declare-styleable name="DotIndicatorView"><attr name="innerColor" format="color" /><attr name="outerColor" format="color" /><!-- 圆点大小 --><attr name="size" format="dimension" /><!-- 每个点之间的间隔 --><attr name="distance" format="dimension" /><!-- 有几个点 --><attr name="number" format="integer" /><!-- 哪一个点被选中 --><attr name="selectedIndex" format="integer" /></declare-styleable></resources>
原文:http://blog.csdn.net/nnmmbb/article/details/22039949