iOS核心動畫筆記1-圖層的樹狀結構

從今天開始, 準備系統的學習一下iOS中的核心動畫了, 準備花一個月時間, 利用空閒時間把全部章節內容都看完, demo都敲完, 每一個章節的筆記就記在這裏了, demo記在github上. 我認爲的重點我會提取出來到這裏記下來.

電子教程是在極客學院上的這個: http://wiki.jikexueyuan.com/project/ios-core-animation/coating-tree.html

dmeo在個人github上:

圖層的樹狀結構

Core Animation, 顧名思義, 就是核心動畫, 很容易讓人誤解是一個專門用來作動畫的框架, 其實否則. 動畫只是 Core Animation 衆多功能中的冰山一角.

1. 圖層和視圖

在iOS中, 全部的視圖都是從一個叫UIView的基類派生而來的, UIView能夠處理觸摸事件, 能夠支持Core Graphics繪圖, 放射變換, 滑動揮着漸變的動畫.

CALayer:

CALayer在概念上和UIView相似, 也能夠像UIView同樣, 在layer上添加或者移除subLayer, 也能夠包含一些圖片, 文本背景顏色等內容, 也有一些方法和屬性作動畫, 它和UIView最大的不一樣是, CALyer不能處理用戶的交互.CALayer並不清楚響應者鏈, 因此它不可以響應事件.

UIView:

每一個UIView都有一個對應的平行層級的CALayer屬性,視圖的職責實際上是管理這個圖層, 實際上, 這些背後關聯的圖層纔是真正用來在屏幕上顯示和作動畫的, UIView只是對它的一個封裝, 提供了一些iOS相似於出沒處理的具體功能, 以及CoreAnimation底層方法的高級接口(clipsToBounds, transform等).

爲何要同時維持UIView和CALayer兩個層級?

簡單的說, 職責分明. Objective-C語言開發須要同時支持iOS開發和mac OS開發. 而在iOS和macOS中事件處理方式是不一樣的, 各類操做習慣也是不一樣的, iOS中是基於觸摸屏幕的, Mac OS中是基於鼠標點擊事件的, 因此在iOS中咱們使用UIView這個視圖, 而macOS中使用NSView這個視圖. 而用來真正顯示內容的CALayer單獨列爲一個新的層級, 好處就是能夠在兩個平臺共享代碼, 兩個平臺都使用CALayer圖層, 可是上層的封裝劃分爲UIView與NSView便可. 這樣, 不論是蘋果本身開發團隊仍是第三方其餘開發團隊, 均可以節約不少的時間成本.

2. 圖層能用來作什麼

CALayer是UIView的內部實現細節, 可是咱們仍是有必要去了解這個細節. 若是是簡單的需求, 咱們只須要使用UIView這樣的高級視圖便可, UIView的高級API間接的使用CALayer的相關功能, 會讓開發更加簡單, 可是若是想作一點改變, 作一點點不同凡響的東西, 就必須藉助CALayer圖層了.

UIView沒有暴露出來的CALayer功能:

• 陰影效果, 圓角效果, 帶顏色的邊框
• 3D變換
• 非矩形的範圍
• 透明遮罩層
• 多級非線性動畫

3. 使用圖層

首先咱們須要知道, CALayer被包含在 <QuartzCore/QuartzCore.h>框架中.

默認狀況下, 一個視圖只有一個相關聯的圖層, 同時也能夠支持添加無數個子圖層, 若是須要添加子圖層, 咱們能夠顯式建立一個單獨的圖層, 而且添加到視圖關聯的子圖層中.

使用CALayer的好處:

• 能夠用來開發Macros OS和iOS掛平臺的應用.
• 使用一些特殊的Layer, 有不少CALayer的子類, 用來專門處理不一樣的視圖展現.
• 對性能特別挑剔, 或者特別注重性能的應用.

4. UIView中, 層級關係是用過Layer維繫在一塊兒的

如下代碼證實: UIView中的層級關係是經過CALayer圖層來關聯在一塊兒的. 就是說, 向view上面添加一個子view, 至關於在view的layer圖層上添加了子view的layer圖層.

// 建立一個view, 並添加到self.view上面
    UIView *layerView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 100, 100)];
    [self.view addSubview:layerView];
    layerView.center = self.view.center;
    layerView.backgroundColor = [UIColor lightGrayColor];
    NSLog(@"%ld", layerView.layer.sublayers.count); /// result: 0
    
    
    // 建立一個子view. 並將之添加到 layerView上面
    UIView *subView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 10, 20)];
    [layerView addSubview:subView];
    subView.backgroundColor = [UIColor redColor];
    NSLog(@"%ld", layerView.layer.sublayers.count); /// result: 1
    
    
    // 建立CALayer對象, 直接添加到layerView.layer圖層上
    CALayer *blueLayer = [CALayer layer];
    [layerView.layer addSublayer:blueLayer];
    blueLayer.backgroundColor = [UIColor blueColor].CGColor;
    blueLayer.frame = CGRectMake(30, 30, 30, 30);
    NSLog(@"%ld", layerView.layer.sublayers.count); /// result: 2