如何在Android中自定义一个圆环式进度条?相信很多没有经验的人对此束手无策,为此本文总结了问题出现的原因和解决方法,通过这篇文章希望你能解决这个问题。
Android是什么
Android是一种基于Linux内核的自由及开放源代码的操作系统,主要使用于移动设备,如智能手机和平板电脑,由美国Google公司和开放手机联盟领导及开发。
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;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); } } public void setProgress(int progress) { this.progress = progress; postInvalidate();//重绘 } public void setMax(int max) { this.max = max; postInvalidate(); } 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>
看完上述内容,你们掌握如何在Android中自定义一个圆环式进度条的方法了吗?如果还想学到更多技能或想了解更多相关内容,欢迎关注编程网行业资讯频道,感谢各位的阅读!