自定义控件Android圆环进度条

版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/u012733501/article/details/50464240

Android自定义控件学习之圆环进度条，学习了一段时间，自定义控件，对一些自定义所需要的Api，基本上也掌握了，但是对于比较复杂的自定义控件，他们的坐标计算

一直比较恶心（可能，我数学比较差~），记录自定义控件学习过程。

   对于圆环进度条的自定义比较简单的，其实就是3个圆的嵌套

<?xml version="1.0" encoding="utf-8"?>
<resources>

    <declare-styleable name="ProgressCirCle">

        <!-- 默认外环颜色 -->
        <attr name="circleoutcolor" format="color"></attr>
        <!-- 内环颜色 -->
        <attr name="circleincolor" format="color"></attr>
        <!-- 文字显示 -->
        <attr name="progressnumber" format="string"></attr>
        
        <!-- 环内文字大小 -->
        <!-- 进度外环颜色 -->
    </declare-styleable>

</resources>

由于只需实现功能，所以其他的属性省略

初始化画笔等等

public ProgressCirCle(Context context, AttributeSet attrs, int defStyleAttr) {
		super(context, attrs, defStyleAttr);
		TypedArray arrayattr = context.getTheme().obtainStyledAttributes(attrs,
				R.styleable.ProgressCirCle, defStyleAttr, 0);
		int indexCount = arrayattr.getIndexCount();
		for (int i = 0; i < indexCount; i++) {
			switch (arrayattr.getIndex(i)) {
			case R.styleable.ProgressCirCle_circleincolor:
				// 内环
				circlein = arrayattr.getColor(arrayattr.getIndex(i),
						Color.BLACK);
				break;
			case R.styleable.ProgressCirCle_circleoutcolor:
				// 外环
				circleout = arrayattr
						.getColor(arrayattr.getIndex(i), Color.RED);
				break;
			case R.styleable.ProgressCirCle_progressnumber:
				progress = arrayattr.getString(arrayattr.getIndex(i));
				// 默认多少
				break;
			default:
				break;
			}
		}
		outpaint = new Paint();
		outpaint.setStyle(Paint.Style.STROKE);
		outpaint.setStrokeWidth(50);
		// 消除锯齿
		outpaint.setAntiAlias(false);
		// 设置外环颜色(动态)
		outpaint.setColor(Color.BLUE);
		inpaint = new Paint();
		// 消除锯齿
		inpaint.setAntiAlias(false);
		inpaint.setStyle(Paint.Style.STROKE);
		inpaint.setStrokeWidth(34);
		// 设置内环颜色
		inpaint.setColor(circlein);
		defaultpaint = new Paint();
		// 消除锯齿
		defaultpaint.setAntiAlias(false);
		defaultpaint.setStyle(Paint.Style.STROKE);
		// 设置默认外环颜色
		defaultpaint.setColor(circleout);
		defaultpaint.setStrokeWidth(34);

		// 设置矩形测得文字宽度
		rect = new Rect();
		textpaint = new Paint();
		textpaint.setTextSize(40);
		textpaint.getTextBounds(progress, 0, progress.length(), rect);
		textpaint.setColor(Color.BLACK);

	}

实现onDraw() 并画圆

@Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        //画内环
        canvas.drawCircle(viewwitdh / 2, viewwitdh / 2, viewwitdh / 4, inpaint);
        //画默认环
        canvas.drawArc(rectf, 0, 360, false, defaultpaint);
        //画文字
        canvas.drawText(progress, viewwitdh / 2 - rect.width() / 2,
                viewwitdh / 2, textpaint);
        if (isstart) {
            //画进度环
            canvas.drawArc(rectf, 0, number, false, outpaint);
        }
    }

重写onMeaSure，测量控件大小

@Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        super.onMeasure(widthMeasureSpec, heightMeasureSpec);
        int height = 0;
        int width = 0;
        int widthmode = MeasureSpec.getMode(widthMeasureSpec);
        widthsize = MeasureSpec.getSize(widthMeasureSpec);
        int heightmode = MeasureSpec.getMode(heightMeasureSpec);
        heightsize = MeasureSpec.getSize(heightMeasureSpec);
        if (widthmode == MeasureSpec.EXACTLY) {
            width = widthsize;
        } else if (widthmode == MeasureSpec.AT_MOST) {
            width = 150 + getPaddingLeft() + getPaddingRight();
        }
        if (heightmode == MeasureSpec.EXACTLY) {
            height = heightsize;
        } else if (heightmode == MeasureSpec.AT_MOST) {
            height = 150 + getPaddingTop() + getPaddingBottom();
        }
        setMeasuredDimension(width, height);
        if (heightsize >= widthsize) {
            viewwitdh = widthsize;
        } else {
            viewwitdh = heightsize;
        }
        rectf = new RectF((float) (viewwitdh * 0.2), (float) (viewwitdh * 0.2),
                (float) (viewwitdh * 0.8), (float) (viewwitdh * 0.8));
    }

提供输入进度数据

	public void setprogress(float num) {
		isstart = true;
		if (num > 100) {
			progress = "完成~";
		} else {
			progress = (int) num + "%";
			number = (float) (num * 3.6);
		}
		this.invalidate();
	}

                                                                         

 

  

到此一个简单的自定义进度条就完成了~