Android实现环形进度条的实例

android实现环形进度条的效果图如下：

自定义控件：attendanceprogressbar

代码如下：

public class attendanceprogressbar extends view {
  // 画圆环底部的画笔
  private paint mcirclepaint;
  // 画圆环的画笔
  private paint mringpaint;
  // 画字体的画笔
  private paint mtextpaint;
  // 圆形颜色
  private int mcirclecolor;
  // 圆环颜色
  private int mringcolor;
  // 半径
  private float mradius;
  // 圆环半径
  private float mringradius;
  // 圆环宽度
  private float mstrokewidth;
  // 圆心x坐标
  private int mxcenter;
  // 圆心y坐标
  private int mycenter;
  // 字的长度
  private float mtxtwidth;
  // 字的高度
  private float mtxtheight;
  // 总进度
  private int mtotalprogress = 100;
  // 当前进度
  private int mprogress = 80;
  //字体颜色
  private int mtextcolor;
  // 字体大小
  private float mtextsize;
  public attendanceprogressbar(context context, attributeset attrs) {
    super(context, attrs);
    // 获取自定义的属性
    initattrs(context, attrs);
    initvariable();
  }
  private void initattrs(context context, attributeset attrs) {
    typedarray typearray = context.gettheme().obtainstyledattributes(attrs,
        r.styleable.attendanceprogressbar, 0, 0);
    mradius = typearray.getdimension(r.styleable.attendanceprogressbar_radius, 80);
    mstrokewidth = typearray.getdimension(r.styleable.attendanceprogressbar_strokewidth, 10);
    mcirclecolor = typearray.getcolor(r.styleable.attendanceprogressbar_circlecolor, 0xffffffff);
    mringcolor = typearray.getcolor(r.styleable.attendanceprogressbar_ringcolor, 0xffffffff);
    mtextcolor = typearray.getcolor(r.styleable.attendanceprogressbar_textcolor, 0xff000000);
    mtextsize = typearray.getdimension(r.styleable.attendanceprogressbar_textsize, 80);
    mringradius = mradius + mstrokewidth / 2;
  }
  private void initvariable() {
    mcirclepaint = new paint();
    mcirclepaint.setantialias(true);
    mcirclepaint.setcolor(mcirclecolor);
//    mcirclepaint.setstyle(paint.style.fill);
    mcirclepaint.setstyle(paint.style.stroke);
    mcirclepaint.setstrokewidth(mstrokewidth);
    mringpaint = new paint();
    mringpaint.setantialias(true);
    mringpaint.setcolor(mringcolor);
    mringpaint.setstyle(paint.style.stroke);
    mringpaint.setstrokewidth(mstrokewidth);
    mtextpaint = new paint();
    mtextpaint.setantialias(true);
    mtextpaint.setstyle(paint.style.fill);
    mtextpaint.setcolor(mtextcolor);
//    mtextpaint.setargb(255, 255, 255, 255);
//    mtextpaint.settextsize(mradius / 2);
    mtextpaint.settextsize(mtextsize);
    paint.fontmetrics fm = mtextpaint.getfontmetrics();
    mtxtheight = (int) math.ceil(fm.descent - fm.ascent);
  }
  @override
  protected void ondraw(canvas canvas) {
    mxcenter = getwidth() / 2;
    mycenter = getheight() / 2;
//    canvas.drawcircle(mxcenter, mycenter, mradius, mcirclepaint);
    canvas.drawcircle(mxcenter, mycenter, mringradius, mcirclepaint);
    rectf oval = new rectf();
    oval.left = (mxcenter - mringradius);
    oval.top = (mycenter - mringradius);
    oval.right = mringradius * 2 + (mxcenter - mringradius);
    oval.bottom = mringradius * 2 + (mycenter - mringradius);
    canvas.drawarc(oval, -90, ((float) mprogress / mtotalprogress) * 360, false, mringpaint); //
//            canvas.drawcircle(mxcenter, mycenter, mradius + mstrokewidth / 2, mringpaint);
//      string txt = mprogress + "%";
    string txt = "16/18";
    mtxtwidth = mtextpaint.measuretext(txt, 0, txt.length());
//      canvas.drawtext(txt, mxcenter - mtxtwidth / 2, mycenter + mtxtheight / 4, mtextpaint);
    canvas.drawtext(txt, mxcenter - mtxtwidth / 2, mycenter + mtxtheight / 4 - diptopx(10), mtextpaint);
    txt = "出勤人数";
    mtxtwidth = mtextpaint.measuretext(txt, 0, txt.length());
    canvas.drawtext(txt, mxcenter - mtxtwidth / 2, mycenter + mtxtheight / 4 + diptopx(10), mtextpaint);
  }
  public void setprogress(int progress) {
    mprogress = progress;
    postinvalidate();
  }
  private int diptopx(int dip) {
    float scale = getcontext().getresources().getdisplaymetrics().density;
    return (int) (dip * scale + 0.5f * (dip >= 0 ? 1 : -1));
  }
}

因为是自定义控件，所以在attr.xml文件定义了一些控件属性，以便在xml文件中设置这些属性

代码如下：

<?xml version="1.0" encoding="utf-8"?>
<resources>
  <declare-styleable name="attendanceprogressbar">
    <attr name="radius" format="dimension"/>
    <attr name="strokewidth" format="dimension"/>
    <attr name="circlecolor" format="color"/>
    <attr name="ringcolor" format="color"/>
    <attr name="textcolor" format="color"/>
    <attr name="textsize" format="dimension"/>
  </declare-styleable>
</resources>

最后，在xml文件中，可以这样使用

<com.ztd.lieyi.widget.attendanceprogressbar
        android:layout_gravity="center"
        android:layout_width="100dp"
        android:layout_height="100dp"
        app:radius="45dp"
        app:strokewidth="5dp"
        app:textsize="@dimen/text_16"
        app:textcolor="@color/color_333333"
        app:circlecolor="@color/color_d5ebfd"
        app:ringcolor="@color/color_2c9df7"/>

这只是初步处理，使用时可以根据需求酌情处理~如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对网站的支持！