[置顶] 自定义view之圆形进度条

本节介绍自定义view-圆形进度条
思路：
根据前面介绍的自定义view内容可拓展得之；
1：新建类继承自View
2：添加自定义view属性
3：重写onDraw(Canvas canvas)
4：实现功能
下面上代码
1.自定义view代码：
public class CustomView extends View {
//背景圆环颜色
private int circleColor;
//进度条颜色&字体颜色(为了美观，所以设计字体颜色和进度条颜色值一致)
private int secondCircleColor;
//进度条&背景圆环宽度
private float stroke_width;
//进度值
private float progress;
//总进度值，默认为100
private float totalProgress;
//字体大小
private float textSize;
//填充模式
private int style_type;
public CustomView(Context context) {
super(context);
}

public CustomView(Context context, AttributeSet attrs) {
super(context, attrs);
TypedArray array=context.obtainStyledAttributes(attrs, R.styleable.CustomView);
circleColor=array.getColor(R.styleable.CustomView_circleColor, Color.BLACK);
secondCircleColor=array.getColor(R.styleable.CustomView_secondCircleColor, Color.RED);
stroke_width=array.getDimension(R.styleable.CustomView_stroke_width, 2);
progress=array.getFloat(R.styleable.CustomView_progress, 0);
totalProgress=array.getFloat(R.styleable.CustomView_totalProgress, 100);
textSize=array.getDimension(R.styleable.CustomView_textSize, 16);
style_type=array.getInt(R.styleable.CustomView_style_Type, 0);
}

public CustomView(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
}

public void setCircleColor(int color){
circleColor=color;
}
public int getCircleColor(){
return circleColor;
}

public void setSecondCircleColor(int color){
secondCircleColor=color;
}
public int getSecondColor(){
return secondCircleColor;
}
public void setStrokeWidth(float width){
stroke_width=width;
}
public float getStrokeWidth(){
return stroke_width;
}
public void setProgress(float progress){
this.progress=progress;
postInvalidate();//刷新界面
}
public float getProgress(){
return this.progress;
}
public void setTotalProgress(float totalProgress){
this.totalProgress=totalProgress;
}
public float getTotalProgress(){
return this.totalProgress;
}
public void setTextSize(float textSize){
this.textSize=textSize;
}
public float getTextSize(){
return this.textSize;
}
@Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
//第一进度圆
final Paint paint_background=new Paint();
paint_background.setAntiAlias(true);
paint_background.setStrokeWidth(stroke_width);
paint_background.setStyle(Style.STROKE);
paint_background.setColor(circleColor);
//第二进度圆
final Paint paint_progress=new Paint();
paint_progress.setAntiAlias(true);
paint_progress.setStrokeWidth(stroke_width);
if(style_type==0){
paint_progress.setStyle(Style.STROKE);
}else if(style_type==1){
paint_progress.setStyle(Style.FILL_AND_STROKE);
}
paint_progress.setColor(secondCircleColor);
//画text
final Paint paint_text=new Paint();
paint_text.setAntiAlias(true);
if(style_type==0){
paint_text.setColor(secondCircleColor);
}else if(style_type==1){
paint_text.setColor(circleColor);
}
paint_text.setTextSize(textSize);
paint_text.setTextAlign(Align.CENTER);
if(getWidth()!=getHeight()){
throw new IllegalArgumentException("高度和宽度必须相等");//控制宽度和高度
}else{
RectF circle_background=new RectF();
circle_background.left=getLeft()+stroke_width;
circle_background.right=getRight()-stroke_width;
circle_background.top=getTop()+stroke_width;
circle_background.bottom=getBottom()-stroke_width;
canvas.drawArc(circle_background, -90, 360, false, paint_background);
RectF circle_progress=new RectF();
circle_progress.left=getLeft()+stroke_width;
circle_progress.right=getRight()-stroke_width;
circle_progress.top=getTop()+stroke_width;
circle_progress.bottom=getBottom()-stroke_width;
if(progress>totalProgress){
throw new IllegalArgumentException("当前进度值不能大于总进度值");
}else{
if(style_type==0){
canvas.drawArc(circle_progress, -90, progress/totalProgress*360, false, paint_progress);
}else if(style_type==1){
canvas.drawArc(circle_progress, -90, progress/totalProgress*360, true, paint_progress);
}
}
canvas.drawText((int)progress+"/"+(int)totalProgress, getLeft()+getWidth()/2, getTop()+getHeight()/2+textSize/4, paint_text);
}
}

}

2：attr属性
<?xml version="1.0" encoding="utf-8"?>
<resources>
<!--declare-styleable:声明样式类型;attr name=""声明属性名;format="属性的类型"  -->
<declare-styleable name="CustomEditText">
<attr name="lineColor" format="color" />
<attr name="lineHeight" format="dimension"/>
</declare-styleable>
<declare-styleable name="CustomView">
<attr name="stroke_width" format="dimension"/>
<attr name="circleColor" format="color"/>
<attr name="secondCircleColor" format="color"/>
<attr name="progress" format="float"/>
<attr name="totalProgress" format="float"/>
<attr name="textSize" format="dimension"/>
<attr name="style_Type">
<enum name="stroke" value="0"/>
<enum name="stroke_and_fill" value="1"/>
</attr>
</declare-styleable>

</resources>

3：xml布局文件
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="wrap_content"
android:layout_height="wrap_content" >

<com.anqiansong.views.CustomView
xmlns:circle="http://schemas.android.com/apk/res/com.anqiansong.androidcustomview"
android:id="@+id/customview"
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_centerInParent="true"
circle:circleColor="#000000"
circle:secondCircleColor="#ff0000"
circle:stroke_width="2dp"
circle:totalProgress="100"
circle:progress="10"
circle:style_Type="stroke"
/>

</RelativeLayout>
当xml文件中circle:style_Type="stroke"时

当xml文件中circle:style_Type="stroke_and_fill"时



4：activity中调用
public class MainActivity extends ActionBarActivity {

CustomView customView;
private float progress=0;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
customView=(CustomView) findViewById(R.id.customview);
handler.sendEmptyMessageDelayed(0, 1000);
}
Handler handler=new Handler(){
public void handleMessage(android.os.Message msg) {
if(msg.what==0){
if(progress>100){
return;
}else{
customView.setProgress(progress);
progress+=2;
handler.sendEmptyMessageDelayed(0, 100);
}
}
};
};

}