iOS開發UI篇 CALayer簡介

2021-07-10 22:10:41 字數 3442 閱讀 5383

ios開發ui篇—calayer簡介

一、簡單介紹

在ios中,你能看得見摸得著的東西基本上都是uiview,比如乙個按鈕、乙個文字標籤、乙個文字輸入框、乙個圖示等等,這些都是uiview。

其實uiview之所以能顯示在螢幕上,完全是因為它內部的乙個圖層,在建立uiview物件時,uiview內部會自動建立乙個圖層(即calayer物件),通過uiview的layer屬性可以訪問這個層

@property(nonatomic,readonly,retain) calayer *layer; 

當uiview需要顯示到螢幕上時,會呼叫drawrect:方法進行繪圖,並且會將所有內容繪製在自己的圖層上,繪圖完畢後,系統會將圖層拷貝到螢幕上,於是就完成了uiview的顯示

換句話說,uiview本身不具備顯示的功能,擁有顯示功能的是它內部的圖層。

二、簡單使用

uiview之所以能夠顯示,完全是因為內部的calayer物件。因此,通過操作這個calayer物件,可以很方便地調整uiview的一些介面屬性,比如:陰影、圓角大小、邊框寬度和顏色等。

新建乙個專案,在storyboard中新增乙個view.

1.通過layer設定邊框的寬度和顏色 1

#import

"yyviewcontroller.h" 2

3@inte***ce

yyviewcontroller () 4

@property (weak, nonatomic) iboutlet uiview *customview; 5

6@end 7

8@implementation

yyviewcontroller 9

10- (void

)viewdidload 11

18 19

@end

2.通過layer設定邊框為圓角 1

//設定layer的圓角 2

self.customview.layer.cornerradius=20;

3.在layer上新增一張  1

#import

"yyviewcontroller.h" 2

3@inte***ce

yyviewcontroller () 4

@property (weak, nonatomic) iboutlet uiview *customview; 5

6@end 7

8@implementation

yyviewcontroller 9

10- (void

)viewdidload 11

25@end

說明:contents是id型別,可以接受內容,上面的例項讓layer顯示一張,仔細觀察可以發現四個圓角的部分露了乙個角出來。

產生的原因說明:

customview上的根layer

uiimage的圖層

新增後

那是因為設定的image不是展示在主圖層上的,而是顯示在子圖層上的。可以通過設定乙個範圍,設定超出主圖層的部分把它給剪下掉。

有以下兩種方法,建議使用layer中的方法(第二種)self.customview.layer.maskstobounds=yes; 1

- (void

)viewdidload 2

注意:layer中不能直接接受ui框架中的東西

4.設定陰影

設定陰影,不光需要設定陰影顏色,還應該設定陰影的偏移位和透明度。

因為如果不設定偏移位的話,那麼陰影和layer完全重疊,且預設透明度為0(即完全透明)。 1

- (void

)viewdidload 2

補充說明:

如果設定了超過主圖層的部分減掉,則設定陰影不會有顯示效果。 1

- (void

)viewdidload 2

把剪下超出主圖層部分的**注釋掉之後的顯示效果 1

- (void

)viewdidload 2

5.只要繼承自uiview的都有layer屬性,下面以為例進行說明。

在storyboard中新新增一張。

簡單設定示例 1

#import

"yyviewcontroller.h" 2

3@inte***ce

yyviewcontroller () 4

@property (weak, nonatomic) iboutlet uiview *customview; 5

@property (weak, nonatomic) iboutlet uiimageview *iconview; 6

7@end 8

9@implementation

yyviewcontroller 10

11- (void

)viewdidload 12

設定bounds屬性,在設定時需要去除掉storyboard中的自動布局屬性。

設定的形變屬性(transform) 1

@implementation

yyviewcontroller 2

3- (void

)viewdidload 4

7 8-(void

)touchesbegan:(nsset *)touches withevent:(uievent *)

event 9

通過uiview設定(2d效果)

通過layer設定(3d效果)

使用kvc進行設定 1

#import

"yyviewcontroller.h" 2

3@inte***ce

yyviewcontroller () 4

@property (weak, nonatomic) iboutlet uiview *customview; 5

@property (weak, nonatomic) iboutlet uiimageview *iconview; 6

7@end 8

9@implementation

yyviewcontroller 10

11- (void

)viewdidload 12

15 16

-(void

)touchesbegan:(nsset *)touches withevent:(uievent *)

event 17

檢視蘋果的官方文件,下面的屬性都可以通過kvc進行設定。

旋轉乙個弧度 1

@implementation

yyviewcontroller 2

3- (void

)viewdidload 4

7 8-(void

)touchesbegan:(nsset *)touches withevent:(uievent *)

event 9

補充:三維座標系

iOS開發UI篇 CAlayer層的屬性

ios開發ui篇 calayer層的屬性 一 position和anchorpoint 1.簡單介紹 calayer有2個非常重要的屬性 position和anchorpoint property cgpoint position 用來設定calayer在父層中的位置 以父層的左上角為原點 0,0 ...

iOS開發UI篇 CAlayer層的屬性

ios開發ui篇 calayer層的屬性 一 position和anchorpoint 1.簡單介紹 calayer有2個非常重要的屬性 position和anchorpoint property cgpoint position 用來設定calayer在父層中的位置 以父層的左上角為原點 0,0 ...

iOS開發UI篇 CAlayer層的屬性(一)

一 position和anchorpoint 1.簡單介紹 calayer有2個非常重要的屬性 position和anchorpoint property cgpoint position 用來設定calayer在父層中的位置 以父層的左上角為原點 0,0 property cgpoint anch...