欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  移动技术

Android实现环形进度条的实例

程序员文章站 2024-02-22 11:42:28
android实现环形进度条的效果图如下: 自定义控件:attendanceprogressbar 代码如下: public class attendan...

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"/>

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