一般來說，對于UIView的動畫纯蛾，大概分為UIView的仿射變換纤房，基于CA和它的子類的動畫，以及CG相關(guān)的動畫翻诉。

動畫的形式一般為平移炮姨，縮放，旋轉(zhuǎn)碰煌，翻轉(zhuǎn)舒岸，一種或多種組合。設(shè)置動畫變換常用的屬性.frame和.transform芦圾，因此常被稱為

1. frame動畫
2. transform動畫

使用這兩種動畫模式蛾派，只需要在apple提供的動畫api中適當(dāng)?shù)奶砑觿赢嫼蟮膄rame和transform，并設(shè)置好動畫時長，即可達到動畫過度的效果洪乍。但是使用frame的局限性很強眯杏，使用平移和縮放還好，旋轉(zhuǎn)則需要使用比較復(fù)雜的矩陣計算公式壳澳，才能得到旋轉(zhuǎn)后的frame岂贩，所以只適合實現(xiàn)最簡單的平移和縮放的動畫。

所以本章主要的還是討論transform動畫

動畫的語法api

動畫的語法常用的有兩種方式

1. UIView的block方式

    [UIView animateWithDuration:2.0 animations:^{
        view.transform = transform;
    }];
   

2. UIView的begin-commit方式

    - (void)transformLeftToRightAndScale {
        UIView *view = [self getView];
        CGRect start = CGRectMake(10, 64 + 10 + 2 * (50 + 10), 50, 50);
        view.frame = start;
        [self.view addSubview:view];
        
        CGAffineTransform bigTransform = CGAffineTransformMakeScale(1.2, 1.2);
        
        CGFloat fx = BoundW - CGRectGetWidth(view.frame) - 10 - 10; // 沿著X方向平移
        CGFloat fy = - 2 * (50 + 10); // 沿著Y方向平移
        CGAffineTransform moveTransform = CGAffineTransformMakeTranslation(fx, fy);
        
        CGAffineTransform rotate = CGAffineTransformMakeRotation(M_PI);
        
        [UIView beginAnimations:@"move" context:nil];
        [UIView setAnimationDelegate:self];
        [UIView setAnimationDuration:2.0];
        
        [view setTransform:CGAffineTransformConcat(rotate, CGAffineTransformConcat(bigTransform, moveTransform))];
        
        [UIView commitAnimations];
    }

仿射變換巷波，仿射變換的兩種類型--二維和三維

仿射變換分為二維的仿射變換和三維的仿射變換河闰，對應(yīng)的api分別為CGAffineTransform，CATransform3D.

CGAffineTransform

CGAffineTransform適用于平移褥紫，縮放姜性，旋轉(zhuǎn)，在二維空間進行操作髓考。api為animationView.transform = transform部念。來先看一下CGAffineTransform的數(shù)據(jù)結(jié)構(gòu)。

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

CGAffineTransform使用一個結(jié)構(gòu)體進行封裝氨菇，本質(zhì)上表達的是一個3*3的矩陣儡炼。由于第三列始終是(0,0,1)，因此數(shù)據(jù)結(jié)構(gòu)僅包含前兩列的值查蓉。

CGAffineTransform矩陣.png

CGAffineTransform從概念上講乌询，仿射變換將表示圖形中每個點（x，y）的行向量乘以該矩陣豌研，從而生成表示對應(yīng)點（x'妹田，y'）的向量：

image.png

給定3乘3矩陣，以下等式用于將一個坐標系中的點（x鹃共，y）變換為另一個坐標系中的合成點（x'鬼佣，y'）

image.png

所以當(dāng)兩個仿射進行連接，本質(zhì)上是兩個仿射變換的矩陣乘積

矩陣數(shù)學(xué)計算公式 理解矩陣乘法

矩陣計算公式.png

CGAffineTransform的相關(guān)api

最具體的還是參考 CGAffineTransform文檔

1. 創(chuàng)建仿射變換矩陣

    CGAffineTransform CGAffineTransformMake(CGFloat a, CGFloat b, CGFloat c, CGFloat d, CGFloat tx, CGFloat ty); //返回根據(jù)您提供的值構(gòu)造的仿射變換矩陣
   
    CGAffineTransform CGAffineTransformMakeRotation(CGFloat angle); //返回根據(jù)您提供的旋轉(zhuǎn)值構(gòu)造的仿射變換矩陣霜浴。
   
    CGAffineTransform CGAffineTransformMakeScale(CGFloat sx, CGFloat sy); //返回由您提供的縮放值構(gòu)造的仿射變換矩陣晶衷。
   
    CGAffineTransform CGAffineTransformMakeTranslation(CGFloat tx, CGFloat ty); //返回根據(jù)您提供的轉(zhuǎn)換值構(gòu)造的仿射變換矩陣
   

2. 修改仿射變換

    CGAffineTransform CGAffineTransformTranslate(CGAffineTransform t, CGFloat tx, CGFloat ty); // 通過修改現(xiàn)有仿射變換而構(gòu)造的仿射變換矩陣。
    
    CGAffineTransformScale // 返回通過縮放現(xiàn)有仿射變換而構(gòu)造的仿射變換矩陣
    
    CGAffineTransformRotate // 返回通過旋轉(zhuǎn)現(xiàn)有仿射變換構(gòu)造的仿射變換矩陣
    
    CGAffineTransformInvert // 返回通過反轉(zhuǎn)現(xiàn)有仿射變換而構(gòu)造的仿射變換矩陣
    
    CGAffineTransformConcat // 返回通過組合兩個現(xiàn)有仿射變換而構(gòu)造的仿射變換矩陣

3. 應(yīng)用仿射變換

    CGPoint CGPointApplyAffineTransform(CGPoint point, CGAffineTransform t); // 將指定的仿射變換應(yīng)用于現(xiàn)有點所產(chǎn)生的新點
    
    CGSize CGSizeApplyAffineTransform(CGSize size, CGAffineTransform t); // 通過將指定的仿射變換應(yīng)用于現(xiàn)有大小而產(chǎn)生的新大小
    
    CGRect CGRectApplyAffineTransform(CGRect rect, CGAffineTransform t); // 變換后的矩形
   

CGAffineTransformConcat

組合兩個已存在的仿射變換阴孟，數(shù)學(xué)本質(zhì)上是兩個矩陣進行乘積晌纫。

CGAffineTransform CGAffineTransformConcat(CGAffineTransform t1, CGAffineTransform t2);

CATransform3D

CATransform3D變換矩陣用于旋轉(zhuǎn)，縮放永丝，平移锹漱，傾斜和投影圖層內(nèi)容，適用于二維和三維空間進行變換类溢。api為animationView.layer.transform = transform凌蔬。來先看一下CATransform3D的數(shù)據(jù)結(jié)構(gòu)。

struct CATransform3D
{
  CGFloat m11, m12, m13, m14;
  CGFloat m21, m22, m23, m24;
  CGFloat m31, m32, m33, m34;
  CGFloat m41, m42, m43, m44;
};

CATransform3D是一4*4的矩陣闯冷，同樣表示一個點的映射關(guān)系 iOS核心動畫：高級技巧（2014）

image.png

CATransform3D操作api

//還原
 CATransform3DIdentity

//位移3D仿射  ==> (CGFloat tx, CGFloat ty, CGFloat tz)
CATransform3DMakeTranslation
CATransform3DTranslate        
//旋轉(zhuǎn)3D仿射 ==> (CGFloat angle, CGFloat x, CGFloat y, CGFloat z)
CATransform3DMakeRotation
CATransform3DRotate  
//縮放3D仿射 ==>  (CGFloat angle, CGFloat x, CGFloat y, CGFloat z)
CATransform3DMakeScale
CATransform3DScale
//疊加3D仿射效果
CATransform3DConcat    
//仿射基礎(chǔ)3D方法砂心，可以直接做效果疊加
CGAffineTransformMake (sx,shx,shy,sy,tx,ty)
//檢查是否有做過仿射3D效果  == ((CATransform3D t))
CATransform3DIsIdentity(transform)
//檢查2個3D仿射效果是否相同
CATransform3DEqualToTransform(transform1,transform2)
//3D仿射效果反轉(zhuǎn)（反效果，比如原來擴大蛇耀，就變成縮斜绲）
CATransform3DInvert(transform)

帶有Make的為構(gòu)建api，即創(chuàng)建一個CATransform3D類型的仿射變換纺涤。沒有帶Make一般為修改給定的仿射變換译暂，并返回修改后的仿射變換。如：

CATransform3D CATransform3DMakeTranslation(CGFloat tx, CGFloat ty, CGFloat tz); // 返回一個設(shè)定了轉(zhuǎn)移的仿射變換

CATransform3D CATransform3DTranslate(CATransform3D t, CGFloat tx, CGFloat ty, CGFloat tz); // 修改給定的`CATransform3D t`

CATransform3DConcat

類似的撩炊，和CGAffineTransformConcat一樣外永，用于連接兩個仿射變換，返回一個連接后的仿射變換拧咳。

CATransform3D CATransform3DConcat(CATransform3D a, CATransform3D b); // Concatenates b to a and returns the result: t = a * b.

結(jié)尾

下一章節(jié)伯顶，可以看看Core Animation中的動畫實現(xiàn)。