Android实现自定义圆形进度条

Android实现自定义圆形进度条,第1张

概述今天无意中发现一个圆形进度,想想自己实现一个,如下图:基本思路是这样的:

今天无意中发现一个圆形进度,想想自己实现一个,如下图:

基本思路是这样的:

1.首先绘制一个实心圆

2.绘制一个白色实心的正方形,遮住实心圆

3.在圆的中心动态绘制当前进度的百分比字符

4.绘制一个与之前实心圆相同颜色的空心圆

5.逐渐改变当前的百分比

6.根据百分比,逐渐改变正方形的大小,逐渐减小正方形的底部y轴的坐标,不断重绘,直到达到100%

首先看看自定义的属性

在values目录下新建attrs.xml内容如下:

定义绘制圆形的背景色,和绘制圆形的半径大小

<?xml version="1.0" enCoding="utf-8"?><resources>  <attr name="circlecolor" format="color"></attr>  <attr name="half" format="dimension"></attr>  <declare-styleable name="mycircleimage">    <attr name="circlecolor"></attr>    <attr name="half"></attr>  </declare-styleable></resources>

自定义视图

import androID.annotation.Suppresslint;import androID.content.Context;import androID.content.res.TypedArray;import androID.graphics.Canvas;import androID.graphics.color;import androID.graphics.Paint;import androID.text.TextPaint;import androID.util.AttributeSet;import androID.util.Log;import androID.vIEw.VIEw;public class CirclePro extends VIEw { private Paint paint; private int circleBack;//圆的背景色 private int mschedual = 0;//用于控制动态变化 float circleHalf; //圆的半径 String percent = "";//绘制百分比的字符串 @Suppresslint("Recycle") public CirclePro(Context context,AttributeSet attrs,int defStyleAttr) { super(context,attrs,defStyleAttr); paint = new Paint(); TypedArray array = context.gettheme().obtainStyledAttributes(attrs,R.styleable.mycircleimage,defStyleAttr,0); @SuppressWarnings("unused") int leng = array.length(); //获取自定义的属性,这里注意是R.styleable.mycircleimage_circlecolor而不是R.attr.circlecolor circleBack = array.getcolor(R.styleable.mycircleimage_circlecolor,color.GREEN); circleHalf = array.getDimension(R.styleable.mycircleimage_half,200.f); System.out.println(circleBack); } /** * 这个构造参数,当在布局文件中引用该vIEw的时候,必须重写该构造函数 * @param context * @param attrs */ public CirclePro(Context context,AttributeSet attrs) { this(context,0);//调用自己的构造函数 } /** * 根据文本的 * @param text * @param textSize * @return */ public float getTextWIDth(String text,float textSize) { TextPaint textPaint = new TextPaint(); textPaint.setTextSize(textSize); return textPaint.measureText(text); } @OverrIDe protected voID onDraw(Canvas canvas) { // Todo auto-generated method stub super.onDraw(canvas); float height = getHeight(); float wIDth = getWIDth();// float circleHalf = (float) (wIDth*0.7/2); paint.setcolor(circleBack); paint.setAntiAlias(true); paint.setStyle(Paint.Style.FILL); canvas.drawCircle(wIDth/2,height/2,circleHalf,paint);//画实心圆 if (mschedual <= 100) {//,如果当前进度小于100,画实心矩形  paint.setcolor(color.WHITE);  canvas.drawRect(wIDth/2-circleHalf,height/2-circleHalf,wIDth/2+circleHalf,height/2+circleHalf - mschedual*circleHalf/50,paint); } //画当前进度的字符串 paint.setcolor(color.BLACK); paint.setTextSize(30.f); percent = mschedual+" %"; canvas.drawText(percent,wIDth/2-getTextWIDth(percent,30)/2,height/2+paint.getTextSize()*3/8,paint);//字体的高度=paint.getTextSize()*3/4 //画空心圆 paint.setcolor(circleBack); paint.setStyle(Paint.Style.stroke); canvas.drawCircle(wIDth/2,paint); if (mschedual < 100) {//更改当前进度值,并重绘  mscheduaL++;  invalIDate(); } }}


在activity_main.xml中,需要用到自定义的属性,首先添加命名空间: xmlns:liu=”http://schemas.androID.com/apk/res/com.example.androIDcirclepro”

其中liu是自定义的一个前缀,随意命名的,com.example.androIDcirclepro是我们的应用的包名

activity_main.xmln内容如下:

<relativeLayout xmlns:androID="http://schemas.androID.com/apk/res/androID"  xmlns:tools="http://schemas.androID.com/tools"  xmlns:liu="http://schemas.androID.com/apk/res/com.example.androIDcirclepro"  androID:layout_wIDth="match_parent"  androID:layout_height="match_parent"  tools:context=".MainActivity" >  <com.example.androIDcirclepro.CirclePro    androID:layout_wIDth="match_parent"    androID:layout_height="match_parent"    liu:half="90dp"    liu:circlecolor="#fff0f0"    /></relativeLayout>

至此一个自定义的圆形进度条就完成了,是不是很简单。

总结

以上是内存溢出为你收集整理的Android实现自定义圆形进度条全部内容,希望文章能够帮你解决Android实现自定义圆形进度条所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错,欢迎将内存溢出网站推荐给程序员好友。

欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/web/1149499.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2022-05-31
下一篇 2022-05-31

发表评论

登录后才能评论

评论列表(0条)

保存