Android 自己定义View学习

Posted 2020-09-21 cxchanpin

上一篇学习了基本使用方法，今天学一下略微复杂一点的。先看一下效果图

为了完毕上面的效果还是要用到上一期开头的四步

1，属性应该要有颜色，要有速度

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

    <attr name="speed" format="integer" />
    <attr name="circleColor" format="color" />

    <declare-styleable name="ViewCircle">
        <attr name="speed" />
        <attr name="circleColor" />
    </declare-styleable>

</resources>

假设对这里有什么不了解能够看我上一篇Android 自己定义View学习(1)

2, 在构造方法中获得这些属性

	TypedArray a = context.obtainStyledAttributes(attrs,
				R.styleable.ViewCircle, defStyle, 0);
		int n = a.getIndexCount();
		for (int i = 0; i < n; i++) {
			int attr = a.getIndex(i);
			switch (attr) {
			case R.styleable.ViewCircle_speed:
				mSpeed = a.getInteger(attr, 300);
				break;
			case R.styleable.ViewCircle_circleColor:
				mColor = a.getColor(attr, Color.GREEN);
				break;
			}
		}
		a.recycle();

3,这次我们不重写onMeasure

4,重写onDraw

protected void onDraw(Canvas canvas) {
		// 居中
		canvas.translate(getWidth() / 2, getHeight() / 2);
		// 画出三个圆
		canvas.drawCircle(0, 0, 200, mCircle);
		canvas.drawCircle(0, 0, 180, mCentreCircle);
		canvas.drawCircle(0, 0, 160, mNexCircle);
        //进度
		RectF rectF = new RectF(-180, -180, 180, 180);
		canvas.drawArc(rectF, -90, mProgress, true, mTimer);
        //算出字体所占大小，使其居中
		mLinePaint.getTextBounds(String.valueOf(mProgress), 0,
				String.valueOf(mProgress).length(), rect);
		canvas.drawText(String.valueOf(mProgress), -rect.width() / 2, 0,
				mLinePaint);
		//总进度为六十
		int count = 60;
		//刻度从190--200
		int y = 190;
		Rect rect = new Rect();
		mLinePaint.getTextBounds("00", 0, "00".length(), rect);
		//当i%10==0时画一道刻度线
		for (int i = 0; i < count; i++) {
			if (i % 10 == 0) {
				canvas.drawLine(0, y, 0, 200, mLinePaint);
				canvas.drawText(String.valueOf(i / 10) + "0",
						-rect.width() / 2, 220, mLinePaint);
			}
			canvas.rotate(360 / count, 0, 0);
		}
	}

我们注意一下canvas.drawArc(rectF, -90, mProgress, true, mTimer);

我们传进去的为true效果就是

假设我们传进去false

能够明显的看到区别，没事也能够试试我们这个demo传进去false会是什么效果。

接下来为了让这个进度动起来我们就要用到线程来刷新ui

new Thread() {
			public void run() {
				while (true) {
					mProgress++;
					if (mProgress == 360) {
						mProgress = 0;
					}

					postInvalidate();
					try {
						Thread.sleep(mSpeed);
					} catch (InterruptedException e) {
						e.printStackTrace();
					}
				}
			};
		}.start();

这样基本就差点儿相同了。

。

接下来看看终于效果

项目源代码