Transform仿射变换和原理

一、 Transform 二维变换

UIView有一个transform属性，CGAffineTransform 可以操控二维平面内控件的平移、旋转和缩放。

这三种类型的图形变换可以使用 CGAffineTransformMake(<#CGFloat a#>, <#CGFloat b#>, <#CGFloat c#>, <#CGFloat d#>, <#CGFloat tx#>, <#CGFloat ty#>) 通过设置参数实现（其实为矩阵中的参数设置）。但iOS开发中，苹果为我们提供了更加方便的接口，如下：

1、平移

    /*
     CGAffineTransformMakeTranslation：
        以初始位置为基准进行平移变换
     CGAffineTransformTranslate：
        实现以一个已经存在的形变为基准,在x轴方向上平移x单位,在y轴方向上平移y单位
     初始化：
        CGAffineTransform transform = CGAffineTransformIdentity;
        CGAffineTransformIdentity是系统提供的一个常量，
        The identity transform: [1 0 0 1 0 0] (和原图一样的transform)
     */
    self.imgView.transform = CGAffineTransformMakeTranslation(100, 100);
    self.imgView.transform = CGAffineTransformTranslate(CGAffineTransformIdentity, 100, 100);
    // 在X、Y轴平移100也可以这样设置
    self.imgView.transform = CGAffineTransformMake(1, 0, 0, 1, 100, 100);

2、旋转

     CGAffineTransform transform = CGAffineTransformMakeRotation(-M_PI_2);
     self.imgView.transform = CGAffineTransformRotate(transform, M_PI_2);

3、缩放

     self.imgView.transform = CGAffineTransformScale(CGAffineTransformIdentity, 2.0, 2.0);
     self.imgView.transform = CGAffineTransformMakeScale(2.0, 2.0);

二、原理

    了解仿射变换矩阵计算原理，回顾一下线性代数：

        http://www2.edu-edu.com.cn/lesson_crs78/self/j_0022/soft/ch0605.html

        参考文章：http://www.jianshu.com/p/6c09d138b31d

    初始化： CGAffineTransform  transform = CGAffineTransformIdentity;

    CGAffineTransformIdentity是系统提供的一个常量，/* The identity transform: [ 1 0 0 1 0 0 ]. */（和原图一样的transform）;

     CGAffineTransform transform  = CGAffineTransformMake(CGFloat a,CGFloat b,

CGFloat c,CGFloa td,CGFloat tx,CGFloat ty)

    下面是原始的（默认的）transform

UIView默认的

参数结构

    人后我们再来看它的计算公式：3 X 3矩阵合成得到（x`，y`,1）

(x`，y`,1)公式

    矩阵算法公式：

算法公式

    X' 和 Y' 是我们转换后的目标坐标值，X、Y是已知原始位置的坐标值。

    我们创建两个大小和位置一样的视图，保持背景视图恒定不变，并将上层的视图做伸缩变换：    

    NSLog(@"变换前坐标----> X:%f Y:%f W:%f H:%f", self.testView.frame.origin.x, self.testView.frame.origin.y, self.testView.frame.size.width, self.testView.frame.size.height);
    [UIView animateWithDuration:2 animations:^{
        self.testView.transform = CGAffineTransformMake(0.2, 0, 0, 1, 0, 0);
    } completion:^(BOOL finished) {
        NSLog(@"变换后坐标----> X:%f Y:%f W:%f H:%f", self.testView.frame.origin.x, self.testView.frame.origin.y, self.testView.frame.size.width, self.testView.frame.size.height);
    }];

    将设置的参数带入方程可得：

    X' = 0.2*X 

    Y' = Y

    所以该参数是将testView视图横向X轴伸缩为原来的0.2倍：

    

    查看打印前后坐标：

    

    只有宽度和X坐标点发生了变化。