天天看點

iOS開發UI篇—CAlayer層的屬性

一、position和anchorpoint

1.簡單介紹

calayer有2個非常重要的屬性:position和anchorpoint

@property cgpoint position;

用來設定calayer在父層中的位置

以父層的左上角為原點(0, 0)

@property cgpoint anchorpoint;

稱為“定位點”、“錨點”

決定着calayer身上的哪個點會在position屬性所指的位置

以自己的左上角為原點(0, 0)

它的x、y取值範圍都是0~1,預設值為(0.5, 0.5)

2.圖示

anchorpoint

它的取值為0~1

iOS開發UI篇—CAlayer層的屬性

紅色圖層的anchorpoint為(0,0)

iOS開發UI篇—CAlayer層的屬性

紅色圖層的anchorpoint為(0.5,0.5)

iOS開發UI篇—CAlayer層的屬性

紅色圖層的anchorpoint為(1,1)

iOS開發UI篇—CAlayer層的屬性

紅色圖層的anchorpoint為(0.5,0)

iOS開發UI篇—CAlayer層的屬性

position和anchorpoint

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

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

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

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

iOS開發UI篇—CAlayer層的屬性

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

iOS開發UI篇—CAlayer層的屬性

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

iOS開發UI篇—CAlayer層的屬性

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

iOS開發UI篇—CAlayer層的屬性

3.代碼示例

(1)沒有設定錨點。預設的錨點位置為(0.5,0.5)

iOS開發UI篇—CAlayer層的屬性
iOS開發UI篇—CAlayer層的屬性

顯示效果:

iOS開發UI篇—CAlayer層的屬性
iOS開發UI篇—CAlayer層的屬性

(1)設定錨點位置為(0,0)

iOS開發UI篇—CAlayer層的屬性
iOS開發UI篇—CAlayer層的屬性
iOS開發UI篇—CAlayer層的屬性

二、隐式動畫

1.簡單說明

每一個uiview内部都預設關聯着一個calayer,我們可用稱這個layer為root layer(根層)

所有的非root layer,也就是手動建立的calayer對象,都存在着隐式動畫

什麼是隐式動畫?

當對非root layer的部分屬性進行修改時,預設會自動産生一些動畫效果

而這些屬性稱為animatable properties(可動畫屬性)

列舉幾個常見的animatable properties:

bounds:用于設定calayer的寬度和高度。修改這個屬性會産生縮放動畫

backgroundcolor:用于設定calayer的背景色。修改這個屬性會産生背景色的漸變動畫

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

2.代碼示例

iOS開發UI篇—CAlayer層的屬性
iOS開發UI篇—CAlayer層的屬性

效果:

iOS開發UI篇—CAlayer層的屬性
iOS開發UI篇—CAlayer層的屬性

關閉隐式動畫:

3.如何檢視calayer的某個屬性是否支援隐式動畫?

  可以檢視頭檔案,看有沒有animatable,如果有則表示支援。

iOS開發UI篇—CAlayer層的屬性

也可以檢視官方文檔

iOS開發UI篇—CAlayer層的屬性

文檔中标明的這些屬性都是支援隐式動畫的

iOS開發UI篇—CAlayer層的屬性

繼續閱讀