文章目录

上篇文章我们实现了用透明图片的方式来实现圆角切图。但是采用透明浮层的方法有很多问题不完全符合我们的要求。在这篇文章中我们采用一种不使用额外的图片的替代方案来实现相同的圆角图片的效果。

在本文开始之前,我首先声明写着一些列的技术文章是我完全免费为大家提供的。我第一次学习用BitmapShader创建圆角图片是从Romain的一篇博客文章。我们将会创建一些更酷的效果,下面先罗列一些用到的技术及说明:

Shader是非常有用和给力的图像填充类。Paint对象通过使用Shader增加渲染效果,然后画图到Canvas。

BitmapShader除了具有Shader的特性外还支持对Bitmapde各种操作。本文中我们不再需要关心图片的大小问题了。

为了跟上篇文章中的图像效果看起来相同,我们计算图片的圆弧半斤大概是图片最小边的1/8。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
public Bitmap processImage(Bitmap bitmap) {
Bitmap bmp;

bmp = Bitmap.createBitmap(bitmap.getWidth(),
bitmap.getHeight(), Bitmap.Config.ARGB_8888);
BitmapShader shader = new BitmapShader(bitmap,
BitmapShader.TileMode.CLAMP,
BitmapShader.TileMode.CLAMP);

float radius = Math.min(bitmap.getWidth(),
bitmap.getHeight()) / RADIUS_FACTOR;
Canvas canvas = new Canvas(bmp);
Paint paint = new Paint();
paint.setAntiAlias(true);
paint.setShader(shader);

RectF rect = new RectF(0, 0,
bitmap.getWidth(), bitmap.getHeight());
canvas.drawRoundRect(rect, radius, radius, paint);

return bmp;
}

这也是一个很简单的例子。我们只需要用源图创建一个BitmapShader,然后添加给Paint对象,最后用Paint画圆角矩形。

比较上一篇文章很容易就可以发现内存需求小多了。这里我们只需要两个Bitmap对象而在上篇博客中我们需要三个Bitmap对象。还有就是这种方法对图片的大小没有要求。采用浮层的方法我们需要对图片进行放大缩小。从产生的效果图片中我们可以发现,本文提供的方法比较之前的方法很难出现图片变模糊的家问题。

part2

就像我之前提过的,这种方法除了实现圆角外还可以实现很多非常赞的效果。在下一篇文章中我们将要实现像WhatsApp中一样的聊天消息形状的效果。

切图之不规则图形系列源码下载,英文原版地址


本文地址 http://94275.cn/2014/07/27/irregular-shapes-part-2/ 作者为 Zhenguo

author:Zhenguo
Author: Zhenguo      Blog: 94275.cn/     Email: jinzhenguo1990@gmail.com
I have almost 10 years of application development experience and have a keen interested in the latest emerging technologies. I use my spare time to turn my experience, ideas and love for IT tech into informative articles, tutorials and more in hope to help others and learn more.
文章目录
返回顶部