1. 程式人生 > >史上難求的自定義progress環形進度條效果——自定義View來襲!!!

史上難求的自定義progress環形進度條效果——自定義View來襲!!!

還是老規矩線上效果圖:

解析:這個效果其實就是兩個畫筆,畫了兩個弧而已,一個畫筆為背景色,一個畫筆為進度色。

畫弧的方法是:canvas.drawArc(bounds, 135,270, false, paint);  下面我給大家介紹一下這4個引數!

引數2:畫圓的起始角度,預設的起始角度是,水平位置的右側為0度,所以本次的其實角度0+135,本圖的坐下的位置

引數3,畫圓的終止排程,當然你可以寫成360,那就一個圓形了! 由於需求,我的末角度是270.

引數4:這個引數改為true後,會有一條線只想圓心,具體效果可以自己試下看,一般很少那樣做

引數5:毋庸置疑那肯定就是畫筆了,可以設定以寫顏色等這樣的屬性。

引數1:這個引數是最關鍵的,所以放在最後來說, 

             API:對它的解釋 用來定義形狀和尺寸範圍,直接上圖看吧,


以下是核心程式碼原始碼:

    /**
     * 得到畫布的寬高
     */
    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        super.onMeasure(widthMeasureSpec, heightMeasureSpec);
        width = this.getMeasuredWidth();//得到畫布的寬
    }

    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        //設定Paint的屬性
        paint.setColor(roundColor);
        paint.setStrokeWidth(roundWidth);
        paint.setStyle(Paint.Style.STROKE);
        paint.setStrokeCap(Paint.Cap.ROUND);
        //1.繪製圓弧背景
        RectF bounds = new RectF(roundWidth / 2, roundWidth / 2, width - roundWidth / 2, width - roundWidth / 2);
        canvas.drawArc(bounds, 135,270, false, paint);
        //2.繪製圓弧進度
        paint.setColor(roundProgressColor);
        canvas.drawArc(bounds, 135, progress * 270 / max, false, paint); //這是是根據百分比來設定進度的

}

然後再XML中如用,只需要引入我們自定義的View就oK:

 <com.example.iuzuan.myapplication.RoundProgress
        android:layout_centerInParent="true"
        android:layout_width="120dp"
        android:layout_height="120dp" />

ok,可以使用了!