困了,写一个自定义环形进度条
来源:互联网 发布:淘宝店铺装修大学教程 编辑:程序博客网 时间:2024/06/02 10:00
自定义效果图如上图所示
一、定义自定义属性:
attrs文件下:
<declare-styleable name="ProgressView"> <!--背景色 --> <attr name="background_color" format="color"/> <!--进度条的颜色--> <attr name="progress_color" format="color"/> <!--进度条的宽度 --> <attr name="progress_width" format="float"/> <!--百分比文字的颜色 --> <attr name="text_color" format="color"/> <!--百分比文字的大小--> <attr name="text_size" format="dimension"/> </declare-styleable>二、初始化自定义属性:
TypedArray a = context.obtainStyledAttributes(attrs, R.styleable.ProgressView); mBackColor = a.getColor(R.styleable.ProgressView_background_color, Color.RED); mProgressColor = a.getColor(R.styleable.ProgressView_progress_color, Color.BLUE); mTextColor = a.getColor(R.styleable.ProgressView_text_color, Color.WHITE); mProgressWidth = a.getFloat(R.styleable.ProgressView_progress_width,30); textSize = a.getDimension(R.styleable.ProgressView_text_size,18); a.recycle();三、onMeasure测量宽高:
int width = MeasureSpec.getSize(widthMeasureSpec); int height = MeasureSpec.getSize(heightMeasureSpec); int size= Math.min(width,height); //设置宽高,取两者最小值 setMeasuredDimension(size,size);四、onDraw绘制圆环、进度条、文字
canvas.drawCircle(mOuterWidth, mOuterWidth, mRadius, mBackPaint); /** * 绘制圆弧 * public void drawArc(@NonNull RectF oval, float startAngle, * float sweepAngle, boolean useCenter, @NonNull Paint paint){} */ RectF rectF = new RectF(mProgressWidth / 2, mProgressWidth / 2, getWidth() - mProgressWidth / 2, getWidth() - mProgressWidth / 2); float percent = (float) mValue / mMax; //百分比 float angle = percent * 360; //角度 canvas.drawArc(rectF, -90, angle, false, mProgressPaint); float textHalfWidth = mTextPaint.measureText(mValue + "%") * 0.5f; canvas.drawText(mValue + "%", mOuterWidth - textHalfWidth, mOuterWidth + textSize / 2, mTextPaint); if (mValue>0){ //以(mOuterWidth,mOuterWidth)为圆心旋转画布 canvas.rotate(angle, mOuterWidth, mOuterWidth); //画个圆 canvas.drawCircle(mOuterWidth, mProgressWidth / 2, mProgressWidth / 2, mPaint);// 画个半圆// RectF rectF1 = new RectF(mOuterWidth-mProgressWidth/2,0,mOuterWidth+mProgressWidth/2,mProgressWidth);// canvas.drawArc(rectF1,-90,180,true,mPaint); }
五、完整代码:
public class ProgressView extends View{ private Paint mBackPaint; //背景画笔 private Paint mProgressPaint;//进度条画笔 private Paint mPaint;//进度条上的半圆画笔 private Paint mTextPaint; //文字 private int mBackColor; //背景色 private int mProgressColor;//进度条颜色 private int mTextColor; //文字颜色 private float textSize; //文字大小 private float mProgressWidth; //进度条宽度 private int mOuterWidth; //圆心坐标 private int mRadius; //半径 private static final int mMax = 100; //总进度 private int mValue; //进度值(小于100) private String TAG = "progress"; public ProgressView(Context context) { super(context); initView(); } public ProgressView(Context context, AttributeSet attrs) { super(context, attrs); TypedArray a = context.obtainStyledAttributes(attrs, R.styleable.ProgressView); mBackColor = a.getColor(R.styleable.ProgressView_background_color, Color.RED); mProgressColor = a.getColor(R.styleable.ProgressView_progress_color, Color.BLUE); mTextColor = a.getColor(R.styleable.ProgressView_text_color, Color.WHITE); mProgressWidth = a.getFloat(R.styleable.ProgressView_progress_width,30); textSize = a.getDimension(R.styleable.ProgressView_text_size,18); a.recycle(); initView(); } public ProgressView(Context context, AttributeSet attrs, int defStyleAttr) { super(context, attrs, defStyleAttr); initView(); } //初始化画笔 public void initView(){ mBackPaint = new Paint(); mBackPaint.setColor(mBackColor); mBackPaint.setStyle(Paint.Style.STROKE); mBackPaint.setStrokeWidth(mProgressWidth); //画笔半径 mBackPaint.setAntiAlias(true); mProgressPaint = new Paint(); mProgressPaint.setColor(mProgressColor); mProgressPaint.setStyle(Paint.Style.STROKE); mProgressPaint.setStrokeWidth(mProgressWidth); mProgressPaint.setAntiAlias(true); mPaint = new Paint(); mPaint.setColor(mProgressColor); mPaint.setStyle(Paint.Style.FILL); mPaint.setStrokeWidth(1f); mPaint.setAntiAlias(true); mTextPaint = new Paint(); mTextPaint.setColor(mTextColor); mTextPaint.setTextSize(textSize); mTextPaint.setStyle(Paint.Style.FILL); mTextPaint.setStrokeWidth(5f); mTextPaint.setAntiAlias(true); mTextPaint.setTypeface(Typeface.DEFAULT_BOLD); } @Override protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {// super.onMeasure(widthMeasureSpec, heightMeasureSpec); int width = MeasureSpec.getSize(widthMeasureSpec); int height = MeasureSpec.getSize(heightMeasureSpec); int size= Math.min(width,height); //设置宽高,取两者最小值 setMeasuredDimension(size,size); //背景圆环(需要原点的坐标和半径) mOuterWidth = getWidth() / 2; //圆的半径=宽度的一半-画笔宽度的一半 mRadius = (int) (mOuterWidth - mProgressWidth / 2); } //设置进度 public void setValue(int value){ mValue = value; LogUtil.e(TAG,mValue+"---"); if (mValue<=mMax){ //刷新进度条 postInvalidate(); }else { if (listener!=null){ listener.finish(); } } } @Override protected void onDraw(Canvas canvas) { super.onDraw(canvas); //以(mOuterWidth,mOuterWidth)为圆心,mRadius为半径画个圆 canvas.drawCircle(mOuterWidth, mOuterWidth, mRadius, mBackPaint); //以左上的坐标和右下的坐标画个矩形 RectF rectF = new RectF(mProgressWidth / 2, mProgressWidth / 2, getWidth() - mProgressWidth / 2, getWidth() - mProgressWidth / 2); //百分比 float percent = (float) mValue / mMax; //角度 float angle = percent * 360; /** * 绘制圆弧 * public void drawArc(@NonNull RectF oval, float startAngle, * float sweepAngle, boolean useCenter, @NonNull Paint paint){} */ canvas.drawArc(rectF, -90, angle, false, mProgressPaint); //文字的宽度一半 float textHalfWidth = mTextPaint.measureText(mValue + "%") * 0.5f; //写文字 canvas.drawText(mValue + "%", mOuterWidth - textHalfWidth, mOuterWidth + textSize / 2, mTextPaint); if (mValue>0){ //以(mOuterWidth,mOuterWidth)为圆心旋转画布 canvas.rotate(angle, mOuterWidth, mOuterWidth); //画个圆 canvas.drawCircle(mOuterWidth, mProgressWidth / 2, mProgressWidth / 2, mPaint);// 画个半圆// RectF rectF1 = new RectF(mOuterWidth-mProgressWidth/2,0,mOuterWidth+mProgressWidth/2,mProgressWidth);// canvas.drawArc(rectF1,-90,180,true,mPaint); } //进行回调 if (listener!=null){ if (mValue<mMax){ listener.getValue(mValue); }else if (mValue==mMax){ listener.finish(); } } } /** * 回调接口 */ public interface ProgressListener{ //完成回调 void finish(); //进度过程中传值 void getValue(int value); } ProgressListener listener; public void setListener(ProgressListener listener){ this.listener = listener; }}
六、测试:
Handler handler = new Handler(){ @Override public void handleMessage(Message msg) { super.handleMessage(msg); progressView.setValue(msg.what); } }; @Override public void initView() { super.initView(); progressView.setListener(new ProgressView.ProgressListener() { @Override public void finish() { ToastUtil.showShort(ImageActivity.this,"完成了"); } @Override public void getValue(int value) { } }); new Thread(new Runnable(){ public void run(){ for (int i1 = 1; i1 <= 100; i1++) { SystemClock.sleep(200); handler.sendEmptyMessage(i1); } } }).start(); }
0 0
- 困了,写一个自定义环形进度条
- 自定义环形进度条
- Android自定义环形进度条
- android 自定义 环形进度条
- 自定义环形进度条
- 自定义view-环形进度条
- 自定义view-环形进度条
- 自定义渐变环形进度条。
- 自定义环形进度条
- 自定义环形进度条
- 自定义的环形进度条样式
- 自定义多进度环形进度条
- android 简单自定义环形进度条
- 自定义Drawable实现环形进度条.
- 如何实现一个环形进度条
- Android自定义控件实现环形播放进度条
- Android自定义控件实现环形播放进度条
- Android自定义View之实现环形进度条
- PHP命令链模式
- css总结
- electron打包asar文件说明
- 接受
- Linux服务器部署上线步骤
- 困了,写一个自定义环形进度条
- 中国5G时代阶段性胜利
- 使用py2exe对Python文件进行封装生成exe文件
- iOS下JS与原生OC互相调用(总结)
- Hadoop+HBase+Spark伪分布式整合部署(mac)
- HTTP Status 500 - Error instantiating servlet class的问题解决
- ubuntu下安装Android sdk
- 文件上传-通过commons_FIleUpload实现
- 2016年腾讯校园招聘面试经验