如何設計半圓進度條

Question

您好我有實現了圓形進度條它工作正常，現在的問題是我需要設計一個半圓形進度條。

Answer 1

這可以通過以一定角度裁剪包含圖像的畫布來實現（通過繪製弧線）。

並通過繪製弧來剪輯該圖像。

這裏是你如何做到這一點。

//Convert the progress in range of 0 to 100 to angle in range of 0 180. Easy math. 
float angle = (progress * 180)/100; 
mClippingPath.reset(); 
//Define a rectangle containing the image 
RectF oval = new RectF(mPivotX, mPivotY, mPivotX + mBitmap.getWidth(), mPivotY + mBitmap.getHeight()); 
//Move the current position to center of rect 
mClippingPath.moveTo(oval.centerX(), oval.centerY()); 
//Draw an arc from center to given angle 
mClippingPath.addArc(oval, 180, angle); 
//Draw a line from end of arc to center 
mClippingPath.lineTo(oval.centerX(), oval.centerY()); 

一旦你得到了路徑，你可以使用clipPath function剪輯該路徑中的畫布。

canvas.clipPath(mClippingPath); 

查看Semi Circle Progress Bar以獲得更多簡單和有用的細節。

---

注意，如果硬件加速開啓clipPath功能不起作用。您只能關閉該視圖的硬件加速。

//Turn off hardware accleration 
    semiCircleProgressBarView.setLayerType(View.LAYER_TYPE_SOFTWARE, null); 

由於當進度變化，你可以通過調用函數設定的進度，

semiCircleProgressBarView.setClipping(progress);