CALayer

界面中看得到的東西就是CALayer

我們見的最多的就是 UIView, 但是每個 UIView 中可以看得見的東西是 CALayer。

// 每個 UIView 對象都會有一個 layer 的 root 圖層。
@property(nonatomic,readonly,retain) CALayer *layer; 

創建UIView對象時,UIView內部會自動創建一個圖層(即CALayer對象),通過UIView的layer屬性可以訪問這個層。
UIView需要顯示到屏幕上時,會調用drawRect:方法進行繪圖,并且會將所有內容繪制在自己的圖層上,繪圖完畢后,系統會將圖層拷貝到屏幕上,于是就完成了UIView的顯示
換句話說。
UIView本身不具備顯示的功能,擁有顯示功能的是它內部的圖層。

UIView 視覺相關的一切我們都可以調整 view 的 layer 來達到目的。

view.layer.borderColor  // 邊框顏色
view.layer.borderWidth  // 邊框寬度
view.layer.cornerRadius  // 圓角
view.layer.masksToBounds  // 切除多余(切除找出主圖層(根圖層)部分的內容)

view.layer.shadowOffse  // 偏移(正右負數左)
view.layer.shadowColor  // 顏色
view.layer.shadowOpacity  // 透明度
view.layer.shadowPath     // 路徑
view.layer.shadowRadius  // 半徑

// 對陰影設置有影響
view.layer.masksToBounds
view.clipsToBounds

view.layer.contents = UIImage().cgImage  // 設置圖片
view.layer.contentsScale =   // 內容比例(和圖片配合使用)

view 和 layer 在形變上的區別

// 2D 變換
view.transform = CGAffineTransform(scaleX: 10, y: 10)
// 3D 變換
view.layer.transform =  CATransform3DMakeScale(10, 10, 10)

layer

let layer = CALayer()
layer.backgroundColor = UIColor.red.cgColor

// 大部分情況下 bounds + position 結合使用設置位置。 
// 基本不用frame
layer.bounds = CGRect(x: 0, y: 0, width: 100, height: 100)
layer.position = CGPoint(x: 100, y: 100)

UIView和CALayer的選擇

如果顯示出來的東西需要跟用戶進行交互的話,用UIView;如果不需要跟用戶進行交互,用UIView或者CALayer都可以

當然,CALayer的性能會高一些,因為它少了事件處理的功能,更加輕量級。

UIView可以通過subviews屬性訪問所有的子視圖,類似地,CALayer也可以通過sublayers屬性訪問所有的子層

UIView可以通過superview屬性訪問父視圖,類似地,CALayer也可以通過superlayer屬性訪問父層

position anchorPoint

  • position == view.center
  • anchorPoint(錨點、重心點)

position : 決定圖層中心在父圖層中的位置。
anchorPoint : 圖層中心點在圖層中的偏移。
默認情況下 position 和 anchorPoint 是重合的。

它的x、y取值范圍都是0~1,默認值為(0.5, 0.5)


anchorPoint = (0, 0)



anchorPoint = (0.5, 0.5)



anchorPoint = (1, 1)

anchorPoint = (0.5, 0)

添加一個紅色圖層到綠色圖層上,紅色圖層顯示到什么位置,由position屬性決定

假設紅色圖層的position是(100,100)

到底把紅色圖層的哪個點移動到(100,100)的坐標位置,錨點。



紅色圖層的錨點是(0,0)


紅色圖層的錨點是(0.5,0.5)



紅色圖層的錨點是(1,1)



紅色圖層的錨點是(0.5,0)

隱式動畫

每一個UIView內部都默認關聯著一個CALayer,我們可用稱這個Layer為Root Layer(根層)

所有的非Root Layer,也就是手動創建的CALayer對象,都存在著隱式動畫

什么是隱式動畫?

當對非Root Layer的部分屬性進行修改時,默認會自動產生一些動畫效果

而這些屬性稱為Animatable Properties(可動畫屬性)

列舉幾個常見的Animatable Properties:

bounds:用于設置CALayer的寬度和高度。修改這個屬性會產生縮放動畫

backgroundColor:用于設置CALayer的背景色。修改這個屬性會產生背景色的漸變動畫

position:用于設置CALayer的位置。修改這個屬性會產生平移動畫

關閉隱式動畫

CATransaction.begin()
// 關閉
CATransaction.setDisableActions(true)
CATransaction.commit()

layer 自定義

view 自定義

  1. 獲取上下文
  2. 繪制
  3. 渲染
    創建一個類,讓這個類繼承自UIView,然后重寫它的DrawRect:方法,然后在該方法中繪制。 調用 setNeedsDisplay

layer 自定義

  1. 獲取上下文
  2. 繪制
  3. 渲染
    創建一個類,讓這個類繼承自CALayer,然后重寫它的drawInContext: 方法,然后在該方法中繪制。 調用 setNeedsDisplay (UIView 在第一次顯示的時候會調用)
 override func draw(in ctx: CGContext) {
        //1.繪制圖形
        
        //畫一個圓
        ctx.addEllipse(in: CGRect(x: 50, y: 50, width: 50, height: 50))
        //設置屬性(顏色)
        //    [[UIColor yellowColor]set];
        ctx.setFillColor(red: 0, green: 0, blue: 1, alpha: 1)
        
        //2.渲染
        ctx.fillPath()
}

// 發現不顯示,可能是沒有調用這個方法
layer.setNeedsDisplay()  (layer 需要手動調用)
最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容

  • 在iOS中隨處都可以看到絢麗的動畫效果,實現這些動畫的過程并不復雜,今天將帶大家一窺ios動畫全貌。在這里你可以看...
    每天刷兩次牙閱讀 8,572評論 6 30
  • 在iOS中隨處都可以看到絢麗的動畫效果,實現這些動畫的過程并不復雜,今天將帶大家一窺iOS動畫全貌。在這里你可以看...
    F麥子閱讀 5,141評論 5 13
  • 轉載:http://www.cnblogs.com/jingdizhiwa/p/5601240.html 1.ge...
    F麥子閱讀 1,587評論 0 1
  • 概覽 在iOS中隨處都可以看到絢麗的動畫效果,實現這些動畫的過程并不復雜,今天將帶大家一窺iOS動畫全貌。在這里你...
    被吹落的風閱讀 1,603評論 1 2
  • CALayer - 在iOS中,你能看得見摸得著的東西基本上都是UIView,比如一個按鈕、一個文本標簽、一個文本...
    Hevin_Chen閱讀 1,159評論 0 10