文档章节

在android中画圆形图片的几种办法

码农明明
 码农明明
发布于 2014/09/19 22:22
字数 1119
阅读 5472
收藏 62

在开发中经常会有一些需求,比如显示头像,显示一些特殊的需求,将图片显示成圆角或者圆形或者其他的一些形状。但是往往我们手上的图片或者从服务器获取到的图片都是方形的。这时候就需要我们自己进行处理,将图片处理成所需要的形状。正如茴香豆的的“茴”写法大于一种,经过我的研究,画出特殊图片的方法也不是一种,我发现了三种,且听我一一道来。

使用Xfermode 两图相交方式

通过查找资料发现android中可以设置画笔的Xfermode即相交模式,从而设置两张图相交之后的显示方式,具体模式见下图,源码可以去android apidemo。(SRC 为我们要画到目标图上的图即原图,DST为目标图)

由上图可以看到,如果我们需要画一个圆形的图,可以在画布上面先画一个跟目标大小一样的圆,然后xfermode选择SRC_IN,再讲我们的头像或者其他图画上去就可以了。同样也可以先画我们的图,再画圆,不过xfermode要选择DST_IN。两种都可以实现我们需要的效果。示例代码如下:

Paint p = new Paint();
p.setAntiAlias(true); //去锯齿
p.setColor(Color.BLACK);
p.setStyle(Paint.Style.STROKE);
Canvas canvas = new Canvas(bitmap);  //bitmap就是我们原来的图,比如头像
p.setXfermode(new PorterDuffXfermode(Mode.DST_IN));  //因为我们先画了图所以DST_IN
int radius = bitmap.getWidth; //假设图片是正方形的
canvas.drawCircle(radius, radius, radius, p); //r=radius, 圆心(r,r)

以上就是简单的示例,根据以上的16种模式你其实还可以做出更多效果。另外,只要你给一张相交图,那张图形状什么样,我们的图就可以显示成什么样。

通过裁剪画布区域实现指定形状的图形

Android中Canvas提供了ClipPath, ClipRect, ClipRegion 等方法来裁剪,通过Path, Rect ,Region 的不同组合,Android几乎可以支持任意形状的裁剪区域。因此,我们几乎可以获取任意形状的区域,然后在这个区域上画图,就可以获得,我们要的图片了,直接看示例。

int radius = src.getWidth() / 2; //src为我们要画上去的图,跟上一个示例中的bitmap一样。
Bitmap dest = Bitmap.createBitmap(src.getWidth(), src.getHeight(), Bitmap.Config.ARGB_8888);
Canvas c = new Canvas(dest);
Paint paint = new Paint();
paint.setColor(Color.BLACK);
paint.setAntiAlias(true);
Path path = new Path();
path.addCircle(radius, radius, radius, Path.Direction.CW);
c.clipPath(path);   //裁剪区域
c.drawBitmap(src, 0, 0, paint);  //把图画上去

使用BitmapShader

直接先看示例

int radius = src.getWidth() / 2;
BitmapShader bitmapShader = new BitmapShader(src, Shader.TileMode.REPEAT,
                Shader.TileMode.REPEAT);
Bitmap dest = Bitmap.createBitmap(src.getWidth(), src.getHeight(), Bitmap.Config.ARGB_8888);
Canvas c = new Canvas(dest);
Paint paint = new Paint();
paint.setAntiAlias(true);
paint.setShader(bitmapShader);
c.drawCircle(radius,radius, radius, paint);

Shader就是画笔的渲染器,本质上这中方法其实是画圆,但是渲染采用了我们的图片,然后就可以获得指定的形状了。但是我觉得,这个不适合画很复杂的图形,但是在内存消耗上,应该比第一种小很多。同时呢,设置Shader.TileMode.MIRROR,还可以实现镜面效果,也是极好的。

上面就是实现的三种方法,三种方法都可以画很多的形状,当然遇到非常非常非常非常复杂的情况,我是建议使用第一种,这时候可以让美工给一张末班形状图,省自己去代码绘制了。大家根据自己的需求选择。

在github上面CustomShapeImageView就是用了我们所说的第一种方法绘制。RoundedImageViewCircleImageView则使用bitmapshader完成,当然可能还有一些其他的控件,也许还有其他的一些实现方法,如果你知道,可以回复告诉我^_^。

原文地址:http://blog.isming.me/2014/09/19/draw-circle-image-in-android/,转载请注明出处。

© 著作权归作者所有

码农明明
粉丝 75
博文 21
码字总数 23978
作品 1
黄浦
程序员
私信 提问
加载中

评论(5)

hellowword
hellowword
Paint p = new Paint();
p.setAntiAlias(true); //去锯齿
p.setColor(Color.BLACK);
p.setStyle(Paint.Style.STROKE);
Canvas canvas = new Canvas(bitmap); //bitmap就是我们原来的图,比如头像
p.setXfermode(new PorterDuffXfermode(Mode.DST_IN)); //因为我们先画了图所以DST_IN
int radius = bitmap.getWidth; //假设图片是正方形的
canvas.drawCircle(radius, radius, radius, p); //r=radius, 圆心(r,r)

这句话不能达到效果吧!我试了。。。。
gccd
gccd
不错!如果是单纯圆形或者圆角,我用的是 ImageLoader 中 RoundedBitmapDisplayer 来实现。一般头像 略缩图不会太大。
Glide
Glide
赞不绝口。
亓斌哥哥
亓斌哥哥
mark
hccy_0324
hccy_0324
学习…
OSChina 技术周刊——Java 9 终极特性列表

每周技术抢先看,总有你想要的! 移动开发 【翻译】创建一个跟分辨率无关的 iOS 8 应用 【软件】NextApp —— 开源的手机博客 App 自动生成系统 【软件】哎嘛——来自 @Tonlin 开发的 OSC 客...

OSC编辑部
2014/09/21
2.3K
6
Android必备:Android UI控件的了解与学习

看这里:Android必备:Android UI控件的了解与学习 由于工作需要,最近一段时间,需要进行Android App开发的学习,之前简单的进行过Android的了解,对于基本的Android环境的搭建等已经有过整...

Realfighter
2015/02/26
558
0
Android应用实现多语言切换

关于Android应用实现多语言切换,有好几种办法,网上也搜到很多资料,这里有个简单有效的办法。 步骤如下: 在资源文件中新建一个文件夹values-en,在里面新建一个strings.xml,把默认value...

未来程序员
2018/06/29
0
0
Android Activity概要

一个Activity是提供给用户的用于与程序进行交互的界面组件,如打电话、拍照片、发邮件、或看地图等。每个Activity就是一个用来描画用户界面的接口,通常这个窗口时全屏的,但是也可以比屏幕小...

长平狐
2012/10/16
56
0
Android通过onDraw实现在View中绘图操作

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:layoutwidth="matchparent" android:layoutheight=......

Thanks
2012/11/28
6.5K
1

没有更多内容

加载失败,请刷新页面

加载更多

jquery底层函数-jQuery.ajaxSetup()

jQuery.ajaxSetup( options )返回: 描述: 为以后要用到的Ajax请求设置默认的值 添加的版本: 1.1jQuery.ajaxSetup( options ) options 类型: PlainObject 一个用来配置Ajax请求的"{键:值}"对,......

前端老手
40分钟前
7
0
Qt编写自定义控件56-波浪曲线

一、前言 波浪曲线控件,其实是之前一个水波进度条控件的一个核心,其实就是利用正弦曲线来生成对应的坐标进行绘制,把这个功能单独提取出来,是为了更详细的研究各种正弦余弦等拓展效果,当...

飞扬青云
46分钟前
6
0
深入理解计算机系统cp1:存储单位与编码

摘要: 理解计算机是如何存储数据的。 原文:深入理解计算机系统cp1:存储单位与编码 作者:Chor Fundebug经授权转载,版权归原作者所有。 1. 存储单位 位:即 bit,表示二进制位,要么是 0 ...

Fundebug
49分钟前
6
0
Python查询比特币实时价格

在本文中我们将学习如何使用使用coinmarketcap提供的比特币行情API,编写Python程序来获取像比特币、莱特币或以太币之类的区块链数字货币的实时行情/实时价格。 1、比特币行情API调用代码 我...

汇智网教程
今天
8
0
爬虫平台Crawlab核心原理--自动提取字段算法

⚠注意: 可配置爬虫现在仅在Python版本(v0.2.1-v0.2.4)可用,在最新版本Golang版本(v0.3.0)还暂时不可用,后续会加上,请关注近期更新 背景 实际的大型爬虫开发项目中,爬虫工程师会被要...

tikazyq
今天
6
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部