Android自定义圆环式进度条
作者:StrongDarkness
这篇文章主要为大家详细介绍了Android自定义圆环式进度条,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
安卓自定义圆环式进度条,供大家参考,具体内容如下
需求是实现一个圆环式中间带有进度的进度条,自己动手实现一个
package com.djt.aienglish.widget; import android.content.Context; import android.content.res.TypedArray; import android.graphics.Canvas; import android.graphics.Paint; import android.graphics.RectF; import android.text.TextUtils; import android.util.AttributeSet; import android.view.View; import com.djt.aienglish.R; /** * @author qiu * @date 2020/3/12 13:51 */ public class CirclePgBar extends View { private int mHeight = 0; private int mWidth = 0; // 画圆环的画笔 private Paint mRingPaint; // 画圆环的画笔背景色 private Paint mRingPaintBg; // 画字体的画笔 private Paint mTextPaint; // 圆环颜色 private int mRingColor; // 圆环背景颜色 private int mRingBgColor; // 半径 private float mRadius; // 圆环半径 private float mRingRadius; // 圆环宽度 private float mStrokeWidth; // 圆心x坐标 private int mXCenter; // 圆心y坐标 private int mYCenter; // 字的长度 private float mTxtWidth; // 字的高度 private float mTxtHeight; // 总进度 private int max = 100; // 当前进度 private int progress; private String text; public CirclePgBar(Context context, AttributeSet attrs) { super(context, attrs); // 获取自定义的属性 initAttrs(context, attrs); initVariable(); } /** * 属性 */ private void initAttrs(Context context, AttributeSet attrs) { TypedArray typeArray = context.getTheme().obtainStyledAttributes(attrs, R.styleable.TasksCompletedView, 0, 0); mStrokeWidth = typeArray.getDimension(R.styleable.TasksCompletedView_circleWidth, 0); mRingColor = typeArray.getColor(R.styleable.TasksCompletedView_ringColor, 0xFFFFFFFF); mRingBgColor = typeArray.getColor(R.styleable.TasksCompletedView_ringBgColor, 0xFFFFFFFF); text = typeArray.getString(R.styleable.TasksCompletedView_text); max = typeArray.getInteger(R.styleable.TasksCompletedView_max, 0); progress = typeArray.getInteger(R.styleable.TasksCompletedView_progress, 0); } /** * 初始化画笔 */ private void initVariable() { //外圆弧背景 mRingPaintBg = new Paint(); mRingPaintBg.setAntiAlias(true); mRingPaintBg.setColor(mRingBgColor); mRingPaintBg.setStyle(Paint.Style.STROKE); mRingPaintBg.setStrokeWidth(mStrokeWidth); //外圆弧 mRingPaint = new Paint(); mRingPaint.setAntiAlias(true); mRingPaint.setColor(mRingColor); mRingPaint.setStyle(Paint.Style.STROKE); mRingPaint.setStrokeWidth(mStrokeWidth); //mRingPaint.setStrokeCap(Paint.Cap.ROUND);//设置线冒样式,有圆 有方 //中间字 mTextPaint = new Paint(); mTextPaint.setAntiAlias(true); mTextPaint.setStyle(Paint.Style.FILL); mTextPaint.setColor(mRingColor); invalidate(); } //测量 @Override protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) { super.onMeasure(widthMeasureSpec, heightMeasureSpec); //实际测量宽高 mHeight = getMeasuredHeight(); mWidth = getMeasuredWidth(); if (mWidth > mHeight) { mRadius = mHeight / 2; } else { mRadius = mWidth / 2; } //半径 mRingRadius = mRadius - mStrokeWidth / 2; //文字宽高测量 mTextPaint.setTextSize(mRadius / 2); Paint.FontMetrics fm = mTextPaint.getFontMetrics(); mTxtHeight = (int) Math.ceil(fm.descent - fm.ascent); } /** * 画图 */ @Override protected void onDraw(Canvas canvas) { mXCenter = mWidth / 2; mYCenter = mHeight / 2; //外圆弧背景 RectF rectBg = new RectF(mXCenter - mRingRadius, mYCenter - mRingRadius, mXCenter + mRingRadius, mYCenter + mRingRadius); canvas.drawArc(rectBg, 0, 360, false, mRingPaintBg); //外圆弧//进度 if (progress > 0) { RectF oval = new RectF(mXCenter - mRingRadius, mYCenter - mRingRadius, mXCenter + mRingRadius, mYCenter + mRingRadius); canvas.drawArc(oval, -90, ((float) progress / max) * 360, false, mRingPaint); } //字体 if(!TextUtils.isEmpty(text)) { mTxtWidth = mTextPaint.measureText(text, 0, text.length()); canvas.drawText(text, mXCenter - mTxtWidth / 2, mYCenter + mTxtHeight / 4, mTextPaint); } } /** * 设置进度 * * @param progress */ public void setProgress(int progress) { this.progress = progress; postInvalidate();//重绘 } /** * 设置最大值 * * @param max */ public void setMax(int max) { this.max = max; postInvalidate(); } /** * 设置文字内容 * * @param text */ public void setText(String text) { this.text = text; postInvalidate(); } }
别忘记在value下的attr.xml中加入默认配置属性
<!--圆弧进度条--> <declare-styleable name="TasksCompletedView"> <attr name="circleWidth" format="dimension" /> <attr name="ringColor" format="color" /> <attr name="ringBgColor" format="color" /> <attr name="text" format="string" /> <attr name="progress" format="integer" /> <attr name="max" format="integer" /> </declare-styleable>
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持脚本之家。