Android變形(Transform)之Matrix用法

來源:互聯網
上載者:User

引言

最近在研究Android的變形,Android的2D變形(包括縮放,扭曲,平移,旋轉等)可以通過Matrix來實現,3D變形可以通過Camera來實現。接下來就將我這倆天研究的東西和大家分享下,先來看看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效果,但是值沒看出規律,那麼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的矩陣座標值進行設定即可。

強調的一點是,在調用setMatrixValues的時候需要調用invalidate方法,讓View進行調用onDraw進行重繪。

矩陣的基本用法就是這些,往往在開發過程中,不直接通過矩陣座標去實現變形,因為如果要實現選擇,那麼就比較複雜了,涉及到三角函數,對於資料早已經忘差不多的人,很是痛苦,當然如果非要用的話,算起來也不難。

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

set方式:setScale, setSkew, setTranslate, setRotate

post方式:postScale, postSkew, postTranslate, postRotate

pre方式:preScale, preSkew, preTranslate, preRotate

set方式為直接設定,每一次調用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中,通過參數為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的區別,請告訴我下,看看我的理解是否正確。

2.能否實現ViewGroup直接變形,而非我上面講的那種。

相關文章

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.