2011.10.12（3）——— android Matrix学习02
2011.10.12（3）——— android Matrix学习02

参考：http://www.iteye.com/topic/713869
http://www.moandroid.com/?p=1771

首先声明一下 上一节是有错误的


这张图是错误的







这两张图才是正确的

解释一下 假设矩阵为[a1,a2,a3][b1,b2,b3][c1,c2,c3]

如图所示 那么
平移为a3 b3
缩放为a1 b2
旋转为a1 a2 b1 b2

这是我大概的理解


下面 针对不同的变化 做一下分析

首先 声明一下 matrix最开始的矩阵是[1,0,0][0,1,0][0,0,1]

下面的都是针对单一变化的分析
1、平移

现设点P0（x0， y0）进行平移后，移到P（x，y），
其中x方向的平移量为△x，y方向的平移量为△y(相当于_matrix.postTranslate(△x, △y);)
那么，点P（x，y）的坐标为：
x = x0 + △x
y = y0 + △y
采用矩阵表达上述如下：
[1,0,△x][0,1,△y][0,0,1] * [x0][y0][1] = [x0+△x][y0+△y][1]

2、缩放
现设点p0（x0 ，y0）进行缩放，其中x放大a倍，y放大b倍，假设p0缩放后的坐标p（x，y）
那么，点P（x，y）的坐标为：
x = x0 * a
y = y0 * b
采用矩阵表达上述如下：
[a,0,0][0,b,0][0,0,1] * [x0][y0][1] = [x0 * a][y0 * b][1]


3、旋转

现设点P0（x0， y0）旋转θ角后的对有点为P（x， y）。通过使用向量，我们得到如下：
x0 = r cosα
y0 = r sinα
x = r cos(α-θ) = x0 cosθ+ y0 sinθ
y = r sia(α-θ) = -x0 sinθ+y0 cosθ
采用矩阵表达上述如下：
[cosX,-sinX,0][sinX,cosX,0][0,0,1] * [x0][y0][1] = x0 cosθ+ y0 sinθ][-x0 sinθ+y0 cosθ][1]


我的测试代码 如下：

package com.lp.matrix;import android.content.Context;import android.graphics.Bitmap;import android.graphics.Canvas;import android.graphics.Matrix;import android.graphics.drawable.BitmapDrawable;import android.util.Log;import android.view.View;/** * 一个简单的Matrix例子 *  * @author lp * lipeng88213@126.com * http://lipeng88213.iteye.com/ * 2011-10-12 * 上午11:29:19 */public class MatrixView extends View {private final static String TAG = "lp";private Context _context;private Bitmap _bitmap;private Matrix _matrix = new Matrix();public MatrixView(Context context) {super(context);this._context = context;//init();//init2();init3();}//例子01private void init(){//得到图片_bitmap = ((BitmapDrawable)getResources().getDrawable(R.drawable.a)).getBitmap();//得到30°的sin和cos值//顺时针是正数，我们这个是逆时针转动30°float sinValue = (float)Math.sin(-Math.PI/6);float cosValue = (float)Math.cos(-Math.PI/6);//给Matrix赋值 按照固定的顺序////cosX-sinXtranslateX//sinXcosXtranslateY//00scale////解释//上面的 sinX 和 cosX ，表示旋转角度的 cos 值和 sin 值，注意，旋转角度是按顺时针方向计算的。 //translateX 和 translateY 表示 x 和 y 的平移量。 //scale 是缩放的比例， 1 是不变， 2 是表示缩放 1/2  后来才知道 这个并不是缩放的 而是控制等比变换的_matrix.setValues(new float[]{cosValue,-sinValue,100,sinValue,cosValue,100,0,0,2});}//例子02private void init2() {_bitmap = ((BitmapDrawable) getResources().getDrawable(R.drawable.a)).getBitmap();/* * 首先，将缩放为100*100。这里scale的参数是比例。有一点要注意，如果直接用100/ bmp.getWidth()的话，会得到0， * 因为是整型相除，所以必须其中有一个是float型的，直接用100f就好。 */_matrix.setScale(100f / _bitmap.getWidth(), 50f / _bitmap.getHeight());// 平移到（100，100）处_matrix.postTranslate(100, 100);// 倾斜x和y轴，以（100，100）为中心。_matrix.postSkew(-0.2f, 0.5f, 100, 100);}//例子03private void init3() {_bitmap = ((BitmapDrawable) getResources().getDrawable(R.drawable.a)).getBitmap();////cosX-sinXtranslateX//sinXcosXtranslateY//00scale////执行_matrix.postTranslate(250, 250);后的矩阵为//Matrix{[1.0, 0.0, 100.0][0.0, 1.0, 250.0][0.0, 0.0, 1.0]}//紧接着_matrix.postRotate(30);得到的矩阵//Matrix{[0.8660254, -0.5, -38.39746][0.5, 0.8660254, 266.50635][0.0, 0.0, 1.0]}//很明显  平移距离x y都变化了//_matrix.postTranslate(100, 250);//_matrix.postRotate(30);//执行_matrix.postRotate(30);后的矩阵为//Matrix{[0.8660254, -0.5, 0.0][0.5, 0.8660254, 0.0][0.0, 0.0, 1.0]}//紧接着_matrix.postTranslate(250, 250);得到的矩阵//Matrix{[0.8660254, -0.5, 250.0][0.5, 0.8660254, 250.0][0.0, 0.0, 1.0]}//这个平移的距离没有变化//_matrix.postRotate(30);//_matrix.postScale(100f/_bitmap.getWidth(), 100f/_bitmap.getHeight());//_matrix.postTranslate(250, 250);//这个全部执行完后的矩阵为：//Matrix{[0.5235602, 0.0, 52.35602][0.0, 2.2727273, 227.27272][0.0, 0.0, 1.0]}//可以看出来 原本为cosX的两个位置发生了变化 但是 按照我们的理解 缩放应该改变的为scale位置的数才对啊？//所以 可以证明 我们上面的//cosX-sinXtranslateX//sinXcosXtranslateY//00scale//并不是完全正确的////_matrix.postTranslate(100, 100);//_matrix.postScale(100f/_bitmap.getWidth(), 100f/_bitmap.getHeight());//执行_matrix.postRotate(30);后的矩阵为//Matrix{[0.8660254, -0.5, 0.0][0.5, 0.8660254, 0.0][0.0, 0.0, 1.0]}////紧接着_matrix.postScale(2, 3);得到的矩阵//Matrix{[1.7320508, -1.0, 0.0][1.5, 2.598076, 0.0][0.0, 0.0, 1.0]}//_matrix.postRotate(30);//_matrix.postScale(2, 3);//总结 //1、//通过上面的 我们可以看出来 我们涉及到平移操作的复合变化时，平移最好放到最后来执行//否则 就会造成上面的问题////前提：//假如 矩阵为[a1,a2,a3][b1,b2,b3][c1,c2,c3]////2、//当我们执行平移操作matrix.postTranslate(dx, dy);后//又执行了旋转、缩放等其他操作的时候 a3和b3就会发生变化  它的运算规则是在这样的 (此矩阵为执行其他操作后的矩阵，以其他值来算a3 b3)//a3 = a1*dx + a2*dy//b3 = b1*dx + b2*dy////3、//执行_matrix.postScale(sx,sy)的时候 会改变a1、a2和b1、b2的值//a1 = a1*sx  a2 = a2*sx//b1 = b1*sy  b2 = b2*sy}//例子04 垂直镜像private void init4() {_bitmap = ((BitmapDrawable) getResources().getDrawable(R.drawable.a)).getBitmap();//按说 翻转180° 应该就可以翻转过来 //但是 如果不加postTranslate 是不会显示出来的//因为 垂直翻转 按理说 应该是x = x0 y = -y0  矩阵应该为//100//0-10//001//这样才能保证  这个矩阵 乘以矩阵//x0//y0//1//的时候 得到的矩阵为//x0//-y0//1//也就是//x//y//1//正好得到   这个矩阵式竖着的//如果 _matrix.postRotate(180); 则推到出来的矩阵为//-100//0-10//001//而这矩阵 乘以矩阵//-x0//y0//1//的时候 得到的矩阵为//-x0//-y0//1//这样 就跑道屏幕的对角线那个象限了 看不到了//所以 加上_matrix.postTranslate(_bitmap.getWidth(), _bitmap.getHeight()); 让她再平移过来//_matrix.postRotate(180);//_matrix.postTranslate(_bitmap.getWidth(), _bitmap.getHeight());//Matrix{[1.0, 0.0, 0.0][0.0, -1.0, 0.0][0.0, 0.0, 1.0]}//这个应该可以理解为 先旋转了180° 然后y轴缩放了-1 也就是 变到第二象限了_matrix.setScale(1.0f, -1.0f);//上面的执行完毕后 和矩阵[x0][y0][1] 相乘后 得到[x0][-y0][1]//映射到屏幕的上方了 也就是x轴的上方了 还是看不到 所以 要给y轴加上图片的高度 让其出现在屏幕里 //这个效果 和上面的一样 //Matrix{[1.0, 0.0, 0.0][0.0, -1.0, 44.0][0.0, 0.0, 1.0]}_matrix.postTranslate(0, _bitmap.getHeight());}@Overrideprotected void onDraw(Canvas canvas) {super.onDraw(canvas);canvas.drawBitmap(_bitmap, _matrix, null);//canvas.drawBitmap(_bitmap, 0, 0, null);Log.i(TAG, _matrix.toString());}}

结论：

例子01:

我们可以通过_matrix.setValues来直接设置矩阵

例子02：



例子03：

1、通过上面的 我们可以看出来 我们涉及到平移操作的复合变化时，平移最好放到最后来执行
否则 就会造成上面的问题
前提：
假如 矩阵为[a1,a2,a3][b1,b2,b3][c1,c2,c3]

2、
当我们执行平移操作matrix.postTranslate(dx, dy);后
又执行了旋转、缩放等其他操作的时候 a3和b3就会发生变化 它的运算规则是在这样的 (此矩阵为执行其他操作后的矩阵，以其他值来算a3 b3)
a3 = a1*dx + a2*dy
b3 = b1*dx + b2*dy

3、
执行_matrix.postScale(sx,sy)的时候 会改变a1、a2、a3和b1、b2、b3的值
a1 = a1*sx a2 = a2*sx a3 = a3*sx
b1 = b1*sy b2 = b2*sy b3 = b3*sy

例子04：

设置垂直镜像
_matrix.setScale(1.0f, -1.0f);
_matrix.postTranslate(0, _bitmap.getHeight());
或者
_matrix.postRotate(180);
_matrix.postTranslate(_bitmap.getWidth(), _bitmap.getHeight());