Android中使用Matrix控制圖形變換和制作倒影效果的方法

更新時間：2016年04月15日 15:32:19 作者：summerpxy

這篇文章主要介紹了Android中使用Matrix控制圖形變換和制作倒影效果的方法,用Matrix來作矩陣變化十分強大,文中的制作倒影的例子便是一個十分巧妙的運用,需要的朋友可以參考下

最近在使用Matrix進行繪圖的操作。對Matrix的一些方法有了一些更深的體會，記下來，以便日后復習。
Matrix常用的方法：

一、變換方法：

Matrix提供了translate(平移)、rotate(旋轉(zhuǎn))、scale(縮放)、skew(傾斜)四種操作，這四種操作的內(nèi)部實現(xiàn)過程都是通過matrix.setValues(…)來設置矩陣的值來達到變換圖片的效果。
Matrix的每種操作都有set、pre、post三種操作，set是清空隊列再添加，pre是在隊列最前面插入，post是在隊列最后面插入。
pre方法表示矩陣前乘，例如：變換矩陣為A，原始矩陣為B，pre方法的含義即是A*B
post方法表示矩陣后乘，例如：變換矩陣為A，原始矩陣為B，post方法的含義即是B*A

1.matrix.preScale(0.5f, 1);
2.matrix.preTranslate(10, 0);
3.matrix.postScale(0.7f, 1);
4.matrix.postTranslate(15, 0);
等價于：
translate(10, 0) -> scale(0.5f, 1) -> scale(0.7f, 1) -> translate(15, 0)
注意：后調(diào)用的pre操作先執(zhí)行，而后調(diào)用的post操作則后執(zhí)行。

set方法一旦調(diào)用即會清空之前matrix中的所有變換，例如：
1.matrix.preScale(0.5f, 1);
2.matrix.setScale(1, 0.6f);
3.matrix.postScale(0.7f, 1);
4.matrix.preTranslate(15, 0);
等價于
translate(15, 0) -> scale(1, 0.6f) -> scale(0.7f, 1)

matrix.preScale (0.5f, 1)將不起作用。

二、映射方法

Matrix提供了mapXXX的方法，用于獲取經(jīng)matrix映射之后的值。主要有：mapPoints，mapRects，mapVectors等方法。
這些方法你會使用到：在你需要記住matrix操作之后的數(shù)值的時候。比如：記住矩形旋轉(zhuǎn)34°（rotate）之后四個點的坐標。（你可以嘗試著自己計算，你會發(fā)現(xiàn)很復雜，還不精確）

需要注意的是，matrix的某些方法使用到中心點的時候，如果不設置，默認是以（0，0）為中心點的。

記下來，以免忘記。

三、制作倒影效果
利用matrix可以實現(xiàn)各種圖片的特效，接下來就用marix加上漸變色實現(xiàn)圖片倒影的效果，步驟如下：
1. 獲取需要倒影效果的圖片，這里取原圖片的一半
2. 添加顏色漸變到倒影圖片上
具體的實現(xiàn)如下面代碼所述，我們以一種自定義view的形式給出效果圖，代碼如下：

package com.flection.view;
 
import com.flection.main.R;
 
import android.annotation.SuppressLint;
import android.content.Context;
import android.graphics.Bitmap;
import android.graphics.Bitmap.Config;
import android.graphics.BitmapFactory;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.LinearGradient;
import android.graphics.Matrix;
import android.graphics.Paint;
import android.graphics.PorterDuffXfermode;
import android.graphics.Shader.TileMode;
import android.graphics.drawable.BitmapDrawable;
import android.util.AttributeSet;
import android.view.View;
 
public class FlectionView extends View {
 
  Context mContext=null;
  public FlectionView(Context context) {
    super(context);
  }
 
  public FlectionView(Context context, AttributeSet attrs) {
    super(context, attrs);
    this.mContext=context;
  }
 
  @SuppressLint("DrawAllocation")
  @Override
  protected void onDraw(Canvas canvas) {
    //設置背景色
    this.setBackgroundColor(Color.parseColor("#8B8378"));
    Bitmap oldBitmap = BitmapFactory.decodeResource(mContext.getResources(),R.drawable.dropbox);
    Bitmap newBitmap = createFlectionBitmap(oldBitmap);
    canvas.drawBitmap(newBitmap,newBitmap.getWidth() ,newBitmap.getHeight(), new Paint());
    this.invalidate();
  }
 
  //獲取原圖+倒影圖的bitmap
  private Bitmap createFlectionBitmap(Bitmap oldBitmap) {
    int mWidth = oldBitmap.getWidth();
    int mHeight = oldBitmap.getHeight();
    //原圖和倒影圖之間的縫隙
    int gap = 2;
    Matrix matrix = new Matrix();
    matrix.preScale(1, -1);
    Bitmap flection = Bitmap.createBitmap(oldBitmap, 0, mHeight / 2,
        mWidth, mHeight / 2, matrix, false);
    Bitmap background = Bitmap.createBitmap(mWidth, mHeight+gap+mHeight/2, Config.ARGB_8888);
    Canvas canvas = new Canvas(background);
    Paint p1 = new Paint();
    //畫出原圖
    canvas.drawBitmap(oldBitmap, 0, 0, p1);
    //畫出倒影圖
    canvas.drawBitmap(flection, 0, mHeight+gap, p1);
    Paint shaderPaint = new Paint();
    LinearGradient shader = new LinearGradient(0, mHeight, 0,
        flection.getHeight(), 0x70ffffff, 0x00ffffff, TileMode.MIRROR);
    shaderPaint.setShader(shader);
    shaderPaint.setXfermode(new PorterDuffXfermode(android.graphics.PorterDuff.Mode.DST_IN));
    //畫出漸變顏色
    canvas.drawRect(0, mHeight+gap, mWidth, background.getHeight(), shaderPaint);
    return background;
  }
 
}

實現(xiàn)的效果如下圖：

2016415152957303.png (720×1280)