当前位置： 移动技术网 > IT编程>移动开发>Android > android自定义view实现数字进度条

android自定义view实现数字进度条

2019年07月30日  | 移动技术网IT编程  | 我要评论

薄荷猪,76.5卫星,精选文章

之前看到过一个数字进度条,一直想写,今天就把这个实现下,想起来也是很简单的,先看下实现的效果：

思路：

绘制2根线 绘制进度条的文字,不断的改变起点和终点,然后没多少时间去更新ui就ok,在这就不画图了,看代码就看的明白,不要想的很复杂!

package com.tuya;
import android.animation.valueanimator;
import android.content.context;
import android.graphics.canvas;
import android.graphics.color;
import android.graphics.paint;
import android.graphics.rect;
import android.util.attributeset;
import android.view.view;
/**
 * created by admin on 2016/12/19.
 */
public class downloadprogressview extends view {
 private paint paint;//绘制进度条画笔
 private paint textpaint;//绘制文字画笔
 private paint dottepaint;//绘制灰色线画笔
 private int width;
 private int height;
 private int padding =5;
 private int value = 0;
 public downloadprogressview(context context) {
  this(context,null);
 }
 public downloadprogressview(context context, attributeset attrs) {
  this(context, attrs,0);
 }
 public downloadprogressview(context context, attributeset attrs, int defstyleattr) {
  super(context, attrs, defstyleattr);
  initpaint();
 }
 @override
 protected void onsizechanged(int w, int h, int oldw, int oldh) {
  super.onsizechanged(w, h, oldw, oldh);
  width = w;
  height = h;
 }
 /**
  * 初始化画笔
  */
 private void initpaint() {
  paint = new paint();
  paint.setantialias(true);
  paint.setstrokewidth(2);
  paint.setstyle(paint.style.fill);
  paint.setcolor(color.blue);

  textpaint = new paint();
  textpaint.setantialias(true);
  textpaint.setstrokewidth(3);
  textpaint.setstyle(paint.style.fill);
  textpaint.setcolor(color.blue);
  textpaint.settextsize(12);

  dottepaint = new paint();
  dottepaint.setantialias(true);
  dottepaint.setstrokewidth(2);
  dottepaint.setstyle(paint.style.fill);
  dottepaint.setcolor(color.parsecolor("#e5e5e5"));
 }
 @override
 protected void ondraw(canvas canvas) {
  super.ondraw(canvas);
  string str = value+"%";
  float strwidth = textpaint.measuretext(value+"%")+padding;//绘制文字的宽度 +padding是为了防止在进度条加载完毕的时候文字绘制出现被切掉情况
  rect rect = new rect();
  textpaint.gettextbounds(str,0,str.length(),rect);
  canvas.drawline(0,height/2,value*((width-strwidth)/100),height/2,paint);//绘制进度
  canvas.drawtext(value+"%",value*((width-strwidth)/100)+padding,(height-rect.height())/2+2*padding,textpaint);//绘制进度文字 这个高度+2*padding是因为drawtext是根据基线计算的,要准确的话要去求基线
  canvas.drawline(value*((width-strwidth)/100)+strwidth+padding,height/2,width,height/2,dottepaint);//绘制灰色进度表示剩余多少
  postdelayed(new runnable() {
   @override
   public void run() {
    if(value<100){
     value++;
     postinvalidate();
    }
   }
  },100);
 }
}

布局文件：

<?xml version="1.0" encoding="utf-8"?>
<relativelayout xmlns:android="http://schemas.android.com/apk/res/android"
 android:orientation="vertical"
 android:layout_width="match_parent"
 android:layout_height="match_parent"
 android:background="#7ec0ee">
 <com.tuya.downloadprogressview
  android:id="@+id/dpv"
  android:layout_width="fill_parent"
  android:layout_height="30dp"
  android:layout_marginleft="10dp"
  android:layout_marginright="10dp"
  android:layout_margintop="60dp"
  ></com.tuya.downloadprogressview>
</relativelayout>

github:numberprogress

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持移动技术网。

您可能感兴趣的文章:

如对本文有疑问，请在下面进行留言讨论，广大热心网友会与你互动！！ 点击进行留言回复

相关文章:

验证码：
最近更新的文章
大家感兴趣的文章
移动技术网