1. 程式人生 > >自定義的CircleProgressBar,支援自定義寬度,顏色等等。

自定義的CircleProgressBar,支援自定義寬度,顏色等等。

基於Anbase框架優化了了一個自定義的CircleProgressBar,onDraw方法如下
@Override
protected void onDraw(Canvas canvas) {
   super.onDraw(canvas);
   if(reset){
      canvas.drawColor(Color.TRANSPARENT);
      reset = false;
   }
   this.width = getMeasuredWidth();
   this.height = getMeasuredHeight();
   this.radius = getMeasuredWidth()/2 
- pathWidth; // 設定畫筆顏色 pathPaint.setColor(pathColor); // 設定畫筆寬度 pathPaint.setStrokeWidth(pathWidth); //新增浮雕效果 pathPaint.setMaskFilter(emboss); // 在中心的地方畫個半徑為r的圓 canvas.drawCircle(this.width/2, this.height/2, radius, pathPaint); //邊線 pathPaint.setStrokeWidth(0.5f); pathPaint.setColor(pathBorderColor
); canvas.drawCircle(this.width/2, this.height/2, radius+pathWidth/2+0.5f, pathPaint); canvas.drawCircle(this.width/2, this.height/2, radius-pathWidth/2-0.5f, pathPaint); //環形顏色填充 SweepGradient sweepGradient = new SweepGradient(this.width/2, this.height/2, arcColors, null); fillArcPaint.setShader(sweepGradient); // 設定style 預設值中空
fillArcPaint.setStyle(fillArcPaintStyle); //模糊效果 fillArcPaint.setMaskFilter(mBlur); //設定線的型別,邊是圓的 fillArcPaint.setStrokeCap(Paint.Cap.ROUND); //fillArcPaint.setColor(Color.BLUE); fillArcPaint.setStrokeWidth(pathWidth); // 設定類似於左上角座標,右下角座標 oval.set(this.width/2 - radius, this.height/2 - radius, this.width/2 + radius, this.height/2 + radius); // 畫圓弧,第二個引數為:起始角度,第三個為跨的角度,第四個為true的時候是實心,false的時候為空心 canvas.drawArc(oval, -90, ((float) progress / max) * 360, true, fillArcPaint); }
具體使用如下:
// ProgressBar進度控制
mCirprogressBar1 = (CircleProgressBar) findViewById(R.id.circleProgressBar1);
mCirprogressBar1.setPathWidth(20); // 設定圓環寬度
int[] arcColors = new int[] {0xFFFFB6C1,  0xFFFFC0CB, 0xFFDC143C, 0xFFFFB6C1 };
mCirprogressBar1.setArcColors(arcColors);
mCirprogressBar1.setFillArcPaintStyle(Paint.Style.FILL_AND_STROKE);
mCirprogressBar1.setIsSolid(true);
mCirprogressBar1.setMax(max);
mCirprogressBar1.setProgress(progress);

// ProgressBar進度控制
mCirprogressBar2 = (CircleProgressBar) findViewById(R.id.circleProgressBar2);
mCirprogressBar2.setPathWidth(10); // 設定圓環寬度
mCirprogressBar2.setMax(max);
mCirprogressBar2.setProgress(progress);

// ProgressBar進度控制
mCirprogressBar3 = (CircleProgressBar) findViewById(R.id.circleProgressBar3);
mCirprogressBar3.setPathWidth(5); // 設定圓環寬度
mCirprogressBar3.setFillArcPaintStyle(Paint.Style.FILL);
mCirprogressBar3.setIsSolid(true);
mCirprogressBar3.setMax(max);
mCirprogressBar3.setProgress(progress);

引數的產生的作用看效果圖就知道了,其實是一個在不停轉動的,不會做gif只能截一個靜態圖了。想看動態效果的可以下載demo看看。
效果圖如下: