android 圆形滚动,Android仿58双圆环滚动效果

首先感谢http://blog.csdn.net/nugongahou110/article/details/49159189 提供的思路，

在此基础上进行了修改，代码很详细直接上代码：

public class CircleView extends View {

private Paint mCirclePaint;

private Paint mTextPaint;

private Paint mArcPaint,mArcPaintt;

private Paint mArcPaint2,mArcPaint2t;

private int mCircleX;

private int mCircleY;

private float mCurrentAngle,mCurrentAngle2;

private RectF mArcRectF ,mArcRectF2,mArcRectFF,mArcRectF2F;

private float mStartSweepValue,mStartSweepValue2;

private float mTargetPercent;

private float mCurrentPercent;

private int mRadius,mRadius2;

private int mCircleBackground;

private int mRingColor;

private int mTextSize;

private int mTextColor;

public CircleView(Context context, AttributeSet attrs ,int defStyle) {

super(context, attrs,defStyle);

//自定义属性 values/attr

TypedArray typedArray = context.obtainStyledAttributes(attrs,R.styleable.PercentageRing);

//中间圆的背景颜色 默认为浅紫色

mCircleBackground = typedArray.getColor(R.styleable.PercentageRing_circleBackground, 0xffafb4db);

//外圆环的颜色 默认为深紫色

mRingColor = typedArray.getColor(R.styleable.PercentageRing_ringColor, 0xff6950a1);

//中间圆的半径 默认为60

mRadius = typedArray.getInt(R.styleable.PercentageRing_radius, 60);

mRadius2=mRadius-5;//跟外圆环相差5

//字体颜色 默认为白色

mTextColor = typedArray.getColor(R.styleable.PercentageRing_textColor, 0xffffffff);

//最后一定要调用这个 释放掉TypedArray

typedArray.recycle();

//初始化数据

init(context);

}

public CircleView(Context context, AttributeSet attrs) {

this(context, attrs,0);

}

public CircleView(Context context) {

this(context, null);

}

private void init(Context context){

//圆环开始角度 -90° 正北方向

mStartSweepValue = 0;

//圆环开始角度 -90° 正北方向

mStartSweepValue2 = -180;

//当前角度

mCurrentAngle = 0;

//覆盖圆环的角度

mCurrentAngle2=0;

//当前百分比

mCurrentPercent = 0;

//设置中心园的画笔

mCirclePaint = new Paint();

mCirclePaint.setAntiAlias(true);

mCirclePaint.setColor(mCircleBackground);

mCirclePaint.setStyle(Paint.Style.FILL);

//设置文字的画笔

mTextPaint = new Paint();

mTextPaint.setColor(mTextColor);

mTextPaint.setAntiAlias(true);

mTextPaint.setStyle(Paint.Style.FILL);

mTextPaint.setStrokeWidth((float) (0.025 * mRadius));

mTextPaint.setTextSize(mRadius/2);

mTextPaint.setTextAlign(Paint.Align.CENTER);

//设置外圆环的画笔

mArcPaint = new Paint();

mArcPaint.setAntiAlias(true);

mArcPaint.setColor(mRingColor);

mArcPaint.setStyle(Paint.Style.STROKE);

mArcPaint.setStrokeWidth((float) (0.075 * mRadius));

//设置外圆环的画笔

mArcPaintt = new Paint();

mArcPaintt.setAntiAlias(true);

mArcPaintt.setColor(Color.GRAY);

mArcPaintt.setStyle(Paint.Style.STROKE);

mArcPaintt.setStrokeWidth((float) (0.075 * mRadius));

//设置内圆环的画笔

mArcPaint2 = new Paint();

mArcPaint2.setAntiAlias(true);

mArcPaint2.setColor(Color.RED);//默认红色

mArcPaint2.setStyle(Paint.Style.STROKE);

mArcPaint2.setStrokeWidth((float) (0.075*mRadius2));

//设置外圆环的画笔

mArcPaint2t = new Paint();

mArcPaint2t.setAntiAlias(true);

mArcPaint2t.setColor(Color.GRAY);

mArcPaint2t.setStyle(Paint.Style.STROKE);

mArcPaint2t.setStrokeWidth((float) (0.075 * mRadius2));

//获得文字的字号 因为要设置文字在圆的中心位置

mTextSize = (int) mTextPaint.getTextSize();

}

//主要是测量wrap_content时候的宽和高，因为宽高一样，只需要测量一次宽即可，高等于宽

@Override

protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {

setMeasuredDimension(measure(widthMeasureSpec), measure(widthMeasureSpec));

//设置圆心坐标

mCircleX = getMeasuredWidth()/2;

mCircleY = getMeasuredHeight()/2;

//如果半径大于圆心横坐标，需要手动缩小半径的值，否则就画到外面去了

if (mRadius>mCircleX) {

//设置半径大小为圆心横坐标到原点的距离

mRadius = mCircleX;

mRadius = (int) (mCircleX-0.075*mRadius);

mRadius2=mRadius-5;

// mRadius2= (int) (mCircleX-0.075*mRadius2);

//因为半径改变了，所以要重新设置一下字体宽度

mTextPaint.setStrokeWidth((float) (0.025 * mRadius));

//重新设置字号

mTextPaint.setTextSize(mRadius / 2);

//重新设置外圆环宽度

mArcPaint.setStrokeWidth((float) (0.075*mRadius));

mArcPaint2.setStrokeWidth((float) (0.075 * (mRadius - 5)));

mArcPaintt.setStrokeWidth((float) (0.075*mRadius));

mArcPaint2t.setStrokeWidth((float) (0.075*(mRadius-5)));

//重新获得字号大小

mTextSize = (int) mTextPaint.getTextSize();

}

//画中心园的外接矩形，用来画圆环用

mArcRectF = new RectF(mCircleX-mRadius, mCircleY-mRadius, mCircleX+mRadius, mCircleY+mRadius);

mArcRectF2 = new RectF(mCircleX-mRadius2, mCircleY-mRadius2, mCircleX+mRadius2, mCircleY+mRadius2);

mArcRectFF = new RectF(mCircleX-mRadius, mCircleY-mRadius, mCircleX+mRadius, mCircleY+mRadius);

mArcRectF2F = new RectF(mCircleX-mRadius2, mCircleY-mRadius2, mCircleX+mRadius2, mCircleY+mRadius2);

}

//当wrap_content的时候，view的大小根据半径大小改变，但最大不会超过屏幕

private int measure(int measureSpec){

int result=0;

int specMode = MeasureSpec.getMode(measureSpec);

int specSize = MeasureSpec.getSize(measureSpec);

if (specMode == MeasureSpec.EXACTLY) {

result = specSize;

}else {

result =(int) (1.075*mRadius*2);

if (specMode == MeasureSpec.AT_MOST) {

result = Math.min(result, specSize);

}

}

return result;

}

//开始画中间圆、文字和外圆环

@Override

protected void onDraw(Canvas canvas) {

super.onDraw(canvas);

//画中间圆

// canvas.drawCircle(mCircleX, mCircleY, mRadius, mCirclePaint);

//画圆环

canvas.drawArc(mArcRectF, mStartSweepValue, mCurrentAngle, false, mArcPaint);

//画内圆环

canvas.drawArc(mArcRectF2, mStartSweepValue2 ,mCurrentAngle, false, mArcPaint2);

//画文字

// canvas.drawText(String.valueOf(mCurrentPercent)+"%", mCircleX, mCircleY+mTextSize/4, mTextPaint);

//判断当前百分比是否小于设置目标的百分比

// if (mCurrentPercent

if (mCurrentPercent>=50.0f) {

//画圆环

canvas.drawArc(mArcRectFF, mStartSweepValue, mCurrentAngle2, false, mArcPaintt);

//画内圆环

canvas.drawArc(mArcRectF2F, mStartSweepValue2, mCurrentAngle2, false, mArcPaint2t);

mCurrentAngle2+=3.6;

}

//当前百分比+1

mCurrentPercent+=1;

//当前角度+360

mCurrentAngle+=3.6;

if (mCurrentAngle>=360) {

mCurrentPercent=0;

mCurrentAngle = 0;

mCurrentAngle2=0;

mStartSweepValue=0;

}

//每10ms重画一次

postInvalidateDelayed(10);

}

//设置目标的百分比

public void setTargetPercent(int percent){

this.mTargetPercent = percent;

}

}