【android】绘制圆环的三种方式

在android中要绘制圆环，暂时知道有三种方式。分别是：

一、设置画笔的style为stoke，绘制圆

这里是先绘制内圆，然后绘制圆环（圆环的宽度就是paint设置的paint.setStrokeWidth的宽度），最后绘制外圆。

请看核心源码：

[java] view plaincopy

<span xmlns="http://www.w3.org/1999/xhtml" style="">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);
}
}
</span>

总结：

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

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

示例如下（底色是预览摄像头的视频）：

二、利用canvas.drawArc实现

上文已经绘制了圆环，但仔细分析就知，如果只需要圆环的话，那么只绘制圆环就可以，不用画内圆和外圆了。事实证明也是如此。

但是要做成和下面的圆环透明度不一的效果上面的方法还是达不中：

用drawCircle不中了，经查android提供了绘制圆弧的函数drawArc，参考http://zhidao.baidu.com/question/469977150.html，也可以看这里http://blog.chinaunix.net/uid-23392298-id-3345789.html

canvas.drawArc(new RectF(0, 0, 128, 128), 0, 360, true, new Paint(
Paint.ANTI_ALIAS_FLAG));
参数1：圆的范围大小
参数2：起始角度
参数3：圆心角角度，360为圆，180为半圆
参数4：中心
参数5：画笔Paint，可以设置画线or填充，设置颜色，设置线的粗细等等第四个参数

最关键的是第一个参数RectF，在什么地方绘制圆弧就是由这个矩形的位置确定的。根据上文，这个RectF应该是内切圆弧的外圆（尽管没画，但还是有）。所以其左上点及右下点坐标为：

RectF rect2 = new RectF(center-(innerCircle + 1 +ringWidth/2),center-(innerCircle + 1 +ringWidth/2), center+(innerCircle + 1 +ringWidth/2), center+(innerCircle + 1 +ringWidth/2));

为了绘制出透明度不同的圆环分两部来绘制：

this.paint.setARGB(200, 127, 255, 212);
       this.paint.setStrokeWidth(ringWidth);
       //绘制不透明部分
       canvas.drawArc(rect2, 180+startAngle, 90, false, paint);
       canvas.drawArc(rect2, 0+startAngle, 90, false, paint);
       //绘制透明部分
       this.paint.setARGB(30, 127, 255, 212);
       canvas.drawArc(rect2, 90+startAngle, 90, false, paint);
       canvas.drawArc(rect2, 270+startAngle, 90, false, paint);

上面的代码当startAngle = 0时，绘制的是一个静态的透明度交替的圆弧。接着要让它转起来。增加代码：

startAngle+=10;
if(startAngle == 180)
startAngle = 0;

事实上后两句也可以不增加，仿照前文SurfaceView绘制旋转动画的例子用这种求余的思想，(rotate += 48) % 360，把上面角度也弄个%360,也是可以的。

剩下的事就是让这个东西循环执行了。在super.onDraw(canvas);这句代码后面加 invalidate();就可以了！透明圆环就转起来了。

三、先绘制外圆，再把外圆中内圆所占的区域擦除

[java] view plain copy

canvas.drawCircle(mCirX, mCirY, mRadius, paint);
paint.setAlpha(0);
paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.SRC_IN));
canvas.drawCircle(mCirX, mCirY, mRadius-mRingWidth, paint);

参考：http://blog.csdn.net/yanzi1225627/article/details/8581840

http://blog.csdn.net/yanzi1225627/article/details/8581897

【android】绘制圆环的三种方式相关推荐

pyecharts学习(part1)--绘制图表的三种方式
学习笔记,仅供参考,有错必究文章目录 pyecharts学习绘制图表的三种方式绘制的图表生成HTML jupyter notebook 内嵌展示 pyecharts生成图片 pyecharts学 ...
Android 使用OpenCV的三种方式(Android Studio)
from: http://blog.csdn.net/sbsujjbcy/article/details/49520791 其实最早接触OpenCV是很久很久之前的事了,大概在2013年的5,6月份, ...
android xml解析的三种方式
2019独角兽企业重金招聘Python工程师标准>>> 在android开发中,经常用到去解析xml文件,常见的解析xml的方式有一下三种:SAX.Pull.Dom解析方式.最近做了 ...
Android录制音频的三种方式
对于录制音频,Android系统就都自带了一个小小的应用,可是使用起来可能不是特别的灵活.所以有提供了另外的俩种. 下边来介绍下这三种录制的方式; 1.通过Intent调用系统的录音器功能,然后在录制 ...
Android解析XML的三种方式
在Android中提供了三种解析XML的方式:DOM(Document Objrect Model),SAX(Simple API XML),以及Android推荐的Pull解析方式. 如图: 本篇博 ...
Android 音频录制的三种方式
对于录制音频,Android系统就都自带了一个小小的应用,可是使用起来可能不是特别的灵活.所以有提供了另外的俩种. 下边来介绍下这三种录制的方式; 1.通过Intent调用系统的录音器功能,然后在录制 ...
转载.Android HAL实现的三种方式(1) - 基于JNI的简单HAL设计
现在在Android上的HAL开发总的来说还是随意性比较大,Android也并没有规范好一个具体的框架,下面我将根据Jollen的Mokoid工程,自己做了一些改动,分别给大家介绍一下三种实现方式. ...
Android 延时操作的三种方式
在Android开发中我们可能会有延时执行某个操作的需求,例如我们启动应用的时候,一开始呈现的是引导页面,3秒后进入主界面,这就是一个延时操作. 下面是实现延时操作的三种方法: 一.使用线程的休眠实现 ...
android动画影子效果,Android实现阴影效果的三种方式
8种机械键盘轴体对比本人程序员,要买一个写代码的键盘,请问红轴和茶轴怎么选? 实现Android阴影共有三种方式:使用.9图(略).设置视图的高度.在layer-list资源文件中模拟阴影效果,本篇 ...

【android】绘制圆环的三种方式

【android】绘制圆环的三种方式相关推荐

最新文章

热门文章