系统提供的环形进度条无法显示进度,且不会停止转动,所以要用到能显示进度的进度条时,只能自己定义一个控件。
API Demos里面有提供类似的画法,API Demos --> Graphics --> Arcs。
若想做到如上图所示的最终效果,且×××进度的部分是通过动画渐渐生成的,则步骤如下:
(1)首先新建一个类,继承View或者ProgressBar或者ImageView都可以,区别就在于若继承ProgressBar或者ImageView则我们自定义的控件也会具有这些父类的属性,比如继承ProgressBar时,运行就会发现除了我们画出来的控件之外,还能看到系统的无尽进度条。若想去除,则将onDraw()方法中的super.onDraw(canvas)删除即可。其实一般都是继承View即可。
(2)创建画笔,若想画圆环,而不是实心圆,则画笔要设置成空心格式:
mPaint.setStyle(Style.STROKE);再通过mPaint.setStrokeWidth(50)来设置画笔宽度。上图所示效果其实是由一个背景蓝色圆环和一个进度条×××圆弧构成,所以要创建两个画笔。
(3)画出背景圆环:在onDraw()方法中写canvas.drawCircle(150, 150, 100, mPaint_bg);
(4)画圆弧进度条:画圆弧的方法为canvas.drawArc(oval, -90, angle, false, mPaint);
第一个参数是一个椭圆,作为画圆弧的模板,第二个参数表示起始角度,第二个参数表示转动的总角度,第三个参数表示是否要画出圆内部分。所以要先创建一个椭圆对象:RectF oval = new RectF(50, 50, 250, 250);要想达到如上图所示效果,则椭圆要与背景圆完全重合,自己要计算好坐标。因为要实现动画生成进度的效果,所以第三个参数要设置为一个变量,实时变化。
(5)写一个方法,可以外部调用,来设置进度条的进度:
public void setProgress(int progress)
{
this.maxProgress = progress;
}
(6)设置动画效果:在构造方法中写:
postDelayed(new Runnable() {
@Override
public void run() {
totalAngle = 360*maxProgress/100;
angle += 5;
invalidate();
if (angle <= totalAngle)
{
postDelayed(this, 80);
}
}
}, 80);
(7)在要用到该控件的类中,放入此控件,并得到控件对象,调用setProgress(int progress)方法即可完成。
备注:
1、drawArc()方法的第四个参数若设置成true,则效果如下:
2、用Style.STROKE风格的画笔画圆弧时,圆弧并不是完全画在椭圆模板的外围,而是一半宽度处于椭圆内部,一半处于外围,同样的,画圆时也一样。将模板圆画出来就可以看到,实际情况如下图所示:
免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。