IOS-Core Animation

1.Core Animation 類結構

一、CALayer 中 名叫圖層類,是整個Core Animation的基礎,也是全部Core Animation圖層類的 類。

二、CAAnimation CAAnimation是全部Core Animation中動畫類的 類,遵照NSCoding、NSCopying、 CAMediaTiming和CAAction協議,負責實現各類動畫效果,是Cocoa Touch動畫的基礎。

三、CAMediaTimingFunction 該類定義了 個動畫的執 步調, 前Core Animation提供有 kCAMediaTimingFunctionLinear、kCAMediaTimingFunctionEaseIn、 kCAMediaTimingFunctionEaseOut、kCAMediaTimingFunctionEaseInEaseOut四種,固然咱們也 能夠定製 想要的執 步調。

四、CATransaction CATransaction(事務)是Core Animation中 個將若干個對圖層樹的屬性修改操做以原 式 更新到渲染樹的機制。全部對圖層樹的修改都須要有事務,只不過有的是隱式的使 事務,有的是 顯式的使 事務。事務 持嵌套使 。

2.CALayer基礎

1.內容簡介 在咱們學習動畫以前,先學習圖層樹,CALayer類在概念上和UIView相似,一樣也是 些被層級關係 樹管理的矩形塊,一樣也能夠包含 些內容(像圖 , 本或者背景 ),管理 圖層的位置。它們有 些 法和屬性 來作動畫和變換。和UIView最 的不一樣是CALayer不處理 戶的交互。由於CALayer並不 清楚具體的響應鏈。實際上,這些背後關聯的圖層纔是真正 來在屏幕上顯 和作動畫,UIView僅僅是對 CALayer的 個封裝,而後提供了處理觸摸的具體功能,以及CoreAnimation的 級接 。

可是爲何iOS要基於UIView和CALayer提供兩個平 的層級關係呢?爲何不 個簡單的層級來 處理全部事情呢?緣由在於要作職責分離,這樣也能避免不少重複代碼。在iOS和Mac OS兩個平臺上,事 件和 戶交互有不少地 的不一樣,基於多點觸控的 戶界 和基於 標鍵盤有着本質的區別,這就是爲什 麼iOS有UIKit和UIView,可是Mac OS有AppKit和NSView的緣由。他們功能上很類似,可是在實現上有着 顯著的區別。 前 已經講過,UIView是對CALayer的封裝,那爲何咱們還要學習CALayer呢?由於UIView封裝的 API在有些狀況下並不能滿 咱們的需求, 如: 1.陰影,圓 ,邊框

2.3D變換

3.矩形範圍

4.遮罩

5.線性動畫

2.視圖的層級關係 3.圖層的層級關係

3.CALayer的使用

1.建立CALayer

// 建立layer
    CALayer *layer = [[CALayer alloc] init];
    layer.frame = CGRectMake(10, 320, 330, 200);
    layer.backgroundColor = [UIColor blueColor].CGColor; 
    // 將圖層添加到父圖層
    [self.view.layer addSublayer:layer];

2.對CALayer進行填充

// 填充圖片內容，須要將 UIImage 橋接(__bridge)到CGImage
    layer.contents = (__bridge id _Nullable)([UIImage imageNamed:@"image4.jpg"].CGImage);
    // 使用layer CATextLayer 子類填充文字
    CATextLayer *textLayer = [[CATextLayer alloc] init];
    textLayer.frame = CGRectMake(10, 550, 300, 30);
    textLayer.string = @"這是layer填充的文字內容";
    textLayer.foregroundColor = [UIColor blackColor].CGColor;
    textLayer.backgroundColor = [UIColor redColor].CGColor;
    textLayer.font = (__bridge CFTypeRef _Nullable)([UIFont systemFontOfSize:20 weight:500]);
    textLayer.fontSize = 20;
    textLayer.alignmentMode = @"center";
    // textLayer.truncationMode = @"middle";
    [self.view.layer addSublayer:textLayer];

3.CALayer的基本設置

CALayer *layer = [CALayer layer];
    // layer.frame = CGRectMake(0, 100, 350, 200);
    layer.backgroundColor = [UIColor orangeColor].CGColor;
    // 一、bounds： 尺寸
    layer.bounds = CGRectMake(0, 0, 200, 200);
    // 二、position: 定位點
    layer.position = self.view.center;
    // 三、錨點、支點：決定layer上的哪一個點在 position 點上，默認(0.5, 0.5)，範圍：（0，0） ~ （1，1）
    layer.anchorPoint = CGPointMake(0.5, 0.5);
    // 四、z方向的層級
    layer.zPosition = 2;
    // 五、設置圓角：cornerRadius
    layer.cornerRadius = 100;

4.CALayer填充設置

// 一、填充內容
    layer.backgroundColor = [UIColor colorWithPatternImage:[UIImage imageNamed:@"juhua"]].CGColor;
    // 二、是否能夠裁剪多餘的圖層
    // layer.masksToBounds = YES;
    // 三、設置邊框寬度和顏色
    layer.borderWidth = 5;
    layer.borderColor = [UIColor lightGrayColor].CGColor;
    
    // 四、設置陰影: 尺寸、顏色、透明度、圓角
    layer.shadowOffset = CGSizeMake(10, 5);
    layer.shadowColor = [UIColor redColor].CGColor;
    layer.shadowOpacity = 0.5;
    layer.shadowRadius = 10;

5.動畫設置

// 隱式動畫: 當layer的屬性發生變換時會默認產生動畫效果，動畫時間0.25s
   layer.opacity = 0.2;
   layer.cornerRadius = 50;
   
   // 組合 CATransform3D
   CATransform3D transform_01 = CATransform3DScale(layer.transform, 2, 2, 1);
   CATransform3D transform_02 = CATransform3DRotate(layer.transform, M_PI_4, 0, 0, 1);
   layer.transform = CATransform3DConcat(transform_01, transform_02);
   
   dispatch_after(dispatch_time(DISPATCH_TIME_NOW, (int64_t)(1 * NSEC_PER_SEC)), dispatch_get_main_queue(), ^{
       
       layer.opacity = 1;
       layer.cornerRadius = 0;
       layer.transform = CATransform3DIdentity;

6.3D變換

// 一、經過函數設置transform
    layer.transform = CATransform3DTranslate(layer.transform, 0, 0, 100);
    
    layer.transform = CATransform3DScale(layer.transform, 1, 1, 1.5);
    
    layer.transform = CATransform3DRotate(layer.transform, M_PI_4, 0, 0, 1);

固然，在設置CALayer的transform時你也可使用其餘不一樣的方法來設置，好比你能夠經過 KVC 設置transform。