`
rys5851968
  • 浏览: 149310 次
社区版块
存档分类
最新评论

Android开发:在ImageView上绘制圆环

 
阅读更多

绘制圆环其实很简单,有大概以下三种思路. 这里先说网上提到的一种方法。思路是先绘制内圆,然后绘制圆环(圆环的宽度就是paint设置的paint.setStrokeWidth的宽度),最后绘制外圆。

请看核心源码:

package yan.guoqi.rectphoto;

import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.Paint.Style;
import android.graphics.RectF;
import android.util.AttributeSet;
import android.widget.ImageView;

public class DrawImageView extends ImageView {

	private final Paint paint;
	private final Context context;
	public DrawImageView(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(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, 10);   //圆环宽度
		
		// 第一种方法绘制圆环
		//绘制内圆 
 this.paint.setARGB(255, 138, 43, 226);
		this.paint.setStrokeWidth(2);
		canvas.drawCircle(center, center, innerCircle, this.paint);		
		
 //绘制圆环 
 this.paint.setARGB(255, 138, 43, 226);
		this.paint.setStrokeWidth(ringWidth);
		canvas.drawCircle(center, center, innerCircle + 1 +ringWidth/2, this.paint);		
		
 //绘制外圆
		this.paint.setARGB(255, 138, 43, 226);
		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);  
	} 
}
总结:

1,这种分三次来绘制的方法,可以将圆环的内圆 圆环 和外圆的颜色设成不一样的,对paint进行三次设置。还可以将绘制圆环的paint透明度设成10左右就会有圆环透明的效果。

2,三次绘制时的canvas.drawCircle圆心都是(center,center),但三次半径确实不一样的。尤其是第二次绘制圆环的时候,半径是innerCircle + 1 +ringWidth/2。这里的加1是第一次外圆paint.setStrokeWidth(2);宽度设成2,也就是说单条线的宽度1。后面的ringWidth/2也是同理。

示例如下(底色是预览摄像头的视频):


参考:http://blog.csdn.net/xiangjai/article/details/7727528


分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics