转载时请注明出处,尊重他人的劳动成果,谢谢。
先附上效果图:
这个控件是动态加载到75%的,主要我忘了怎么做动态图,就先放一个静态图在这里表示表示。旁边这个没有没有喜欢的?有想知道的 我可以告诉答案。
现附上代码,不懂的请留言:
package com.sahadev.circleview;
import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.Paint.FontMetrics;
import android.graphics.RectF;
import android.util.AttributeSet;
import android.view.MotionEvent;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.Scroller;
public class CircleView extends View implements OnClickListener {
private Paint outPaint, inPaint;
/* The Circle's radius */
private int radius = 200;
/* The torus's width */
private int width = 50, backgroundColor = Color.WHITE;// 默认 背景色为纯白
private RectF mTempRectF = new RectF();
private int mProgress;// 当前进度
private int mTargetProgress = 75;// 目标进度
private int mWidth = 400, mHeight = 400;// 该控件的初始大小为400*400
private Scroller mScroller;// 滑动辅助类
private int duration = 1000;// 动画间隔时间
private int textSize = 50, mFontHeight;
private float mTextWidth = 0;
public CircleView(Context context) {
this(context, null);
}
public CircleView(Context context, AttributeSet attrs) {
this(context, attrs, 0);
}
public CircleView(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
outPaint = new Paint();
inPaint = new Paint();
outPaint.setTextSize(textSize);
mScroller = new Scroller(context);
mScroller.forceFinished(false);
outPaint.setColor(Color.argb(90, 90, 90, 90));
outPaint.setStyle(Paint.Style.FILL_AND_STROKE);
outPaint.setAntiAlias(true);
inPaint.setColor(backgroundColor);
inPaint.setAntiAlias(true);
setBackgroundColor(backgroundColor);
FontMetrics fm = outPaint.getFontMetrics();// 得到系统默认字体属性
mFontHeight = (int) (Math.ceil(fm.descent - fm.top) + 2);// 获得字体高度
mFontHeight = mFontHeight - textSize;
mTempRectF.set(0, 0, mWidth, mHeight);
}
public void setTextSize(int textSize) {
this.textSize = textSize;
}
/*
* 设置背景色
*
* @see android.view.View#setBackgroundColor(int)
*/
public void setBackgroundColor(int color) {
this.backgroundColor = color;
}
/**
* 设置圆圈颜色
*
* @param color
*/
public void setCircleColor(int color) {
outPaint.setColor(color);
}
/**
* 设置圆圈半径
*
* @param radius
*/
public void setRadius(int radius) {
this.radius = radius;
}
/**
* 设置圆圈宽度
*
* @param width
*/
public void setWidth(int width) {
this.width = width;
}
/**
* 设置目标进度
*
* @param progress
* 大于0,小于100
*/
public void setTargetProgress(int progress) {
this.mTargetProgress = progress;
}
/**
* 可以作为进度条设置当前进度
*
* @param progress
*/
public void setProgress(int progress) {
this.mProgress = progress;
postInvalidate();
}
@Override
public boolean onTouchEvent(MotionEvent event) {
switch (event.getAction()) {
case MotionEvent.ACTION_DOWN:
onClick(this);
return true;
}
return super.onTouchEvent(event);
}
@Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
canvas.drawArc(mTempRectF, -90, 360 * mProgress / 100, true, outPaint);// 画一个扇形
canvas.drawCircle(mWidth / 2, mHeight / 2, radius - width, inPaint);// 中心画一个圆
mTextWidth = outPaint.measureText(mProgress + "%");
canvas.drawText(mProgress + "%", (mWidth - mTextWidth) / 2, (mHeight) / 2 + mFontHeight, outPaint);
}
/*
* 获取适合的高宽
*
* @see android.view.View#onMeasure(int, int)
*/
@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
super.onMeasure(widthMeasureSpec, heightMeasureSpec);
int size = 0;
size = widthMeasureSpec > mWidth && heightMeasureSpec > mHeight ? (mWidth > mHeight ? mHeight : mWidth) : (widthMeasureSpec > heightMeasureSpec ? heightMeasureSpec
: widthMeasureSpec);
/* 该控件为正方形 */
setMeasuredDimension(size, size);
}
/*
* 触动该控件 绘制到指定位置
*
* @see android.view.View.OnClickListener#onClick(android.view.View)
*/
@Override
public void onClick(View v) {
mScroller.startScroll(0, 0, mTargetProgress, 0, duration);
postInvalidate();
}
/**
* 设置动画绘制时间
*
* @param duration
*/
public void setDuration(int duration) {
this.duration = duration;
}
@Override
public void computeScroll() {
super.computeScroll();
if (mScroller.computeScrollOffset()) {
mProgress = mScroller.getCurrX();
postInvalidate();
}
}
}
像一般自定义控件使用这个控件就可以了,具体方法相信大家都懂得,我就不贴方法了,只用设置进去就可以看到效果。