Android UI開發第四十二篇——實現實現易信的圓形圖像和對話列表的圖像顯示部分 Android--Matrix圖片變換處理 Paint的效果研究

   顯示圖像時，不少個性化顯示，圓形或圓角、氣泡等等，咱們這一篇文章探討一下圓形和睦泡的顯示，仿照易信中的實現，先看下效果圖：

代碼：

public class RoundImageView extends ImageView {
		
	public RoundImageView(Context context) {
		super(context);
		// TODO Auto-generated constructor stub
	}

	public RoundImageView(Context context, AttributeSet attrs) {
		super(context, attrs);

	}

	public RoundImageView(Context context, AttributeSet attrs, int defStyle) {
		super(context, attrs, defStyle);

	}

	@Override
	protected void onDraw(Canvas canvas) {
		
		Drawable drawable = getDrawable();

		if (drawable == null) {
			return;
		}

		if (getWidth() == 0 || getHeight() == 0) {
			return; 
		}

		Bitmap bitmapBorder =BitmapFactory.decodeResource(getResources(), R.drawable.border); 
		Bitmap bitmapMask =BitmapFactory.decodeResource(getResources(), R.drawable.mask);
		
		int _width = bitmapBorder.getWidth();
		int _height = bitmapBorder.getHeight();
		
		Paint paint = new Paint();
		PorterDuffXfermode xfermode = new PorterDuffXfermode(PorterDuff.Mode.SRC_IN);
	
		
		Bitmap bitmap =  ((BitmapDrawable)drawable).getBitmap() ;
		canvas.drawBitmap(bitmapBorder, 0, 0, paint);
		int saveFlags = Canvas.MATRIX_SAVE_FLAG | Canvas.CLIP_SAVE_FLAG | Canvas.HAS_ALPHA_LAYER_SAVE_FLAG | Canvas.FULL_COLOR_LAYER_SAVE_FLAG | Canvas.CLIP_TO_LAYER_SAVE_FLAG;
		canvas.saveLayer(0, 0, _width, _height, null, saveFlags);
		canvas.drawBitmap(bitmapMask, 0, 0, paint);
		paint.setXfermode(xfermode);
		int left = _width/2 - bitmap.getWidth() /2;
		int top = _height/2 - bitmap.getHeight()/2;
		canvas.drawBitmap(bitmap, left, top, paint);
		paint.setXfermode(null);
		canvas.restore();

	}

}

    上述效果使用了「遮罩」的方式實現，使用了Paint的Xfermode。咱們介紹下setXfermode方法，setXfermode方法用來設置兩張圖片相交時的模式。

        PorterDuff.Mode.CLEAR 清除畫布上圖像 
       PorterDuff.Mode.SRC 顯示上層圖像 
       PorterDuff.Mode.DST 顯示下層圖像 
       PorterDuff.Mode.SRC_OVER上下層圖像都顯示，上層居上顯示 
       PorterDuff.Mode.DST_OVER 上下層都顯示,下層居上顯示 
       PorterDuff.Mode.SRC_IN 取兩層圖像交集部門,只顯示上層圖像 
       PorterDuff.Mode.DST_IN 取兩層圖像交集部門,只顯示下層圖像 
       PorterDuff.Mode.SRC_OUT 取上層圖像非交集部門 
       PorterDuff.Mode.DST_OUT 取下層圖像非交集部門 
       PorterDuff.Mode.SRC_ATOP 取下層圖像非交集部門與上層圖像交集部門 
       PorterDuff.Mode.DST_ATOP 取上層圖像非交集部門與下層圖像交集部門 
       PorterDuff.Mode.XOR 取兩層圖像的非交集部門

    RoundImageView使用了自定義View實現，重點重寫了onDraw方法，使用了paint、canvas，這兩個自定義View必須掌握的兩個基礎工具，這裏就很少寫了，提供幾個參考：

 

Android 2D Graphics學習（一）、android.graphics介紹

Android--Matrix圖片變換處理

Paint的效果研究

/**

* @author 張興業

*  http://blog.csdn.net/xyz_lmn

*  個人新浪微博：@張興業TBOW

*/