這個是一個以弧線為依托的進(jìn)度控件，主要包括了兩個圓弧、一個圓、一個文本。
當(dāng)我們點擊開始按鈕的時候，會出現(xiàn)一個動畫，逐漸的出現(xiàn)進(jìn)度，好了，下面開始我們的編碼。
新建一個類，繼承自View，實現(xiàn)三個構(gòu)造方法，接著定義變量，初始化變量的數(shù)據(jù)。代碼如下：
private Paint mArcPaint, mCirclePaint, mTextPaint, mPaint; private float length; private float mRadius; private float mCircleXY; private float mSweepValue = 0; private String mShowText = "0%"; private RectF mRectF; public MViewOne(Context context, AttributeSet attrs, int defStyleAttr) { super(context, attrs, defStyleAttr); initView(); } public MViewOne(Context context, AttributeSet attrs) { super(context, attrs); initView(); } public MViewOne(Context context) { super(context); initView(); } private void initView() { mArcPaint = new Paint(); mArcPaint.setStrokeWidth(50); mArcPaint.setAntiAlias(true); mArcPaint.setColor(Color.GREEN); mArcPaint.setStyle(Style.STROKE); mCirclePaint = new Paint(); mCirclePaint.setColor(Color.GREEN); mCirclePaint.setAntiAlias(true); mTextPaint = new Paint(); mTextPaint.setAntiAlias(true); mTextPaint.setColor(Color.RED); mTextPaint.setStrokeWidth(0); mPaint = new Paint(); mPaint.setStrokeWidth(40); mPaint.setAntiAlias(true); mPaint.setColor(Color.YELLOW); mPaint.setStyle(Style.STROKE); }可以看到，這里一共定義了四個畫筆，兩個畫弧形，一個畫文本，還有一個繪制圓。
在我們的onSizeChange方法里面，再給變量賦值。
@Override protected void onSizeChanged(int w, int h, int oldw, int oldh) { super.onSizeChanged(w, h, oldw, oldh); length = w; mCircleXY = length / 2; mRadius = (float) (length * 0.5 / 2); }這時候，圓的半徑、圓的起繪點，都已經(jīng)有值了。
下面開始繪制
@Override protected void onDraw(Canvas canvas) { super.onDraw(canvas); // 畫圓 mRectF = new RectF((float) (length * 0.1), (float) (length * 0.1), (float) (length * 0.9), (float) (length * 0.9)); canvas.drawCircle(mCircleXY, mCircleXY, mRadius, mCirclePaint); // 畫弧線 canvas.drawArc(mRectF, 270, 360, false, mPaint); canvas.drawArc(mRectF, 270, mSweepValue, false, mArcPaint); // 繪制文字 float textWidth = mTextPaint.measureText(mShowText); //測量字體寬度，我們需要根據(jù)字體的寬度設(shè)置在圓環(huán)中間 canvas.drawText(mShowText, (int)(length/2-textWidth/2), (int)(length/2+textWidth/2) , mTextPaint); }這個時候，全部的效果已經(jīng)出來了，但是這個還是靜態(tài)的，對外暴露一個方法，讓數(shù)據(jù)可以動態(tài)的刷新
public void setProgress(float mSweepValue) { float a = (float) mSweepValue; if (a != 0) { this.mSweepValue = (float) (360.0 * (a / 100.0)); mShowText = mSweepValue + "%"; Log.e("this.mSweepValue:", this.mSweepValue + ""); } else { this.mSweepValue = 25; mShowText = 25 + "%"; } invalidate(); }好了，所有的代碼都在這里了，老規(guī)矩，最后我貼上全部的代碼：
public class MViewOne extends View { private Paint mArcPaint, mCirclePaint, mTextPaint, mPaint; private float length; private float mRadius; private float mCircleXY; private float mSweepValue = 0; private String mShowText = "0%"; private RectF mRectF; public MViewOne(Context context, AttributeSet attrs, int defStyleAttr) { super(context, attrs, defStyleAttr); initView(); } public MViewOne(Context context, AttributeSet attrs) { super(context, attrs); initView(); } public MViewOne(Context context) { super(context); initView(); } private void initView() { mArcPaint = new Paint(); mArcPaint.setStrokeWidth(50); mArcPaint.setAntiAlias(true); mArcPaint.setColor(Color.GREEN); mArcPaint.setStyle(Style.STROKE); mCirclePaint = new Paint(); mCirclePaint.setColor(Color.GREEN); mCirclePaint.setAntiAlias(true); mTextPaint = new Paint(); mTextPaint.setAntiAlias(true); mTextPaint.setColor(Color.RED); mTextPaint.setStrokeWidth(0); mPaint = new Paint(); mPaint.setStrokeWidth(40); mPaint.setAntiAlias(true); mPaint.setColor(Color.YELLOW); mPaint.setStyle(Style.STROKE); } @Override protected void onSizeChanged(int w, int h, int oldw, int oldh) { super.onSizeChanged(w, h, oldw, oldh); length = w; mCircleXY = length / 2; mRadius = (float) (length * 0.5 / 2); } @Override protected void onDraw(Canvas canvas) { super.onDraw(canvas); // 畫圓 mRectF = new RectF((float) (length * 0.1), (float) (length * 0.1), (float) (length * 0.9), (float) (length * 0.9)); canvas.drawCircle(mCircleXY, mCircleXY, mRadius, mCirclePaint); // 畫弧線 canvas.drawArc(mRectF, 270, 360, false, mPaint); canvas.drawArc(mRectF, 270, mSweepValue, false, mArcPaint); // 繪制文字 float textWidth = mTextPaint.measureText(mShowText); //測量字體寬度，我們需要根據(jù)字體的寬度設(shè)置在圓環(huán)中間 canvas.drawText(mShowText, (int)(length/2-textWidth/2), (int)(length/2+textWidth/2) , mTextPaint); } public void setProgress(float mSweepValue) { float a = (float) mSweepValue; if (a != 0) { this.mSweepValue = (float) (360.0 * (a / 100.0)); mShowText = mSweepValue + "%"; Log.e("this.mSweepValue:", this.mSweepValue + ""); } else { this.mSweepValue = 25; mShowText = 25 + "%"; } invalidate(); }}謝謝閱讀，學(xué)習(xí)重在堅持，貴在堅持。
以上就是本文的全部內(nèi)容，希望對大家的學(xué)習(xí)有所幫助，也希望大家多多支持武林網(wǎng)。
新聞熱點
疑難解答
圖片精選
