码迷,mamicode.com
首页 > 移动开发 > 详细

Android 自己定义View学习(2)

时间:2017-06-03 15:02:44      阅读:309      评论:0      收藏:0      [点我收藏+]

标签:load   index   timer   构造   drawtext   awl   mod   declare   art   

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

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


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();

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

接下来看看终于效果

技术分享



项目源代码




Android 自己定义View学习(2)

标签:load   index   timer   构造   drawtext   awl   mod   declare   art   

原文地址:http://www.cnblogs.com/cxchanpin/p/6937163.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!