我們在開發中 有時候會遇到 點選一個圖示然後進行下載 並且需要在圖示上面加上進度條 像下面這樣的效果

先說下這個效果的實現，首先我們使用自定義view，在onDraw()方法中使用畫筆畫出外面的進度條

        mPaint.setAntiAlias(true);
        mPaint.setColor(Color.rgb(0xe9, 0xe9, 0xe9));
        canvas.drawColor(Color.TRANSPARENT);
        mPaint.setStrokeWidth(mWidth);
        mPaint.setStyle
 
(Paint.Style.STROKE);

        mRectF.right = width/2 + mRadius;
        mRectF.left = width/2-mRadius;
        mRectF.bottom = height/2 + mRadius;
        mRectF.top = height/2-mRadius;
        canvas.drawArc(mRectF, -90, 360, false, mPaint);
        mPaint.setColor(mColor);
        canvas.drawArc(mRectF, -90
 
, ((float) mProgress / mMaxProgress) * 360,
                false, mPaint);

其中mProgress 和mMaxProgress就是控制進度條的完成情況。使用下載時，通過設定mProgress 的大小，來完成進度條的更新。我在demo中模擬的是假資料，使用Timer來模擬下載更新。

 Handler mhandler = new Handler() {
        @Override
        public void handleMessage(Message msg) {
            switch
 
 (msg.what) {
                case 1:
                    if (mProgress < mMaxProgress)
                        mProgress++;
                    else {
                        isLoading = false;
                        mProgress = 0;
                        timer.cancel();
                    }
                    invalidate();
                    break;
            }
        }
    };

    @Override
    public void onClick(View v) {
        if (isLoading) {
            timer.cancel();
        } else {
            timer = new Timer();
            timer.schedule(new TimerTask() {
                @Override
                public void run() {
                    mhandler.sendEmptyMessage(1);
                }
            }, 200, 200);
        }
        isLoading = !isLoading;
    }