Android自定义View --- 绘制圆环

Android自定义View实现很简单

继承View，重写构造函数、onDraw，（onMeasure）等函数。

如果自定义的View需要有自定义的属性，需要在values下建立attrs.xml。在其中定义你的属性。

在使用到自定义View的xml布局文件中需要加入xmlns:前缀="http://schemas.android.com/apk/res/你的自定义View所在的包路径".

在使用自定义属性的时候，使用前缀：属性名，如my:textColor="#FFFFFFF"。

例子：

package com.cn.myvdun;

import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Paint;
import android.util.AttributeSet;
import android.view.View;

public class RingView extends View {

	private final  Paint paint;
	private final Context context;
	
	public RingView(Context context) {
		
		// TODO Auto-generated constructor stub
		this(context, null);
	}

	public RingView(Context context, AttributeSet attrs) {
		super(context, attrs);
		// TODO Auto-generated constructor stub
		this.context = context;
		this.paint = new Paint();
		this.paint.setAntiAlias(true); //消除锯齿
		this.paint.setStyle(Paint.Style.STROKE); //绘制空心圆 
	}

	@Override
	protected void onDraw(Canvas canvas) {
		// TODO Auto-generated method stub
		int center = getWidth()/2;
		int innerCircle = dip2px(context, 83); //设置内圆半径
		int ringWidth = dip2px(context, 5); //设置圆环宽度
		
		//绘制内圆
		this.paint.setARGB(155, 167, 190, 206);
		this.paint.setStrokeWidth(2);
		canvas.drawCircle(center,center, innerCircle, this.paint);
		
		//绘制圆环
		this.paint.setARGB(255, 212 ,225, 233);
		this.paint.setStrokeWidth(ringWidth);
		canvas.drawCircle(center,center, innerCircle+1+ringWidth/2, this.paint);
		
		//绘制外圆
		this.paint.setARGB(155, 167, 190, 206);
		this.paint.setStrokeWidth(2);
		canvas.drawCircle(center,center, innerCircle+ringWidth, this.paint);

		
		super.onDraw(canvas);
	}
	
	
	/**
	 * 根据手机的分辨率从 dp 的单位 转成为 px(像素)
	 */
	public static int dip2px(Context context, float dpValue) {
		final float scale = context.getResources().getDisplayMetrics().density;
		return (int) (dpValue * scale + 0.5f);
	}
}

布局文件：

<com.cn.myvdun.RingView
                    	android:layout_width="@dimen/ring_view_width"
           		android:layout_height="@dimen/ring_view_height" 
 >

参考的代码：

自定义view