Android變形(Transform)之Matrix用法

更新時間：2013年02月21日 15:25:56 作者：

Android的2D變形（包括縮放，扭曲，平移，旋轉等）可以通過Matrix來實現(xiàn),本文研究了一下;接下來就將我這倆天研究的東西和大家分享下，先來看看Matrix的用法感興趣的你可不要錯過了哈

引言

最近在研究Android的變形，Android的2D變形（包括縮放，扭曲，平移，旋轉等）可以通過Matrix來實現(xiàn)，3D變形可以通過Camera來實現(xiàn)。接下來就將我這倆天研究的東西和大家分享下，先來看看Matrix的用法。

效果圖

變形以后

Matrix矩陣

坐標變換矩陣，即一個3*3的矩陣，用來對圖形進行坐標變換。

圖1.1 A為坐標矩陣，C為原始矩陣，R是A和C矩陣相乘記過，那么可以知道：(矩陣知識，大學沒學好的傷不起啊)

x' = a*x + b*y + c

y' = d*x + b*y + f

最后一列很少有資料提到，不過初始值g=h=0，大家可以去改變值試試，變化為3D效果，但是值沒看出規(guī)律，那么i為縮放比例，初始值為1。

初始化坐標矩陣為{1,0,0, 0,1,0, 0,0,1}

上面講到的是基本的算法，那么具體這個矩陣x行x列的值代表上面呢，不防簡單的來看看

如果A={1,0,100, 0,1,-100, 0,0,2}，那么可以算出來

x' = x + 100;

y' = y - 100;

也即在原始的基礎上右移100，上移100，單位為像素。第三列第三行為2，表示為以前比例的1/2，記住這塊容易弄錯。

下面給出具體坐標對應變形的屬性

|scaleX, skewX, translateX|

|skewY, scaleY, translateY|

|0 ,0 , scale |

實踐

通過代碼來看看具體的用法

復制代碼代碼如下:

public class MatrixTransformView extends View { 

private Matrix mMatrix; 
private Paint mPaint = new Paint(Paint.ANTI_ALIAS_FLAG); 
private Bitmap mBitmap; 

public MatrixTransformView(Context context) { 
super(context); 
} 

public MatrixTransformView(Context context, AttributeSet attrs) { 
super(context, attrs); 
} 

public void setDrawable(int resId) { 
mBitmap = BitmapFactory.decodeResource(getContext().getResources(), resId); 
} 

/* 
* 設置矩陣，并重繪 
*/ 
public void setMatrixValues(float[] array) { 
if (mMatrix == null) { 
mMatrix = new Matrix(); 
} 
mMatrix.reset(); 
mMatrix.setValues(array); 
invalidate(); 
} 

public void resetMatrix() { 
if (mMatrix != null) { 
mMatrix.reset(); 
} 
invalidate(); 
} 

@Override 
protected void onDraw(Canvas canvas) { 
if (mMatrix != null) { 
Paint paint = mPaint; 
canvas.drawBitmap(mBitmap, mMatrix, paint); 
} 

super.onDraw(canvas); 
} 
}

通過Matrix的setValues方法，將3*3的矩陣坐標值進行設置即可。

強調(diào)的一點是，在調(diào)用setMatrixValues的時候需要調(diào)用invalidate方法，讓View進行調(diào)用onDraw進行重繪。

矩陣的基本用法就是這些，往往在開發(fā)過程中，不直接通過矩陣坐標去實現(xiàn)變形，因為如果要實現(xiàn)選擇，那么就比較復雜了，涉及到三角函數(shù)，對于數(shù)據(jù)早已經(jīng)忘差不多的人，很是痛苦，當然如果非要用的話，算起來也不難。

那么為了避免直接使用矩陣坐標來操作變形，Matrix類提供方法來進行變:

set方式：setScale, setSkew, setTranslate, setRotate

post方式：postScale, postSkew, postTranslate, postRotate

pre方式：preScale, preSkew, preTranslate, preRotate

set方式為直接設置，每一次調(diào)用set方法都會先重置矩陣。post可以理解成設置多次有效，效果是累加的。pre這里暫且理解成和post方式完全一樣，后面3D的時候再糾結。

看代碼：

復制代碼代碼如下:

public class MatrixTransformView extends View { 

private Matrix mMatrix; 
private Paint mPaint = new Paint(Paint.ANTI_ALIAS_FLAG); 
private Bitmap mBitmap; 

public MatrixTransformView(Context context) { 
super(context); 
} 

public MatrixTransformView(Context context, AttributeSet attrs) { 
super(context, attrs); 
} 

public void setDrawable(int resId) { 
mBitmap = BitmapFactory.decodeResource(getContext().getResources(), resId); 
} 

/* 
* 設置矩陣，并重繪 
*/ 
public void setMatrixValues(float[] array) { 
if (mMatrix == null) { 
mMatrix = new Matrix(); 
} 
mMatrix.reset(); 
mMatrix.setValues(array); 
invalidate(); 
} 

public void postMatrixScale(float scaleX, float scaleY, float centerX, float centerY) { 
if (mMatrix == null) { 
mMatrix = new Matrix(); 
} 
mMatrix.preScale(scaleX, scaleY, centerX, centerY); 
invalidate(); 
} 

public void postMatrixSkew(float skewX, float skewY, float centerX, float centerY) { 
if (mMatrix == null) { 
mMatrix = new Matrix(); 
} 
mMatrix.postSkew(skewX, skewY, centerX, centerY); 
invalidate(); 
} 

public void postMatrixTranslate(float translateX, float translateY) { 
if (mMatrix == null) { 
mMatrix = new Matrix(); 
} 
mMatrix.postTranslate(translateX, translateY); 
invalidate(); 
} 

public void postMatrixRotate(float degree, float centerX, float centerY) { 
if (mMatrix == null) { 
mMatrix = new Matrix(); 
} 
mMatrix.postRotate(degree, centerX, centerY); 
invalidate(); 
} 

public void resetMatrix() { 
if (mMatrix != null) { 
mMatrix.reset(); 
} 
invalidate(); 
} 

@Override 
protected void onDraw(Canvas canvas) { 
if (mMatrix != null) { 
Paint paint = mPaint; 
canvas.drawBitmap(mBitmap, mMatrix, paint); 
} 

super.onDraw(canvas); 
} 
}

Matrix的基本用法就這么多。

擴展

變形是需要canvas來進行繪制的，canvas的繪制需要bitmap，所以這塊利用一個繼承自View的控件，通過setDrawable方式設置bitmap，那么選擇目標必須是個bitmap，在文章的demo中，通過參數(shù)為int型resource的setDrawable方法進行bitmap獲取，如果想對別的控件進行變形，例如ViewGroup，可以通過如下方式：

復制代碼代碼如下:

Matrix m = new Matrix(); 
m.setValues(new float[] { 
1, 0, 0, 
0, 1, 0, 
0, 0, 1 
}); 
Bitmap bp = Bitmap.createBitmap(viewGroup.getWidth(), viewGroup.getHeight(), Bitmap.Config.RGB_565); 
Canvas can = new Canvas(bp); 
viewGroup.draw(can); 
bp = Bitmap.createBitmap(bp, 0, 0, bp.getWidth(), bp.getHeight(), m, true); 
img.setImageBitmap(bp);

通過將ViewGroup轉換成Bitmap，然后自定義一個Image來變形，隱藏ViewGroup來達到效果。

疑問

1.如果誰知道post，pre的區(qū)別，請告訴我下，看看我的理解是否正確。

2.能否實現(xiàn)ViewGroup直接變形，而非我上面講的那種。

您可能感興趣的文章: