什么是CALayer
- 在iOS中,你能看得見(jiàn)摸得著的東西基本上都是UIView,比如一個(gè)按鈕未斑、一個(gè)文本標(biāo)簽驹马、 一個(gè)文本輸入框奄抽、一個(gè)圖標(biāo)等等,這些都是UIView
- 其實(shí)UIView之所以能顯示在屏幕上,完全是因?yàn)樗鼉?nèi)部的一個(gè)圖層
- 在創(chuàng)建UIView對(duì)象時(shí),UIView內(nèi)部會(huì)自動(dòng)創(chuàng)建一個(gè)圖層(即CALayer對(duì)象),通過(guò)UIView
的layer屬性可以訪問(wèn)這個(gè)層 @property(nonatomic,readonly,retain) CALayer *layer; - 當(dāng)UIView需要顯示到屏幕上時(shí),會(huì)調(diào)用drawRect:方法進(jìn)行繪圖,并且會(huì)將所有內(nèi)容繪制在 自己的圖層上,繪圖完畢后,系統(tǒng)會(huì)將圖層拷貝到屏幕上,于是就完成了UIView的顯示
- 換句話說(shuō),UIView本身不具備顯示的功能,是它內(nèi)部的層才有顯示功能
View的主層和UIImageView content層
- 每個(gè)控件都有主層邊框氢橙，我們對(duì)CALayer的操作其實(shí)是對(duì)主層的操作检诗，但是UIImageView比較特殊它是顯示圖片的匈仗，它有一個(gè)單獨(dú)的層content
demo
UIView和CALayer的區(qū)別
對(duì)比CALayer，UIView多了個(gè)一個(gè)事件處理的功能逢慌。也就是悠轩，CALayer不能處理用戶的觸摸事件，但是UIView可以
UIView可以通過(guò)subviews屬性訪問(wèn)所有的子視圖攻泼，類(lèi)似地火架，CALayer也可以通過(guò)sublayers屬性訪問(wèn)所有的子層
UIView可以通過(guò)superview屬性訪問(wèn)父視圖鉴象，類(lèi)似地，CALayer也可以通過(guò)superlayer屬性訪問(wèn)父層
CALayer和QuartzCore的區(qū)別
CALayer是地應(yīng)在QuartzCore框架中的
CGImageRef距潘、CGColorRef兩種數(shù)據(jù)類(lèi)型是定義在CoreGraphics框架中的
UIColor炼列、UIImage是定義在UIKit框架中的
其次QuartzCore框架和CoreGraphics可以跨平臺(tái)使用，在iOS和 Mac OS上都能使用
UIKit只限在iOS中使用
position和anchorPoint
CALayer 有兩個(gè)非常關(guān)鍵的屬性position和anchorPoin
position可以用來(lái)設(shè)置CALayer在父層中的位置音比，它是以父層的左上角為坐標(biāo)原點(diǎn)(0, 0)
anchorPoint稱(chēng)為"定位點(diǎn),錨點(diǎn)"俭尖，它決定著CALayer身上的哪個(gè)點(diǎn)會(huì)在position屬性所指的位置。它的x洞翩、y取值范圍都是0~1稽犁，默認(rèn)值為(0.5, 0.5)
position和anchorPoint屬性都是CGPoint類(lèi)型的
anchorPoint(示意圖)
anchorPoint是（0.5，0.5)
anchorPoint是(1, 1)
anchorPoint是(0.5,0)
anchorPoint是(1,0.5
position和anchorPoint
position和anchorPoint 紅色圖層的anchorPoint是（0.5骚亿，0.5）
position和anchorPoint 紅色圖層的anchorPoint是（0.5已亥，0）
position和anchorPoint 紅色圖層的anchorPoint是（0，0）
position和anchorPoint 紅色圖層的anchorPoint是（1来屠，0.5）
position和anchorPoint 紅色圖層的anchorPoint是（1虑椎，1）
隱式動(dòng)畫(huà)
每一個(gè)UIView內(nèi)部都默認(rèn)關(guān)聯(lián)著一個(gè)CALayer，這個(gè)Layer可以成為Root Layer(根層)俱笛。所有非Root Layer捆姜，也就是手動(dòng)創(chuàng)建的CALayer對(duì)象。
當(dāng)對(duì)非Root Layer的部分屬性進(jìn)行相應(yīng)的修改時(shí)迎膜，默認(rèn)會(huì)自動(dòng)產(chǎn)生一些動(dòng)畫(huà)效果泥技，這些屬性稱(chēng)為Animatable Properties(可動(dòng)畫(huà)屬性)。
隱式動(dòng)畫(huà)demo
核心動(dòng)畫(huà)
- Core Animation磕仅，中文翻譯為核心動(dòng)畫(huà)珊豹，它是一組非常強(qiáng)大的動(dòng)畫(huà)處理API，使用它能做出非常炫麗的動(dòng)畫(huà)效果榕订，而且往往是事半功倍店茶。
- Core Animation可以用在Mac OS X和iOS平臺(tái)。
- Core Animation的動(dòng)畫(huà)執(zhí)行過(guò)程都是在后臺(tái)操作的劫恒，不會(huì)阻塞主線程贩幻。
-
要注意的是，Core Animation是直接作用在CALayer上的兼贸，并非UIView
核心動(dòng)畫(huà)架構(gòu) - 核心動(dòng)畫(huà)中所有類(lèi)都遵守CAMediaTiming
CAAnaimation是個(gè)抽象類(lèi)段直，不具備動(dòng)畫(huà)效果吃溅，必須用它的子類(lèi)才有動(dòng)畫(huà)效果
哪幾個(gè)子類(lèi)了溶诞，CAAnimationGroup和CATransition才有動(dòng)畫(huà)效果，CAAnimationGroup是個(gè)動(dòng)畫(huà)組决侈，可以同時(shí)進(jìn)行縮放螺垢，旋轉(zhuǎn)喧务。CATransition是轉(zhuǎn)場(chǎng)動(dòng)畫(huà)，界面之間跳轉(zhuǎn)都可以用轉(zhuǎn)場(chǎng)動(dòng)畫(huà)枉圃。
CAPropertyAnimation也是個(gè)抽象類(lèi)功茴，本身不具備動(dòng)畫(huà)效果，只有子類(lèi)才有
哪兩個(gè)子類(lèi)了孽亲，CABasicAnimation和CAKeyframeAnimation
CABasicAnimation基本動(dòng)畫(huà)坎穿，做一些簡(jiǎn)單效果
CAKeyframeAnimation幀動(dòng)畫(huà)，做一些連續(xù)的流暢的動(dòng)畫(huà)
CAAnimation 簡(jiǎn)介
- 基本屬性介紹
- CAAnimation 是所有動(dòng)畫(huà)對(duì)象的父類(lèi),負(fù)責(zé)控制動(dòng)畫(huà)的持續(xù)時(shí)間和速度,是個(gè)抽象類(lèi),不能直接使
用,應(yīng)該使用它具體的子類(lèi) - 屬性說(shuō)明:(紅色代表來(lái)自CAMediaTiming協(xié)議的屬性)
- duration:動(dòng)畫(huà)的持續(xù)時(shí)間
- repeatCount:重復(fù)次數(shù),無(wú)限循環(huán)可以設(shè)置HUGE_VALF或者M(jìn)AXFLOAT
- repeatDuration:重復(fù)時(shí)間
- removedOnCompletion:默認(rèn)為YES,代表動(dòng)畫(huà)執(zhí)行完畢后就從圖層上移除,圖形會(huì) 恢復(fù)到動(dòng)畫(huà)執(zhí)行前的狀態(tài)返劲。如果想讓圖層保持顯示動(dòng)畫(huà)執(zhí)行后的狀態(tài),那就設(shè)置 為NO,不過(guò)還要設(shè)置fillMode為kCAFillModeForwards
- fillMode:決定當(dāng)前對(duì)象在非active時(shí)間段的行為玲昧。比如動(dòng)畫(huà)開(kāi)始之前或者動(dòng)畫(huà)結(jié)束 之后
- beginTime:可以用來(lái)設(shè)置動(dòng)畫(huà)延遲執(zhí)行時(shí)間,若想延遲2s,就設(shè)置 為CACurrentMediaTime()+2,CACurrentMediaTime()為圖層的當(dāng)前時(shí)間
- timingFunction:速度控制函數(shù),控制動(dòng)畫(huà)運(yùn)行的節(jié)奏
- delegate:動(dòng)畫(huà)代理 核心動(dòng)畫(huà)的代理比較特殊，不用遵守代理的協(xié)議篮绿。
- 動(dòng)畫(huà)填充模式
- fillMode屬性值(要想fillMode有效,最好設(shè)置
- removedOnCompletion = NO) kCAFillModeRemoved 這個(gè)是默認(rèn)值,也就是說(shuō)當(dāng)動(dòng)畫(huà)開(kāi)始前和動(dòng)畫(huà)結(jié)束后,動(dòng)畫(huà)對(duì)
layer都沒(méi)有影響,動(dòng)畫(huà)結(jié)束后,layer會(huì)恢復(fù)到之前的狀態(tài)
kCAFillModeForwards 當(dāng)動(dòng)畫(huà)結(jié)束后,layer會(huì)一直保持著動(dòng)畫(huà)最后的狀態(tài) - kCAFillModeBackwards 在動(dòng)畫(huà)開(kāi)始前,只需要將動(dòng)畫(huà)加入了一個(gè)layer,layer便立即進(jìn) 入動(dòng)畫(huà)的初始狀態(tài)并等待動(dòng)畫(huà)開(kāi)始孵延。
- kCAFillModeBoth 這個(gè)其實(shí)就是上面兩個(gè)的合成.動(dòng)畫(huà)加入后開(kāi)始之前,layer便處于動(dòng) 畫(huà)初始狀態(tài),動(dòng)畫(huà)結(jié)束后layer保持動(dòng)畫(huà)最后的狀態(tài)
CAPropertyAnimation
- CAPropertyAnimation是CAAnimation的子類(lèi)，也是個(gè)抽象類(lèi)亲配，要想創(chuàng)建動(dòng)畫(huà)對(duì)象尘应，應(yīng)該使用它的兩個(gè)子類(lèi)：
- CABasicAnimation
- CAKeyframeAnimation
- 屬性說(shuō)明：
- keyPath：通過(guò)指定CALayer的一個(gè)屬性名稱(chēng)為keyPath（NSString類(lèi)型），并且對(duì)CALayer的這個(gè)屬性的值進(jìn)行修改吼虎，達(dá)到相應(yīng)的動(dòng)畫(huà)效果犬钢。比如，指定@“position”為keyPath鲸睛，就修改CALayer的position屬性的值娜饵，以達(dá)到平移的動(dòng)畫(huà)效果
- keyPath的常用形變值:
- transform.rotation :旋轉(zhuǎn)
- transform.scale :按比例縮放
- transform.translation :平移
- 以上形變的值x.y.z都可以單獨(dú)設(shè)置，并且toValue可以放數(shù)組官辈，比如平移需要多個(gè)參數(shù)可以直接丟個(gè)數(shù)組進(jìn)去
- CABasicAnimation實(shí)例
CABasicAnimation *anim = [CABasicAnimation animation];
//描述修改哪個(gè)屬性產(chǎn)生的動(dòng)畫(huà)
anim.keyPath = @"transform.scale";
//設(shè)置屬性的值
anim.toValue = @.4;
// 設(shè)置動(dòng)畫(huà)完成的時(shí)候不要移除動(dòng)畫(huà)
anim.removedOnCompletion = NO;
// 設(shè)置動(dòng)畫(huà)執(zhí)行完成要保持最新的效果
anim.fillMode = kCAFillModeForwards;
//添加動(dòng)畫(huà)到layer上
[self.yellowView.layer addAnimation:anim forKey:nil];
- CAKeyframeAnimation 實(shí)例
#define angle2Radion(angle) (angle / 180.0 * M_PI)
CAKeyframeAnimation *anim = [CAKeyframeAnimation animation];
anim.keyPath = @"transform.rotation";
anim.values = @[@(angle2Radion(-5)),@(angle2Radion(5)),@(angle2Radion(-5))];
anim.duration = 0.5;
anim.repeatCount = MAXFLOAT;
[self.grayView.layer addAnimation:anim forKey:nil];
```
- CATransition轉(zhuǎn)場(chǎng)動(dòng)畫(huà) 實(shí)例
> ● CATransition是CAAnimation的子類(lèi),用于做轉(zhuǎn)場(chǎng)動(dòng)畫(huà),能夠?yàn)閷犹峁?移出屏幕和移入屏幕的動(dòng)畫(huà)效果箱舞。iOS比Mac OS X的轉(zhuǎn)場(chǎng)動(dòng)畫(huà)效果少 一點(diǎn)
● UINavigationController就是通過(guò)CATransition實(shí)現(xiàn)了將控制器的視圖推 入屏幕的動(dòng)畫(huà)效果
● 動(dòng)畫(huà)屬性:
● type:動(dòng)畫(huà)過(guò)渡類(lèi)型
● subtype:動(dòng)畫(huà)過(guò)渡方向
● startProgress:動(dòng)畫(huà)起點(diǎn)(在整體動(dòng)畫(huà)的百分比)
● endProgress:動(dòng)畫(huà)終點(diǎn)(在整體動(dòng)畫(huà)的百分比)
[轉(zhuǎn)場(chǎng)動(dòng)畫(huà)demo](https://github.com/liuxingchen930831/UI-19-CATransition)
###CAAnimationGroup 這個(gè)核心動(dòng)畫(huà)的作用可以把 多個(gè)動(dòng)畫(huà)組成一個(gè)組，可以做到多個(gè)動(dòng)畫(huà)一同執(zhí)行
##UIView動(dòng)畫(huà)和核心動(dòng)畫(huà)的區(qū)別
- 除了上面說(shuō)到的UIView可以處理用戶交互 核心動(dòng)畫(huà)不可以處理交互以外拳亿，還有就是UIView的動(dòng)畫(huà)效果都是對(duì)控件做真實(shí)操作晴股，但是核心動(dòng)畫(huà)只是視覺(jué)效果，具體的值并沒(méi)有改變肺魁。
- 核心動(dòng)畫(huà)一般用于轉(zhuǎn)場(chǎng)動(dòng)畫(huà)
[demo](https://github.com/liuxingchen930831/UI-19-UIViewAndCAAnimation)
[常用的animationWithKeyPath值的總結(jié)和動(dòng)畫(huà)的屬性和說(shuō)明](http://www.reibang.com/p/02c341c748f9)