android 自定义圆形进度条
今天无意中发现一个圆形进度，想想自己实现一个，如下图：
基本思路是这样的：
1.首先绘制一个实心圆
2.绘制一个白色实心的正方形，遮住实心圆
3.在圆的中心动态绘制当前进度的百分比字符
4.绘制一个与之前实心圆相同颜色的空心圆
5.逐渐改变当前的百分比
6.根据百分比，逐渐改变正方形的大小，逐渐减小正方形的底部y轴的坐标，不断重绘，直到达到100%
首先看看自定义的属性
在values目录下新建attrs.xml内容如下：
定义绘制圆形的背景色，和绘制圆形的半径大小
我要评论
<?xml version="1.0" encoding="utf-8"?>
<resources>
<attr name="circlecolor" format="color"></attr>
<attr name="half" format="dimension"></attr>
<declare-styleable name="mycircleimage">
<attr name="circlecolor"></attr>
<attr name="half"></attr>
</declare-styleable>
</resources>
自定义视图
import android.annotation.suppresslint;
import android.content.context;
import android.content.res.typedarray;
import android.graphics.canvas;
import android.graphics.color;
import android.graphics.paint;
import android.text.textpaint;
import android.util.attributeset;
import android.util.log;
import android.view.view;
public class circlepro extends view {
private paint paint;
private int circleback;//圆的背景色
private int mschedual = 0;//用于控制动态变化
float circlehalf; //圆的半径
string percent = "";//绘制百分比的字符串
@suppresslint("recycle")
public circlepro(context context, attributeset attrs, int defstyleattr) {
super(context, attrs, defstyleattr);
paint = new paint();
typedarray array = context.gettheme().obtainstyledattributes(attrs, r.styleable.mycircleimage, defstyleattr,0);
@suppresswarnings("unused")
int leng = array.length();
//获取自定义的属性，这里注意是r.styleable.mycircleimage_circlecolor而不是r.attr.circlecolor
circleback = array.getcolor(r.styleable.mycircleimage_circlecolor,color.green);
circlehalf = array.getdimension(r.styleable.mycircleimage_half,200.f);
system.out.println(circleback);
}
/**
* 这个构造参数，当在布局文件中引用该view的时候，必须重写该构造函数
* @param context
* @param attrs
*/
public circlepro(context context, attributeset attrs) {
this(context, attrs, 0);//调用自己的构造函数
}
/**
* 根据文本的
* @param text
* @param textsize
* @return
*/
public float gettextwidth(string text,float textsize) {
textpaint textpaint = new textpaint();
textpaint.settextsize(textsize);
return textpaint.measuretext(text);
}
@override
protected void ondraw(canvas canvas) {
// todo auto-generated method stub
super.ondraw(canvas);
float height = getheight();
float width = getwidth();
// float circlehalf = (float) (width*0.7/2);
paint.setcolor(circleback);
paint.setantialias(true);
paint.setstyle(paint.style.fill);
canvas.drawcircle(width/2,height/2,circlehalf, paint);//画实心圆
if (mschedual <= 100) {//，如果当前进度小于100，画实心矩形
paint.setcolor(color.white);
canvas.drawrect(width/2-circlehalf,height/2-circlehalf,width/2+circlehalf,height/2+circlehalf - mschedual*circlehalf/50, paint);
}
//画当前进度的字符串
paint.setcolor(color.black);
paint.settextsize(30.f);
percent = mschedual+" %";
canvas.drawtext(percent, width/2-gettextwidth(percent,30)/2,height/2+paint.gettextsize()*3/8, paint);//字体的高度=paint.gettextsize()*3/4
//画空心圆
paint.setcolor(circleback);
paint.setstyle(paint.style.stroke);
canvas.drawcircle(width/2,height/2,circlehalf, paint);
if (mschedual < 100) {//更改当前进度值，并重绘
mschedual++;
invalidate();
}
}
}
在activity_main.xml中，需要用到自定义的属性，首先添加命名空间：
xmlns:liu=”http://schemas.android.com/apk/res/com.example.androidcirclepro”
其中liu是自定义的一个前缀，随意命名的，com.example.androidcirclepro是我们的应用的包名
activity_main.xmln内容如下：
<relativelayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:liu="http://schemas.android.com/apk/res/com.example.androidcirclepro"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".mainactivity" >
<com.example.androidcirclepro.circlepro
android:layout_width="match_parent"
android:layout_height="match_parent"
liu:half="90dp"
liu:circlecolor="#fff0f0"
/>
</relativelayout>
至此一个自定义的圆形进度条就完成了，是不是很简单。
感谢阅读，希望能帮助到大家，谢谢大家对本站的支持！
如对本文有疑问， 点击进行留言回复！！
网友评论