在開(kāi)發(fā)中經(jīng)常會(huì)有一些需求,比如顯示頭像，顯示一些特殊的需求,將圖片顯示成圓角或者圓形或者其他的一些形狀。但是往往我們手上的圖片或者從服務(wù)器獲取到的圖片都是方形的。這時(shí)候就需要我們自己進(jìn)行處理，將圖片處理成所需要的形狀。正如茴香豆的的“茴”寫(xiě)法大于一種，經(jīng)過(guò)我的研究，畫(huà)出特殊圖片的方法也不是一種，我發(fā)現(xiàn)了三種，且聽(tīng)我一一道來(lái)。
使用Xfermode 兩圖相交方式
通過(guò)查找資料發(fā)現(xiàn)android中可以設(shè)置畫(huà)筆的Xfermode即相交模式，從而設(shè)置兩張圖相交之后的顯示方式，具體模式見(jiàn)下圖，源碼可以去android apidemo。(SRC 為我們要畫(huà)到目標(biāo)圖上的圖即原圖，DST為目標(biāo)圖)
由上圖可以看到，如果我們需要畫(huà)一個(gè)圓形的圖，可以在畫(huà)布上面先畫(huà)一個(gè)跟目標(biāo)大小一樣的圓，然后xfermode選擇SRC_IN，再講我們的頭像或者其他圖畫(huà)上去就可以了。同樣也可以先畫(huà)我們的圖，再畫(huà)圓，不過(guò)xfermode要選擇DST_IN。兩種都可以實(shí)現(xiàn)我們需要的效果。示例代碼如下：
Paint p = new Paint();
p.setAntiAlias(true); //去鋸齒
p.setColor(Color.BLACK);
p.setStyle(Paint.Style.STROKE);
Canvas canvas = new Canvas(bitmap); //bitmap就是我們?cè)瓉?lái)的圖,比如頭像
p.setXfermode(new PorterDuffXfermode(Mode.DST_IN)); //因?yàn)槲覀兿犬?huà)了圖所以DST_IN
int radius = bitmap.getWidth; //假設(shè)圖片是正方形的
canvas.drawCircle(radius, radius, radius, p); //r=radius, 圓心(r,r)
以上就是簡(jiǎn)單的示例，根據(jù)以上的16種模式你其實(shí)還可以做出更多效果。另外，只要你給一張相交圖，那張圖形狀什么樣，我們的圖就可以顯示成什么樣。
通過(guò)裁剪畫(huà)布區(qū)域?qū)崿F(xiàn)指定形狀的圖形
Android中Canvas提供了ClipPath, ClipRect, ClipRegion 等方法來(lái)裁剪，通過(guò)Path, Rect ,Region 的不同組合，Android幾乎可以支持任意形狀的裁剪區(qū)域。因此，我們幾乎可以獲取任意形狀的區(qū)域，然后在這個(gè)區(qū)域上畫(huà)圖，就可以獲得，我們要的圖片了，直接看示例。
int radius = src.getWidth() / 2; //src為我們要畫(huà)上去的圖，跟上一個(gè)示例中的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); //裁剪區(qū)域
c.drawBitmap(src, 0, 0, paint); //把圖畫(huà)上去
使用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就是畫(huà)筆的渲染器，本質(zhì)上這中方法其實(shí)是畫(huà)圓，但是渲染采用了我們的圖片，然后就可以獲得指定的形狀了。但是我覺(jué)得，這個(gè)不適合畫(huà)很復(fù)雜的圖形，但是在內(nèi)存消耗上，應(yīng)該比第一種小很多。同時(shí)呢，設(shè)置Shader.TileMode.MIRROR，還可以實(shí)現(xiàn)鏡面效果，也是極好的。
上面就是實(shí)現(xiàn)的三種方法，三種方法都可以畫(huà)很多的形狀，當(dāng)然遇到非常非常非常非常復(fù)雜的情況，我是建議使用第一種，這時(shí)候可以讓美工給一張末班形狀圖，省自己去代碼繪制了。大家根據(jù)自己的需求選擇。
在github上面CustomShapeImageView就是用了我們所說(shuō)的第一種方法繪制。RoundedImageView 和CircleImageView則使用bitmapshader完成,當(dāng)然可能還有一些其他的控件，也許還有其他的一些實(shí)現(xiàn)方法，如果你知道，可以回復(fù)告訴我＾＿＾。
原文地址：http://blog.isming.me/2014/09/19/draw-circle-image-in-android/，轉(zhuǎn)載請(qǐng)注明出處。
