Android Matrix处理ImageView中图片缩放,平移

1,Matrix 原理简单介绍

      Matrix :矩阵,线性代数里有介绍,结合Matrix,用于平面的缩放、平移、旋转等操作。 
首先介绍一下矩阵运算。加法和减法就不用说了,太简单了,对应位相加就好。图像处理,主要用到的是乘法 。下面是一个乘法的公式:

77c093fd-764d-376e-abf6-08400901c306.png 



在 Android 里面, Matrix 由 9 个 float 值构成,是一个 3*3 的矩阵。如下图。


80c2af69-8b1f-36c8-a364-f133559d066b.png 

2,Android里面提供了对Matrix操作的一系列方便的接口。

    Matrix的操作,总共分为translate(平移),rotate(旋转),scale(缩放)和skew(倾斜)四种,每一种变换在


Android的API里都提供了set, post和pre三种操作方式,除了translate,其他三种操作都可以指定中心点


    set是直接设置Matrix的值,每次set一次,整个Matrix的数组都会变掉


    post是后乘,当前的矩阵乘以参数给出的矩阵。可以连续多次使用post,来完成所需的整个变换。例如,要将一个图片旋
转30度,然后平移到(100,100)的地方,那么可以这样做:

Matrix m = new Matrix();  
m.postRotate(30);  
m.postTranslate(100, 100); 


 下面给出一个例子。

[java]  view plain copy
  1. package chroya.demo.graphics;    
  2.     
  3. import android.content.Context;    
  4. import android.graphics.Bitmap;    
  5. import android.graphics.Canvas;    
  6. import android.graphics.Matrix;    
  7. import android.graphics.Rect;    
  8. import android.graphics.drawable.BitmapDrawable;    
  9. import android.util.DisplayMetrics;    
  10. import android.view.MotionEvent;    
  11. import android.view.View;    
  12.     
  13. public class MyView extends View {    
  14.         
  15.     private Bitmap mBitmap;    
  16.     private Matrix mMatrix = new Matrix();    
  17.         
  18.     public MyView(Context context) {    
  19.         super(context);    
  20.         initialize();    
  21.     }    
  22.     
  23.     private void initialize() {    
  24.             
  25.         Bitmap bmp = ((BitmapDrawable)getResources().getDrawable(R.drawable.show)).getBitmap();    
  26.         mBitmap = bmp;    
  27.         /*首先,将缩放为100*100。这里scale的参数是比例。有一点要注意,如果直接用100/  
  28. bmp.getWidth()的话,会得到0,因为是整型相除,所以必须其中有一个是float型的,直接用100f就好。*/    
  29.         mMatrix.setScale(100f/bmp.getWidth(), 100f/bmp.getHeight());    
  30.                 //平移到(100,100)处    
  31.         mMatrix.postTranslate(100100);    
  32.                 //倾斜x和y轴,以(100,100)为中心。    
  33.         mMatrix.postSkew(0.2f, 0.2f, 100100);    
  34.     }    
  35.         
  36.     @Override protected void onDraw(Canvas canvas) {    
  37. //      super.onDraw(canvas);  //如果界面上还有其他元素需要绘制,只需要将这句话写上就行了。    
  38.             
  39.         canvas.drawBitmap(mBitmap, mMatrix, null);    
  40.     }    
  41. }    


 运行效果如下:

    红色的x和y表示倾斜的角度,下面是x,上面是y。



抽象的说pre方法是向前"生长", post方法是向后"生长",具体拿个例子来说,比如一个matrix调用了下列一系列的方法:


   matrix.preScale(0.5f, 1);  matrix.preTranslate(10, 0); matrix.postScale(0.7f, 1);  matrix.postTranslate(15, 0); 则坐标变换经过的4个变换过程依次是:


translate(10, 0) -> scale(0.5f, 1) -> scale(0.7f, 1) -> translate(15, 0),


所以对matrix方法的调用顺序是很重要的,不同的顺序往往会产生不同的变换效果。pre方法的调用顺序和post方法的互不影响,即以下的方法调用和前者在真实坐标变换顺序里是一致的, 


matrix.postScale(0.7f, 1); matrix.preScale(0.5f, 1);  matrix.preTranslate(10, 0); matrix.postTranslate(15, 0);

 

  而matrix的set方法则会对先前的pre和post操作进行刷除,而后再设置它的值,比如下列的方法调用: 


matrix.preScale(0.5f, 1);  matrix.postTranslate(10, 0); matrix.setScale(1, 0.6f); matrix.postScale(0.7f, 1);


 matrix.preTranslate(15, 0); 其坐标变换顺序是


translate(15, 0) -> scale(1, 0.6f) ->  scale(0.7f, 1).


setScale重新设置了矩阵的值,之前的两个变换是无效的了,所以最终的显示效果只有三个变换效果。


        demo:http://download.csdn.net/detail/guitk/8037203

  • 2
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值