核心動畫 CALayer簡介

2021-07-16 19:11:40 字數 4766 閱讀 1906

在ios中看得見摸得著的東西基本上都是uiview,而uiview之所以能看得見摸得著就是因為他有乙個層(calayer)

@property(nonatomic,readonly,strong) calayer  *layer;
在建立uiview物件時,uiview內部會自動建立乙個層(即calayer物件),通過uiview的layer屬性可以訪問這個層。當uiview需要顯示到螢幕上時,會呼叫drawrect:方法進行繪圖,並且會將所有內容繪製在自己的層上,繪圖完畢後,系統會將層拷貝到螢幕上,於是就完成了uiview的顯示。

一、calayer的簡單使用

1、直接建立圖層顯示到螢幕上

calayer *mylayer = [calayer layer];

mylayer.bounds = cgrectmake(0, 0, 100, 100);

mylayer.position = cgpointzero;

mylayer.backgroundcolor = [uicolor redcolor].cgcolor

;mylayer.anchorpoint = cgpointmake(0, 0);//錨點的位置

2、還可以建立顯示的圖層

二、calayer的屬性以uiview為例:

self.testview

.layer

.borderwidth = 5.0

; //設定邊框的寬度

self.testview

.layer

.bordercolor = [uicolor redcolor].cgcolor

; //設定邊框的顏色

self.testview

.layer

.cornerradius = 10.0

; //設定view的圓角

self.testview

.layer

.shadowcolor = [uicolor graycolor].cgcolor

; //設定陰影的背景色

self.testview

.layer

.shadowoffset = cgsizemake(10, 10); //設定陰影 width<0 左,width>0 右, height<0 上, height>0 下

self.testview

.layer

.shadowopacity = 1

; //設定陰影的不透明度 預設0

.layer

.maskstobounds = no; //裁剪超出試圖範圍的部分 (會把陰影部分裁剪掉)

設定的layer屬性時有點不同

self.testimageview

.layer

.borderwidth = 5.0

; //設定邊框的寬度

self.testimageview

.layer

.bordercolor = [uicolor greencolor].cgcolor

; //設定邊框的顏色

self.testimageview

.layer

.cornerradius = 10.0

;/*設定uiimageview的layer屬性 和uiview的基本一致。但是在設定圓角的時候,必須設定*/

self.testimageview

.layer

.maskstobounds = yes;

/*因為uiimageview是放在次層上的 而self.testimageview.layer.cornerradius = 5.0是設定根層上的圓角,所以必須把超出根層的試圖裁減掉,次層上的才會顯示圓角*/

/*****但是設定裁剪圓角後 陰影也會裁減掉****/

self.testimageview

.layer

.shadowcolor = [uicolor graycolor].cgcolor

; //設定陰影的背景色

self.testimageview

.layer

.shadowoffset = cgsizemake(10, 10);

self.testimageview

.layer

.shadowopacity = 1

; //設定陰影的不透明度 預設0

三、calayer的position(位置)和anchorpoint(錨點)屬性

//position可以用來設定calayer在父層中的位置,它是以父層的左上角為座標原點(0, 0)

@property

cgpoint position;

//anchorpoint稱為"定位點",**它決定著calayer身上的哪個點會在position屬性所指的位置**。它的x、y取值範圍都是0~1,預設值為(0.5, 0.5)

@property

cgpoint anchorpoint;

下面兩句**設定了mylayer的position為(100, 100),又因為anchorpoint預設是(0.5, 0.5),所以最後的效果是:mylayer的中點會在父層的(100, 100)位置。(看圖理解 「它決定著calayer身上的哪個點會在position屬性所指的位置」這句話)

// 設定層的寬度和高度(100x100)

mylayer.bounds = cgrectmake(0, 0, 100, 100);

// 設定層的位置

四、calayer平移、旋轉、縮放1、二位平移、旋轉、縮放

//二維縮放 寬1.5倍 高0.5倍  <0反過來

self

.testimageview.transform = cgaffinetransformmakescale(-

1.5, 0.5);

//二維旋轉 >0順時針

self

.testimageview.transform = cgaffinetransformmakerotation(-m_pi_4);

//二維平移 tx<0 左,tx>0 右, ty<0 上, ty>0 下

self

.testimageview.transform = cgaffinetransformmaketranslation(50, -

50);

2、三維平移、旋轉、縮放

//三維旋轉  會沿著(0,0,0)->(tx,ty,tz)這條向量軸進行旋轉乙個角度

三維旋轉也可以達到二維旋轉的效果,即繞著z軸旋轉catransform3dmakerotation(m_pi_4, 0, 0, 1)

//三維縮放 tx:長 ty:寬 tz:高  和二維縮放一樣<0時反向縮放

testimageview.layer.transform = catransform3dmakescale(-1.2, -0.5, 0);

//三維平移 tx:延x軸方向平移》0時向右平移 <0時向左平移 ty、tz和tx類似

testimageview.layer.transform = catransform3dmaketranslation(100, 100, 0);

1、當uiview需要顯示時,view.layer會準備乙個uigraphicsgetcurrentcontext() (圖層型別的上下文);

2、呼叫view.layer.delegate的**方法 drawlayer:incontext: 並傳入剛剛準備好的圖層上下文;

3、view的drawlayer:incontext:方法又會呼叫view的drawrect:方法;

4、view就可以在drawrect:中實現繪圖**,所有東西最終都會繪製到view.layer上;

5、最後系統將view.layer上的圖拷貝到螢幕上完成uiview的顯示。

核心動畫CALayer

1.我們來簡單了解一下calayer的基本概念 calayer是核心動畫的基礎,可以做圓角 陰影 邊框等效果 每個uiview內部都有乙個layer的屬性 uiview可以響應事件,而calayer只負責顯示 在實現核心動畫時,本質上是將calayer中的內容轉換成位圖,從而便於圖形硬體的 操縱 2...

IOS開發核心動畫篇 核心動畫簡介

ios開發ui篇 核心動畫簡介 一 簡單介紹 core animation,中文翻譯為核心動畫,它是一組非常強大的動畫處理api,使用它能做出非常炫麗的動畫效果,而且往往是事半功倍。也就是說,使用少量的 就可以實現非常強大的功能。core animation是跨平台的,可以用在mac os x和io...

iOS核心動畫之CALayer 自定義層

本文目錄 自定義層,其實就是在層上繪圖,一共有2種方法,下面詳細介紹一下。回到頂部 方法描述 建立乙個calayer的子類,然後覆蓋drawincontext 方法,使用quartz2d api進行繪圖 pragma mark 繪製乙個實心三角形 4 void drawincontext cgcon...