CoreAnimtion 基礎(chǔ)

CoreAnimation是一組非常強(qiáng)大 的API症昏,它可以做出來非常絢麗的動(dòng)畫效果卵蛉,前邊介紹了 CoreAnimation 的核心組件CALayer麸拄;

CAAnimation簡(jiǎn)介:是所有動(dòng)畫對(duì)象的父類氛悬,負(fù)責(zé)控制動(dòng)畫的持續(xù)時(shí)間和速度,是個(gè)抽象類粗悯,不能直接使用虚循,應(yīng)該使用它具體的子類;

常用的屬性:

屬性說明:(紅色代表來自CAMediaTiming協(xié)議的屬性)

duration:動(dòng)畫的持續(xù)時(shí)間

repeatCount:重復(fù)次數(shù),無限循環(huán)可以設(shè)置HUGE_VALF或者M(jìn)AXFLOAT

repeatDuration:重復(fù)時(shí)間

removedOnCompletion:默認(rèn)為YES横缔,代表動(dòng)畫執(zhí)行完畢后就從圖層上移除铺遂,圖形會(huì)恢復(fù)到動(dòng)畫執(zhí)行前的狀態(tài)。如果想讓圖層保持顯示動(dòng)畫執(zhí)行后的狀態(tài)茎刚,那就設(shè)置為NO襟锐,不過還要設(shè)置fillMode為kCAFillModeForwards

fillMode:決定當(dāng)前對(duì)象在非active時(shí)間段的行為。比如動(dòng)畫開始之前或者動(dòng)畫結(jié)束之后

beginTime:可以用來設(shè)置動(dòng)畫延遲執(zhí)行時(shí)間膛锭,若想延遲2s粮坞,就設(shè)置為CACurrentMediaTime()+2,CACurrentMediaTime()為圖層的當(dāng)前時(shí)間

timingFunction:速度控制函數(shù)初狰,控制動(dòng)畫運(yùn)行的節(jié)奏

delegate:動(dòng)畫代理

話不多說莫杈,上代碼:

// 1. 初始化動(dòng)畫對(duì)象? 基本動(dòng)畫

CABasicAnimation *anim = [CABasicAnimation animationWithKeyPath:@"position"];

// 設(shè)置代理

anim.delegate = self;

// 2. 設(shè)置動(dòng)畫屬性

[anim setToValue:[NSValue valueWithCGPoint:toValue]];

[anim setDuration:1.0f];

// 4. 添加動(dòng)畫到圖層

[self.myView.layer addAnimation:anim forKey:nil];


點(diǎn)擊屏幕,動(dòng)畫執(zhí)行完成奢入,后又返回初始位置筝闹,怎么能讓動(dòng)畫停留在最后點(diǎn)擊位置呢? 這時(shí)候 ? ? fillMode ? ?跟 removedOnCompletion ?就派上用場(chǎng)了;

anim.fillMode = kCAFillModeForwards; //逐漸逼近目標(biāo)點(diǎn)

?anim.removedOnCompletion = NO;

fillMode屬性值(要想fillMode有效腥光,最好設(shè)置removedOnCompletion = NO)

kCAFillModeRemoved 這個(gè)是默認(rèn)值关顷,也就是說當(dāng)動(dòng)畫開始前和動(dòng)畫結(jié)束后,動(dòng)畫對(duì)layer都沒有影響柴我,動(dòng)畫結(jié)束后解寝,layer會(huì)恢復(fù)到之前的狀態(tài)

kCAFillModeForwards 當(dāng)動(dòng)畫結(jié)束后扩然,layer會(huì)一直保持著動(dòng)畫最后的狀態(tài)

kCAFillModeBackwards 在動(dòng)畫開始前艘儒,只需要將動(dòng)畫加入了一個(gè)layer,layer便立即進(jìn)入動(dòng)畫的初始狀態(tài)并等待動(dòng)畫開始夫偶。

kCAFillModeBoth 這個(gè)其實(shí)就是上面兩個(gè)的合成.動(dòng)畫加入后開始之前界睁,layer便處于動(dòng)畫初始狀態(tài),動(dòng)畫結(jié)束后layer保持動(dòng)畫最后的狀態(tài)

設(shè)置完之后兵拢,在運(yùn)行翻斟,發(fā)現(xiàn)myView可以停留在手指點(diǎn)擊后的位置了。? 但是 很奇怪说铃,? view的Frame沒有任何變化? 访惜,可以用

?NSLog(@"%@",NSStringFromCGRect(self.myView.frame)); ?

在動(dòng)畫結(jié)束后,打印view的Frame觀察

想要解決這個(gè)問題腻扇,可以使用setValue:forKey:傳值

[anim setValue:[NSValue valueWithCGPoint:toValue] forKey:@"targetPoint1"];

[anim setValue:@"translationTo" forKey:@"animationType"];

然后在- (void)animationDidStop:(CAAnimation *)anim finished:(BOOL)flag 中設(shè)置 value的cener屬性债热,修改坐標(biāo)。

CGPoint targetPoint = [[anim valueForKey:@"targetPoint1"] CGPointValue];

NSLog(@"tragetPoint:%@",NSStringFromCGPoint(targetPoint));

完之后幼苛,在觀察view的frame窒篱, ?完美解決;

起始UIView幫我們封裝了CoreAnimation的基本動(dòng)畫, 使用起來也非常容易:

[UIView animateWithDuration:1.0f animations:^{

self.myView.center = location;

} completion:^(BOOL finished) {

NSLog(@"%@",NSStringFromCGRect(self.myView.frame));

}];

但是墙杯,只是封裝了一些基本動(dòng)畫配并,? 如果我們要實(shí)現(xiàn)比較復(fù)雜的動(dòng)畫(CAAnimationGroup),還是需要實(shí)現(xiàn)上面一坨代碼高镐。

縮放動(dòng)畫示例:

- (void)scaleAnim{

CABasicAnimation *anim = [CABasicAnimation animationWithKeyPath:@"transform.scale"];

anim.toValue = @0.5;

anim.duration = 0.5;

anim.autoreverses = YES;? //自動(dòng)翻轉(zhuǎn)

[self.myView.layer addAnimation:anim forKey:nil];

}

旋轉(zhuǎn)動(dòng)畫:

- (void)rotationAnim{

self.myView.layer.anchorPoint = CGPointMake(0.8, 0.8);

CABasicAnimation *anim = [CABasicAnimation animationWithKeyPath:@"transform.rotation.z"];

//不停地旋轉(zhuǎn)

anim.toValue = @(2 * M_PI);

anim.repeatCount = HUGE_VALF;

anim.duration = 0.5;

//對(duì)于循環(huán)播放的動(dòng)畫效果溉旋,一定要removedOnCompletion設(shè)置為 No

anim.removedOnCompletion = NO;

[self.myView.layer? addAnimation:anim forKey:@"rotationAnim"];

}

暫停動(dòng)畫:

- (void)pauseAnim{

//1. 取出當(dāng)前的動(dòng)畫時(shí)間,要暫停的時(shí)間? CoreAnimation absolute time

CFTimeInterval currentTime = [self.myView.layer convertTime:CACurrentMediaTime() fromLayer:nil];

//2. 將動(dòng)畫的運(yùn)行速度設(shè)置 == 0? ? ==》動(dòng)畫默認(rèn)的運(yùn)行速度是 1.0 /速度的比例

self.myView.layer.timeOffset = currentTime;

//3. 設(shè)置動(dòng)畫的時(shí)間偏移量? ? =》 讓動(dòng)畫定格在該時(shí)間點(diǎn)

self.myView.layer.speed = 0.0f;

}

恢復(fù)動(dòng)畫:

- (void)continueAnim{

//1. 將動(dòng)畫的時(shí)間偏移量作為暫停時(shí)的時(shí)間點(diǎn)

CFTimeInterval pauseTime = self.myView.layer.timeOffset;

//2. 根據(jù)媒體時(shí)間計(jì)算出準(zhǔn)確的啟動(dòng)動(dòng)畫時(shí)間? ,? 對(duì)之前的暫停動(dòng)畫時(shí)間進(jìn)行修正

CFTimeInterval beginTime = CACurrentMediaTime() - pauseTime;

//3. 設(shè)置圖層的開始動(dòng)畫時(shí)間

self.myView.layer.beginTime = beginTime;

//4. 將timeOffset清空

self.myView.layer.timeOffset = 0.0f;

self.myView.layer.speed = 1.0f;

}

在appdelegate中獲取controller的方法:

ViewController *viewController =? (ViewController *)[application.windows.firstObject rootViewController];

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末嫉髓,一起剝皮案震驚了整個(gè)濱河市低滩,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌岩喷,老刑警劉巖恕沫,帶你破解...
    沈念sama閱讀 206,378評(píng)論 6 481
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場(chǎng)離奇詭異纱意,居然都是意外死亡婶溯,警方通過查閱死者的電腦和手機(jī),發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 88,356評(píng)論 2 382
  • 文/潘曉璐 我一進(jìn)店門偷霉,熙熙樓的掌柜王于貴愁眉苦臉地迎上來迄委,“玉大人,你說我怎么就攤上這事类少⌒鹕恚” “怎么了?”我有些...
    開封第一講書人閱讀 152,702評(píng)論 0 342
  • 文/不壞的土叔 我叫張陵硫狞,是天一觀的道長(zhǎng)信轿。 經(jīng)常有香客問我,道長(zhǎng)残吩,這世上最難降的妖魔是什么财忽? 我笑而不...
    開封第一講書人閱讀 55,259評(píng)論 1 279
  • 正文 為了忘掉前任,我火速辦了婚禮泣侮,結(jié)果婚禮上即彪,老公的妹妹穿的比我還像新娘。我一直安慰自己活尊,他們只是感情好隶校,可當(dāng)我...
    茶點(diǎn)故事閱讀 64,263評(píng)論 5 371
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著蛹锰,像睡著了一般深胳。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上宁仔,一...
    開封第一講書人閱讀 49,036評(píng)論 1 285
  • 那天稠屠,我揣著相機(jī)與錄音峦睡,去河邊找鬼。 笑死权埠,一個(gè)胖子當(dāng)著我的面吹牛榨了,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播攘蔽,決...
    沈念sama閱讀 38,349評(píng)論 3 400
  • 文/蒼蘭香墨 我猛地睜開眼龙屉,長(zhǎng)吁一口氣:“原來是場(chǎng)噩夢(mèng)啊……” “哼!你這毒婦竟也來了满俗?” 一聲冷哼從身側(cè)響起转捕,我...
    開封第一講書人閱讀 36,979評(píng)論 0 259
  • 序言:老撾萬榮一對(duì)情侶失蹤,失蹤者是張志新(化名)和其女友劉穎唆垃,沒想到半個(gè)月后五芝,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 43,469評(píng)論 1 300
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡辕万,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 35,938評(píng)論 2 323
  • 正文 我和宋清朗相戀三年枢步,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片渐尿。...
    茶點(diǎn)故事閱讀 38,059評(píng)論 1 333
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡醉途,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出砖茸,到底是詐尸還是另有隱情隘擎,我是刑警寧澤,帶...
    沈念sama閱讀 33,703評(píng)論 4 323
  • 正文 年R本政府宣布凉夯,位于F島的核電站货葬,受9級(jí)特大地震影響,放射性物質(zhì)發(fā)生泄漏恍涂。R本人自食惡果不足惜宝惰,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 39,257評(píng)論 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望再沧。 院中可真熱鬧,春花似錦尊残、人聲如沸炒瘸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,262評(píng)論 0 19
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽顷扩。三九已至,卻和暖如春慰毅,著一層夾襖步出監(jiān)牢的瞬間隘截,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 31,485評(píng)論 1 262
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留婶芭,地道東北人东臀。 一個(gè)月前我還...
    沈念sama閱讀 45,501評(píng)論 2 354
  • 正文 我出身青樓,卻偏偏與公主長(zhǎng)得像犀农,于是被迫代替她去往敵國和親惰赋。 傳聞我的和親對(duì)象是個(gè)殘疾皇子,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 42,792評(píng)論 2 345

推薦閱讀更多精彩內(nèi)容

  • 在iOS實(shí)際開發(fā)中常用的動(dòng)畫無非是以下四種:UIView動(dòng)畫呵哨,核心動(dòng)畫赁濒,幀動(dòng)畫,自定義轉(zhuǎn)場(chǎng)動(dòng)畫孟害。 1.UIView...
    請(qǐng)叫我周小帥閱讀 3,078評(píng)論 1 23
  • Core Animation Core Animation拒炎,中文翻譯為核心動(dòng)畫,它是一組非常強(qiáng)大的動(dòng)畫處理API挨务,...
    45b645c5912e閱讀 3,015評(píng)論 0 21
  • 在iOS中隨處都可以看到絢麗的動(dòng)畫效果枝冀,實(shí)現(xiàn)這些動(dòng)畫的過程并不復(fù)雜,今天將帶大家一窺iOS動(dòng)畫全貌耘子。在這里你可以看...
    F麥子閱讀 5,094評(píng)論 5 13
  • 在iOS中隨處都可以看到絢麗的動(dòng)畫效果果漾,實(shí)現(xiàn)這些動(dòng)畫的過程并不復(fù)雜,今天將帶大家一窺ios動(dòng)畫全貌谷誓。在這里你可以看...
    每天刷兩次牙閱讀 8,465評(píng)論 6 30
  • IOS動(dòng)畫+轉(zhuǎn)場(chǎng)動(dòng)畫 #import "ViewController.h" #import "secondView...
    iOS小開發(fā)閱讀 902評(píng)論 0 1