仿射变换Transform

2018-02-07 本文已影响108人 Carson_Zhu

简介

CGAffineTransform
CGAffineTransform是CoreGraphics的结构体，定义在二维空间上完成UIView的平移，旋转，缩放等效果的实现。
CATransform3D
CATransform3D是CoreAnimation的结构体，是用来做更复杂的关于CALayer的3D操作。

CGAffineTransform

结构体

struct CGAffineTransform {
  CGFloat a, b, c, d;
  CGFloat tx, ty;
};

为了把二维图形的变化统一在一个坐标系里，引入了齐次坐标的概念，即把一个图形用一个三维矩阵表示，其中第三列总是(0,0,1)，用来作为坐标系的标准。所以所有的变化都由前两列完成。

CGAffineTransformIdentity表示一个原始状态的CGAffineTransform。

计算公式:

矩阵算法公式：

例子：

UIView *view = [[UIView alloc] initWithFrame:CGRectMake(100, 100, 100, 100)];

view.transform = CGAffineTransformMake(0.2, 0, 0, 1, 0, 0);

// view的frame从原来的(100, 100, 100, 100)变成了(140, 100, 20, 100)
// x` = ax + cy + tx = 0.2 * 100 + 0 * 100 + 0 = 20
// y` = bx + dy + ty = 0 * 100 + 1 * 100 + 0 = 100

总结

x按照a值进行了比例缩放，y按照d的值进行比列缩放，最重要的是缩放的过程中view的中心点point是不会改变的。
x会跟着c的值进行拉伸(view的宽度是跟着改变)，y会跟着b的值进行拉伸（view的高度跟着改变），要注意到的是c和b的值改变不会影响到view的中心点point的改变。
x会跟着tx进行x做表平移，y会跟着ty进行平移。这里的中心点point是跟着变换的。

CGAffineTransform的使用

初始化

// 保持原始状态初始化
CGAffineTransform transfrom = CGAffineTransformIdentity;
// 变换初始化
CGAffineTransformMake(CGFloat a, CGFloat b, CGFloat c, CGFloat d, CGFloat tx, CGFloat ty);

平移

// 根据本身的transform进行平移
CGAffineTransformMakeTranslation(CGFloat tx,CGFloat ty)
// 根据本身的transform后者另外的transform进行平移
CGAffineTransformTranslate(CGAffineTransform t,CGFloat tx,CGFloat ty)

缩放

// 根据本身的transform进行缩放
CGAffineTransformMakeScale(CGFloat sx,CGFloat sy)
// 根据本身的transform后者另外的transform进行缩放
CGAffineTransformScale(CGAffineTransform t,CGFloat sx,CGFloat sy)

旋转

// 根据本身的transform进行旋转 angle 旋转的角度 
CGAffineTransformMakeRotation(CGFloat angle)
// 根据本身的transform后者另外的transform进行旋转
CGAffineTransformRotate(CGAffineTransform t,CGFloat angle)

合并

// 两个transform合并起来
CGAffineTransformConcat(CGAffineTransform t1,CGAffineTransform t2)

评测

// 查看是不是默认的transform
Bool CGAffineTransformIsIdentity(CGAffineTransform t)
// 比较两个transform是否相等
BOOl CGAffineTransformEqualToTransform(CGAffineTransform t1,CGAffineTransform t2)

仿射矩阵应用

// 得到新的中心 CGPoint
CGPointApplyAffineTransform(CGPoint point,CGAffineTransform t)
// 得到新的size CGSize
CGSizeApplyAffineTransform(CGSize size,CGAffineTransform t)
// 得到新的rect CGRect
CGRectApplyAffineTransform(CGRect rect,CGAffineTransform t)

CATransform3D

struct CATransform3D {
    CGFloat m11（x缩放）, m12（y切变）, m13（旋转）, m14（）;
    CGFloat m21（x切变）, m22（y缩放）, m23（和m32一起决定x轴的旋转）, m24（）;
    CGFloat m31（和m13一起决定y轴的旋转）,m32（和m23一起决定x轴的旋转）, m33（z缩放）, m34（透视效果，要操作的这个对象要有旋转的角度，否则没有效果。正直/负值都有意义）;
    CGFloat m41（x平移）, m42（y平移）, m43（z平移）, m44（初始为1）;
};

CATransform3D的使用

初始化

CATransform3D transfrom = CATransform3DIdentity;

平移

// 在x轴方向上平移x单位,在y轴方向上平移y单位,在z轴方向上平移z单位
CATransform3DMakeTranslation (CGFloat tx, CGFloat ty, CGFloat tz)
//在某个transform3D变换的基础上进行平移变换，t是上一个transform3D，其他参数同上
CATransform3D CATransform3DTranslate (CATransform3D t, CGFloat tx, CGFloat ty, CGFloat tz);

缩放

//x，y，z分别对应x轴，y轴，z轴的缩放比例
CATransform3D CATransform3DMakeScale (CGFloat sx, CGFloat sy, CGFloat sz);
//在一个transform3D变换的基础上进行缩放变换，其他参数同上
CATransform3D CATransform3DScale (CATransform3D t, CGFloat sx, CGFloat sy, CGFloat sz);

旋转

// 实现以初始位置为基准,在x轴,y轴,z轴方向上逆时针旋转angle弧度(弧度=π/180×角度,M_PI弧度代表180角度),x,y,z三个参数只分是否为0
CATransform3DMakeRotation (CGFloat angle, CGFloat x, CGFloat y, CGFloat z)
//在一个transform3D的基础上进行旋转变换，其他参数如上
CATransform3D CATransform3DRotate (CATransform3D t, CGFloat angle, CGFloat x, CGFloat y, CGFloat z);

合并

// 叠加3D仿射效果
CATransform3DConcat (CATransform3D a, CATransform3D b)

CATransform3D和CGAffineTransform相互转换

//将一个CGAffineTransform转化为CATransform3D
CATransform3D CATransform3DMakeAffineTransform (CGAffineTransform m);

//判断一个CATransform3D是否可以转换为CGAffineTransform
bool CATransform3DIsAffine (CATransform3D t);

//将CATransform3D转换为CGAffineTransform
CGAffineTransform CATransform3DGetAffineTransform (CATransform3D t);

景深

在默认情况下，系统采用正交投影，对于3D形变实际上是看不到3D效果的，在CATransform3D结构体中有一个m34便允许我们将正交投影修改为有近大远小立体效果的透视投影，其中m34 = -1.0/z,这个z为观察者与控件之间的距离。

m34必须在赋值transform之前设置才会生效