CATransformLayer是用來(lái)創(chuàng)建立體型的layer的，CATransformLayer就是一個(gè)立體的容器，然后分別添加每一面的layer，構(gòu)成一個(gè)立體型的圖層。

    //創(chuàng)建transformLayer對(duì)象并添加到頁(yè)面上
    self.transformLayer = [CATransformLayer layer];
    self.transformLayer.bounds = CGRectMake(0, 0, self.view.bounds.size.width, self.view.bounds.size.height);
    self.transformLayer.position = self.view.center;
    [self.view.layer addSublayer:self.transformLayer];
    CGFloat positionX = self.transformLayer.bounds.size.width/2;
    CGFloat positionY = self.transformLayer.bounds.size.height/2;
    //上下面需要繞x軸旋轉(zhuǎn)90度
    //添加立方體上方的面
    CATransform3D topTransform = CATransform3DMakeRotation(M_PI_2, 1, 0, 0);
    [self creatLayerWithX:positionX Y:positionY-kWidth/2 Z:0 andTransform:topTransform];
    //添加立方體下方的面
    CATransform3D bottomTransform = CATransform3DMakeRotation(M_PI_2, 1, 0, 0);
    [self creatLayerWithX:positionX Y:positionY+kWidth/2 Z:0 andTransform:bottomTransform];
    //左右面需要繞y軸旋轉(zhuǎn)90度
    //添加立方體左方的面
    CATransform3D leftTransform = CATransform3DMakeRotation(M_PI_2, 0, 1, 0);
    [self creatLayerWithX:positionX-kWidth/2 Y:positionY Z:0 andTransform:leftTransform];
    //添加立方體右方的面
    CATransform3D rightTransform = CATransform3DMakeRotation(M_PI_2, 0, 1, 0);
    [self creatLayerWithX:positionX+kWidth/2 Y:positionY Z:0 andTransform:rightTransform];
    //前后面不需要繞旋轉(zhuǎn)，只需要調(diào)整z軸方向的數(shù)值
    //添加立方體前方的面
    [self creatLayerWithX:positionX Y:positionY Z:-kWidth/2 andTransform: CATransform3DIdentity];
    //添加立方體后方的面
    [self creatLayerWithX:positionX Y:positionY Z:kWidth/2 andTransform: CATransform3DIdentity];

//創(chuàng)建立方體的各個(gè)面并添加到transformLayer上
- (void)creatLayerWithX:(float)x Y:(float)y Z:(float)z andTransform:(CATransform3D)transform {
    CALayer *layer = [CALayer layer];
    layer.bounds = CGRectMake(0, 0, 180, 180);
    layer.position = CGPointMake(x, y);
    layer.zPosition = z;
    layer.transform = transform;
    layer.contents = (id)[UIImage imageNamed:@"icon180*180"].CGImage;
    [self.transformLayer addSublayer:layer];
}

創(chuàng)建出來(lái)的立方體添加到頁(yè)面之后，只能看到立方體前面的一個(gè)面，看起來(lái)就是一個(gè)靜態(tài)的頁(yè)面，對(duì)立方體的立體表現(xiàn)不夠直觀。然后給頁(yè)面添加一個(gè)平移手勢(shì)，使用平移手勢(shì)控制立方體的旋轉(zhuǎn)。

-(void)handlePanGestureRecognizer:(UIPanGestureRecognizer *)gesture {
    CGPoint translation = [gesture translationInView:self.view];
    CATransform3D transform = CATransform3DIdentity;
    transform = CATransform3DRotate(transform, translation.x * 1 / 100, 0, 1, 0);
    transform = CATransform3DRotate(transform, translation.y * - 1 / 100, 1, 0, 0);
    self.transformLayer.sublayerTransform = transform;
}

transformLayer.gif

這里用到的一個(gè)很重要的東西就是CATransform3D，它定義了圖層在三維方向上的變化矩陣，使用CATransform3D可以很容易在二維平面做出翻頁(yè)這樣的三維效果。

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

矩陣中的每一個(gè)參數(shù)都對(duì)應(yīng)著對(duì)某一條邊的旋轉(zhuǎn)，或縮放，或平移的調(diào)節(jié)作用，我們沒(méi)必要清楚地知道每一個(gè)參數(shù)的具體作用，因?yàn)橛袔讉€(gè)方法可以幫助我們實(shí)現(xiàn)旋轉(zhuǎn)縮放平移的功能，只要掌握這幾個(gè)方法就可以了。不過(guò)，其中有一個(gè)非常重要的參數(shù)是m34。一個(gè)物理常識(shí)就是離我們眼睛近的物體顯得更大，離的遠(yuǎn)的物體顯得更小，這樣我們實(shí)現(xiàn)的翻頁(yè)效果就更立體逼真。
m34 = -1.0/d d就是距離眼睛的距離值，一般500-1000之間效果最理想，-1.0表示縮小與眼睛之間的距離，1.0表示擴(kuò)大與眼睛之間的距離。

幾個(gè)CATransform3D變換的主要方法：

//返回一個(gè)CATransform3D對(duì)象，表示兩個(gè)CATransform3D對(duì)象屬性疊加的結(jié)果
CATransform3D CATransform3DConcat (CATransform3D a, CATransform3D b);

//tx,ty,tz分別表示x,y,z軸的平移
CATransform3D CATransform3DMakeTranslation (CGFloat tx, CGFloat ty, CGFloat tz);

//t是一個(gè)CATransform3D對(duì)象，tx,ty,tz分別表示基于t的基礎(chǔ)上的x,y,z軸的平移
CATransform3D CATransform3DTranslate (CATransform3D t, CGFloat tx, CGFloat ty, CGFloat tz);

//sx,sy,sz分別表示x,y,z軸的縮放比例
CATransform3D CATransform3DMakeScale (CGFloat sx, CGFloat sy, CGFloat sz);

//t是一個(gè)CATransform3D對(duì)象，sx,sy,sz分別表示基于t的基礎(chǔ)上的x,y,z軸的縮放
CATransform3D CATransform3DScale (CATransform3D t, CGFloat sx, CGFloat sy, CGFloat sz);

//angle為旋轉(zhuǎn)角度，x,y,z的值決定著繞哪個(gè)軸旋轉(zhuǎn)，(M_PI_4, 1, 0, 0)表示繞x軸旋轉(zhuǎn)45度，(M_PI_4, 0, 1, 0)表示繞y軸旋轉(zhuǎn)45度，(M_PI_4, 0, 0, 1)表示繞z軸旋轉(zhuǎn)45度
CATransform3D CATransform3DMakeRotation (CGFloat angle, CGFloat x, CGFloat y, CGFloat z);

//t是一個(gè)CATransform3D對(duì)象，在此基礎(chǔ)上旋轉(zhuǎn)，其他參數(shù)同上
CATransform3D CATransform3DRotate (CATransform3D t, CGFloat angle, CGFloat x, CGFloat y, CGFloat z);

更多CATransform3D相關(guān)文章，請(qǐng)點(diǎn)擊這里和這里, 還有這里.
使用CATransformLayer實(shí)現(xiàn)一個(gè)立體頁(yè)面滾動(dòng)的效果:

    //創(chuàng)建transformLayer對(duì)象并添加到頁(yè)面上
    self.transformLayer = [CATransformLayer layer];
    self.transformLayer.bounds = CGRectMake(0, 0, self.view.bounds.size.width, self.view.bounds.size.height);
    self.transformLayer.position = self.view.center;
    [self.view.layer addSublayer:self.transformLayer];
    CGFloat positionX = self.transformLayer.bounds.size.width/2;
    CGFloat positionY = self.transformLayer.bounds.size.height/2;
    //添加六個(gè)面
    [self creatLayerWithX:positionX Y:positionY Z:173 andTransform:CATransform3DIdentity];
    CATransform3D twoTransform = CATransform3DMakeRotation(M_PI/3, 0, 1, 0);
    [self creatLayerWithX:positionX+150 Y:positionY Z:86 andTransform:twoTransform];
    CATransform3D threeTransform = CATransform3DMakeRotation(-M_PI/3, 0, 1, 0);
    [self creatLayerWithX:positionX-150 Y:positionY Z:86 andTransform:threeTransform];
    CATransform3D fourTransform = CATransform3DMakeRotation(M_PI*2/3, 0, 1, 0);
    [self creatLayerWithX:positionX+150 Y:positionY Z:-86 andTransform:fourTransform];
    CATransform3D fiveTransform = CATransform3DMakeRotation(-M_PI*2/3, 0, 1, 0);
    [self creatLayerWithX:positionX-150 Y:positionY Z:-86 andTransform:fiveTransform];
    CATransform3D sixTransform = CATransform3DMakeRotation(M_PI, 0, 1, 0);
    [self creatLayerWithX:positionX Y:positionY Z:-173 andTransform:sixTransform];
    //添加動(dòng)畫
    CATransform3D transA = CATransform3DMakeRotation(M_PI/3, 0, 1, 0);
    CABasicAnimation *animation = [CABasicAnimation animationWithKeyPath:@"transform"];
    animation.duration = 3;
    animation.repeatCount = HUGE_VALF;
    animation.toValue = [NSValue valueWithCATransform3D:transA];
    [self.transformLayer addAnimation:animation forKey:nil];

transformAnimation.gif

CATransformLayer的使用就簡(jiǎn)單的說(shuō)這些吧， 關(guān)于翻頁(yè)這樣的立體效果，使用CATransform3D能夠更方便的實(shí)現(xiàn)，CATransform3D相關(guān)的內(nèi)容多看多練習(xí)就能夠自如應(yīng)用了。
參考鏈接：
https://www.cnblogs.com/zhouxihi/p/6290495.html
http://www.itdecent.cn/p/31edd92a7f76