5- 自定义自绘制View 带百分百的进度条

5- 自定义自绘制View 带百分百的进度条

---

先来看看效果图

这是自己绘制的一个带百分比的进度条，其实比较简单总体分成三个部分；
1- 左边矩形
2- 中间文字
3- 右边矩形
所以我们就可以开始绘制了，绘制在哪里开始？当然是在onDraw方法中了

   @Override
   protected void onDraw(Canvas canvas) {
   
       super.onDraw(canvas);
//画文字
       text = (int)(getPercent() * 100) + "%";
       textWidth = textPaint.measureText(text)+textPaddingSize;//左右两边多留出3px
       textLeft = getRealProgress()+textPaddingSize/2;
       canvas.drawText(text,textLeft,progressBottom,textPaint);
//画左边矩形
       mPaint.setColor(leftColor);
       rect1.set(0,progressTop,getRealProgress(),progressBottom);
       canvas.drawRect(rect1,mPaint);
画右边矩形
       mPaint.setColor(rightColor);
       rect2.set((int) (getRealProgress()+textWidth), progressTop,maxWidth,progressBottom);
       canvas.drawRect(rect2,mPaint);
   }

好吧，这里重点要讲一下这个方法，之前没有理解清楚，晚上费了我一个多小时，最后第二天想通的，唉，人笨了没有办法；

Rect rect1 = new Rect();
rect1.set(startX,startY,endX(),endY);
startX:在总宽度的左边开始位置
startY:在总高度的上边开始位置
endX:在总宽度的右边结束位置
endY:在总高度的下边结束位置

来张图：