android 带百分比的自定义进度条

一般的ProgressBar 都只是一个光光的条(这里说的都是水平进度条),虽然比不用进度条时给用户的感觉要好,但是如果在形像化的东西上面再加上点文字,将进度描述量化,就可以让用户更加明白当前进度是多少了。
  有了需求,就可以开始实现了。
  这里的原理就是继承一个ProgressBar ,然后重写里面的onDraw() 方法。
  不多说,直接上码。(下面代码中的  package hol.test;  import 就不写了) 
代码片段,双击复制
01
02
03
04
05
06
07
08
09
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
public class MyProgress extends ProgressBar{
String text;
Paint mPaint;
 
public MyProgress(Context context) {
super (context);
// TODO Auto-generated constructor stub
System.out.println( "1" );
initText();
}
 
public MyProgress(Context context, AttributeSet attrs, int defStyle) {
super (context, attrs, defStyle);
// TODO Auto-generated constructor stub
System.out.println( "2" );
initText();
}
 
 
public MyProgress(Context context, AttributeSet attrs) {
super (context, attrs);
// TODO Auto-generated constructor stub
System.out.println( "3" );
initText();
}
 
@Override
public synchronized void setProgress( int progress) {
// TODO Auto-generated method stub
super.setProgress(progress);
setText(progress);

 
}
 
@Override
protected synchronized void onDraw(Canvas canvas) {
// TODO Auto-generated method stub
super .onDraw(canvas);
//this.setText();
Rect rect = new Rect();
this .mPaint.getTextBounds( this .text, 0 , this .text.length(), rect);
int x = (getWidth() / 2 ) - rect.centerX();
int y = (getHeight() / 2 ) - rect.centerY();
canvas.drawText( this .text, x, y, this .mPaint);
}
 
//初始化,画笔
private void initText(){
this .mPaint = new Paint();
this .mPaint.setColor(Color.WHITE);
 
}
 
private void setText(){
setText( this .getProgress());
}
 
//设置文字内容
private void setText( int progress){
int i = (progress * 100 )/ this .getMax();
this .text = String.valueOf(i) + "%" ;
}
 
 
}

 这样一个可以满足我们基本需求的进度条就写好了。   用的时候就可以直接在 layout XML 里面加了,不过添加的写法稍微有点不同。标记名要写成这个自定义进度条的完整类名,就像下面这样。 
代码片段,双击复制
01
02
03
04
05
06
07
08
<hol.test.MyProgress
android:id= "@+id/pgsBar"
android:max= "100"
android:layout_width= "fill_parent"
android:layout_height= "wrap_content"
style= "?android:attr/progressBarStyleHorizontal"
android:visibility= "visible"
/>


这样写后,可能会因为命名空间改变,下面属性无法用代码提示。一个简单的做法就是,先写一个正常的ProgressBar 的标记,把属性写完后,再将ProgressBar 替换为我们自定义的进度条的完整类名。   最后,使用方法就和普通的 ProgressBar 差不多了。 
代码片段,双击复制
01
02
03
04
05
06
07
08
09
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
public class ProgressTest extends Activity {
 
private Button btn_go = null ;
private MyProgress myProgress = null ;
private Handler mHandler;
 
/** Called when the activity is first created. */
@Override
public void onCreate(Bundle savedInstanceState) {
super .onCreate(savedInstanceState);
setContentView(R.layout.main);
findView();
setParam();
addListener();
 
mHandler = new Handler( new Callback() {
 
@Override
public boolean handleMessage(Message msg) {
// TODO Auto-generated method stub
myProgress.setProgress(msg.what);
return false ;
}
});
 
}
 
private void findView(){
btn_go = (Button) findViewById(R.id.btn_go);
myProgress = (MyProgress) findViewById(R.id.pgsBar);
}
 
private void setParam(){
btn_go.setText( "开始" );
}
private void addListener(){
btn_go.setOnClickListener( new OnClickListener() {
 
@Override
public void onClick(View v) {
// TODO Auto-generated method stub
new Thread( new Runnable() {
@Override
public void run() {
// TODO Auto-generated method stub
for ( int i = 0 ;i <= 50 ; i++){
mHandler.sendEmptyMessage(i * 2 );
try {
Thread.sleep( 80 );
} catch (InterruptedException e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
}
}
}).start();
}
});
}
}


PS :刚开始本以为进度条的构造方法只需要重写那个最长参数的,也就是那个构造方法3 ,实际上我测试的时候基本都是运行的3 方法。但有一次出错了,最后才找到系统居然用的1 方法,所以没办法,直接把三个构造方法全重写了。如果有谁知道原因,麻烦告诉一下。进度条上的文字信息,不一定非要百分比,可以自由发挥。比如类似  “当前个数/ 总数”。
   

1.png (19.66 KB, 下载次数: 1)

下载附件  保存到相册

2012-7-3 10:23 上传


  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
好的,我可以帮你解答这个问题。 首先,要实现数字百分比的水平进度条,你可以自定义一个 View,然后在 onDraw 方法中绘制进度条百分比数字。 以下是一个简单的实现: ```java public class CustomProgressBar extends View { private int progress; private Paint paint; public CustomProgressBar(Context context) { super(context); init(); } public CustomProgressBar(Context context, AttributeSet attrs) { super(context, attrs); init(); } public CustomProgressBar(Context context, AttributeSet attrs, int defStyleAttr) { super(context, attrs, defStyleAttr); init(); } private void init() { paint = new Paint(); paint.setColor(Color.BLUE); paint.setStyle(Paint.Style.FILL); paint.setTextSize(100); paint.setTextAlign(Paint.Align.CENTER); } @Override protected void onDraw(Canvas canvas) { super.onDraw(canvas); float width = getWidth(); float height = getHeight(); float centerX = width / 2; float centerY = height / 2; // 绘制背景 paint.setColor(Color.GRAY); canvas.drawRect(0, 0, width, height, paint); // 绘制进度条 paint.setColor(Color.BLUE); float progressWidth = progress * width / 100; canvas.drawRect(0, 0, progressWidth, height, paint); // 绘制百分比数字 paint.setColor(Color.WHITE); canvas.drawText(progress + "%", centerX, centerY, paint); } public void setProgress(int progress) { if (progress < 0) { progress = 0; } else if (progress > 100) { progress = 100; } this.progress = progress; invalidate(); } } ``` 然后,要实现百分比跟着进度条走,你可以在 setProgress 方法中调用 invalidate() 方法,强制 View 重新绘制。这样,每次进度改变时,View 都会重新绘制,从而实现百分比数字跟着进度条走的效果。 ```java public void setProgress(int progress) { if (progress < 0) { progress = 0; } else if (progress > 100) { progress = 100; } this.progress = progress; invalidate(); // 强制 View 重新绘制 } ``` 这样,你就可以在代码中通过调用 setProgress 方法来改变进度条的进度,并且百分比数字会跟着进度条走了。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值