自定義View——簡單的圓點進度條

  說是進度條,更像是刻度條,先看效果。
這裏寫圖片描述

  再下來是代碼:

import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Paint;
import android.util.AttributeSet;
import android.util.Log;
import android.view.View;

/**
 * Created by SY on 2016/7/5.
 */
public class CustomProgressBar extends View {
    private final int CIRCLE_NUM = 6;//圓的總數
    private int full = 0;//實心圓數
    private Paint mStorke_paint;
    private Paint mFill_paint;

    public CustomProgressBar(Context context) {
        super(context);
    }

    public CustomProgressBar(Context context, AttributeSet attrs) {
        super(context, attrs);
    }

    public CustomProgressBar(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
    }


    public int getFull() {
        return full;
    }

    public void setFull(int full) {
        this.full = full;
        if (full < 0) {
            this.full = 0;
        }

        if (full > CIRCLE_NUM ) {
            this.full = CIRCLE_NUM ;
        }
        invalidate();
    }


    @Override
    protected void onDraw(Canvas canvas) {
        Log.e("full", full + "");
        super.onDraw(canvas);
        mStorke_paint = new Paint();
        mStorke_paint.setStrokeWidth(4);
        mStorke_paint.setStyle(Paint.Style.STROKE);
        mStorke_paint.setColor(getResources().getColor(R.color.celeste));

        mFill_paint = new Paint();
        mFill_paint.setStrokeWidth(4);
        mFill_paint.setStyle(Paint.Style.FILL);
        mFill_paint.setColor(getResources().getColor(R.color.celeste));

        //畫實心圓
        int centerX = 10;
        for (int i = 0; i < full; i++) {
            canvas.drawCircle(centerX, 10, 8, mFill_paint);
            centerX += 48;
        }
        //畫空心圓
        for (int i = 0; i < CIRCLE_NUM - full; i++) {
            canvas.drawCircle(centerX, 10, 8, mStorke_paint);
            centerX += 48;
        }
        //畫線
        int lineX = 18;
        for (int j = 0; j < CIRCLE_NUM - 1; j++) {
            canvas.drawLine(lineX, 10, lineX + 32, 10, mFill_paint);
            lineX += 48;
        }
    }

    /**
     * 重寫onMeasure
     * @param widthMeasureSpec
     * @param heightMeasureSpec
     */
    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        super.onMeasure(widthMeasureSpec, heightMeasureSpec);
        int width = measureDimension(260, widthMeasureSpec);
        int height = measureDimension(20, heightMeasureSpec);
        setMeasuredDimension(width, height);
    }

    public int measureDimension(int defaultSize, int measureSpec) {
        int result;

        int specMode = MeasureSpec.getMode(measureSpec);
        int specSize = MeasureSpec.getSize(measureSpec);

        if (specMode == MeasureSpec.EXACTLY) {
            result = specSize;
        } else {
            result = defaultSize;
            if (specMode == MeasureSpec.AT_MOST) {
                result = Math.min(result, specSize);
            }
        }
        return result;
    }
}

  CIRCLE_NUM表示圓的總數,full表示實心圓的個數,重寫onMeasure和onDraw方法,測量大小和繪製圖形。然後寫了個setFull方法改變full的大小,修改進度。

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章