android paint 圆角 绘制_[BOT] 一种android中实现“圆角矩形”的方法

内容简介

文章介绍ImageView(方法也可以应用到其它View)圆角矩形(包括圆形)的一种实现方式，四个角可以分别指定为圆角。思路是利用“Xfermode + Path”来进行Bitmap的裁剪。

背景

圆角矩形实现的方法应该很多，网上一大堆。很怀疑为啥安卓的控件不内置这样的属性(我不知道有)？

之前用到的网络图片加载库(UniversalImageLoader等)都自带“圆形图片”这样的功能。这次需要的效果是圆角矩形，而且只有图片上面左、右两个角是圆角。然后藐似没发现有这种功能，刚好就自己实践下了。

一个需要强调的事实就是，像ImageView这样的控件，它可以是wrap_content这样的，最终大小不定，由对应的Drawable或Bitmap资源决定其大小。另一种情况下ImageView的大小是固定的，此时图片的实际填充效果(可视范围)受到scaleType的影响，不一定和View大小一致，不过往往会保持图片宽高比例，使得最终ImageView的宽高和显示的图片是一致的。

在画布上进行裁剪时，必须明确要操作的相关Bitmap的尺寸。由于上面的原因，根据实际ImageView大小的确定方式不同，要么是取ImageView的大小来作为整个“圆角矩形”的范围，要么是以实际展示的Bitmap的大小为准。

下面采取自定义ImageView子类的形式提供案例来说明“Xfermode + Path”实现圆角矩形的思路。而且会以ImageView固定大小(图片填充，scaleType=fitXY)的形式，也就是说要显示的图片是完全填充ImageView的，它们一样大小。如果以Bitmap为准，那么就得自己去设法得到原本ImageView的“设置下”显示的图片的范围，然后对应的去裁剪。这里为突出重点，就不考虑那么多了(-)。

clipPath()版本

方法android.graphics.Canvas#clipPath(android.graphics.Path)用来沿着Path指定的路线从目前的canvas裁剪出新的区域的canvas，就是改变了画布的可绘制区域。理解上，就像你拿着剪刀沿着圆环路径裁剪画纸就可以裁剪出一个圆型画纸一样。

Canvas类的一些API是直接绘制内容的操作，另一些是针对canvas(画布)本身做设置的。clip**系列方法就是对画布进行裁剪，之后的绘制(“可以简单地”认为之前通过canvas的绘制已经固定在画布对应存储图像的bitmap上了)都在裁剪后的区域中进行。

使用clipPath()实现圆角矩形的完整代码如下：

public class RoundCornerImageView1 extends ImageView {

private float[] radiusArray = { 0f, 0f, 0f, 0f, 0f, 0f, 0f, 0f };

public RoundCornerImageView1(Context context) {

super(context);

}

public RoundCornerImageView1(Context context, AttributeSet attrs) {

super(context, attrs);

}

/**

* 设置四个角的圆角半径

*/

public void setRadius(float leftTop, float rightTop, float rightBottom, float leftBottom) {

radiusArray[0] = leftTop;

radiusArray[1] = leftTop;

radiusArray[2] = rightTop;

radiusArray[3] = rightTop;

radiusArray[4] = rightBottom;

radiusArray[5] = rightBottom;

radiusArray[6] = leftBottom;

radiusArray[7] = leftBottom;

invalidate();

}

protected void onDraw(Canvas canvas) {

Path path = new Path();

path.addRoundRect(new RectF(0, 0, getWidth(), getHeight()), radiusArray, Path.Direction.CW);

canvas.clipPath(path);

super.onDraw(canvas);

}

}

注意需要先在canvas上执行clipPath()，之后再继续绘制原本的图片，这样就保证了绘制的内容范围限制在裁剪后的“圆角矩形画布”中。

上面方法addRoundRect()的原型如下：

/**

* Add a closed round-rectangle contour to the path. Each corner receives

* two radius values [X, Y]. The corners are ordered top-left, top-right,

* bottom-right, bottom-left

*

* @para