主要分3个部分说明。
1.基础及矩阵概念
2.2D仿射
3.3D仿射
1.基础
transform在矩阵变换的层面上改变视图的显示效果,完成旋转,变形,平移等操作。在它被修改的同时,视图的frame也会被真实的改变。
UIView中的transform为CGAffineTransform类型。
struct CGAffineTransform {
CGFloat a, b, c, d;
CGFloat tx, ty;
};
CALayer中的transform为CATransform3D类型,而CALayer对应于UIView的transform属性叫做affineTransform
struct CATransform3D
{
CGFloat m11, m12, m13, m14;
CGFloat m21, m22, m23, m24;
CGFloat m31, m32, m33, m34;
CGFloat m41, m42, m43, m44;
};
2.矩阵概念
矩阵概念:一个m×n的矩阵是一个由m行(row)n列(column)元素排列成的矩形阵列。
也就是这个样子
//也是仿射变换基础矩阵,下面tip讲解为什么是这个样子。
A = [a b 0]
[c d 0]
[tx ty 1]
矩阵可以做加减,乘除。
加减:大小相同(行数列数都相同)的矩阵之间可以相互加减,具体是对每个位置上的元素做加减法。(比较简单不演示了)。
乘除:当且仅当第一个矩阵的列数等于第二个矩阵的行数,才可以做乘除。(例如下面A矩阵2列,B矩阵2行)。
//矩阵乘除例子
矩阵A =
[1 1]
[2 0]
矩阵B =
[0 2 3]
[1 1 2]
计算过程:
矩阵C = A * B =
[(1 * 0 + 1 * 1) (1 * 2 + 1 * 1) (1 * 3 + 1 * 2)]
[(2 * 0 + 0 * 1) (2 * 2 + 0 * 1) (2 * 3 + 0 * 2)]
矩阵C =
[1 3 5]
[0 4 6]
矩阵乘除的计算规则:
1.不符合交换律(A和B是矩阵,AB不一定等于BA)
2.当矩阵A的列数等于矩阵B的行数是,才可以计算
3.计算的结果矩阵C的行数等于A的行数,列数等于B的列数(如A是m×n矩阵和B是n×p矩阵,它们的乘积C是一个m×p矩阵 )
4.结果矩阵C的第 i 行第 j 列的元素Cij 等于矩阵A的第 i 行的元素与矩阵B的第 j 列对应元素乘积之和
3.Tip
1.为什么仿射变换基础矩阵的第三列为(0,0,1)?
当且仅当第一个矩阵的列数等于第二个矩阵的行数,才可以做乘除。并且为了不影响计算结果所以使用(0,0,1)。
2.图层的旋转,平移,放缩是怎么通过矩阵变化的?
当对图层应用变换矩阵,图层矩形内的每一个点都被相应地做变换,从而形成一个新的四边形的形状。