核心動畫二

6> CoreAnimation

  • Core Animation是直接作用在CALayer上的,并非UIView弦讽。
    Core Animation忙芒,中文翻譯為核心動畫,它是一組非常強(qiáng)大的動畫處理API供屉,使用它能做出非常炫麗的動畫效果行冰,而且往往是事半功倍。也就是說伶丐,使用少量的代碼就可以實(shí)現(xiàn)非常強(qiáng)大的功能悼做。
    Core Animation可以用在Mac OS X和iOS平臺。
    Core Animation的動畫執(zhí)行過程都是在后臺操作的撵割,不會阻塞主線程贿堰。
    要注意的是,Core Animation是直接作用在CALayer上的啡彬,并非UIView羹与。
  • Core Animation結(jié)構(gòu)
  • Core Animation 使用步驟
    如果不是xcode5之后的版本,使用它需要先添加QuartzCore.framework和引入對應(yīng)的框架<QuartzCore/QuartzCore.h>
    開發(fā)步驟:
    1.首先得有CALayer
    2.初始化一個(gè)CAAnimation對象庶灿,并設(shè)置一些動畫相關(guān)屬性
    3.通過調(diào)用CALayer的addAnimation:forKey:方法纵搁,增加CAAnimation對象到CALayer中,這樣就能開始執(zhí)行動畫了
    4.通過調(diào)用CALayer的removeAnimationForKey:方法可以停止CALayer中的動畫
  • 創(chuàng)建CALayer
  • touchBegin,點(diǎn)擊屏幕往踢,做動畫
  • 創(chuàng)建動畫腾誉,添加動畫到CALayer
  • 怎樣執(zhí)行動畫?執(zhí)行動畫的本質(zhì)是改變圖層的屬性。
  • 告訴動畫執(zhí)行怎樣的動畫?設(shè)置動畫屬性(position)
  • 告訴動畫屬性怎么改變?設(shè)置動畫屬性值改變 toValue fromValue
  • duration:動畫時(shí)長
  • 動畫有反彈?取消反彈
    1> 執(zhí)行動畫完畢不要移除
    2> 設(shè)置動畫填充模式利职,保持最新的位置趣效。
  • rotation:
    三維旋轉(zhuǎn):transform
    二維旋轉(zhuǎn):transform.rotation
  • scale
  • 設(shè)置圖層內(nèi)容(心)
  • tovalue:@0.5
    //創(chuàng)建動畫對象
    CABasicAnimation *anim = [CABasicAnimation animation];
    //設(shè)置屬性值.
    anim.keyPath = @"transform.rotation";
    anim.toValue = @(M_PI);
    //動畫完成時(shí)會自動的刪除動畫.
    //動畫完成時(shí)要不要?jiǎng)h除動畫
    anim.removedOnCompletion = NO;
    //讓動畫始終保存最前面的效果.
    anim.fillMode = @"forwards" 
    //添加動畫
    [self.redView.layer addAnimation:anim forKey:nil];
-(void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event{
  //添加動畫
    CABasicAnimation *anim = [CABasicAnimation animation];
    //設(shè)置屬性值.
    anim.keyPath = @"transform.scale";
    anim.toValue = @0;
  //想要?jiǎng)赢媹?zhí)行多次
    anim.repeatCount = MAXFLOAT;
 //設(shè)置動畫的執(zhí)行時(shí)長
    anim.duration = 0.5;
  //反轉(zhuǎn),怎么去的,怎么樣回來.
    anim.autoreverses = YES;
//添加動畫
    [self.imageV.layer addAnimation:anim forKey:nil];    
}
    //創(chuàng)建動畫對象
    CABasicAnimation *anim = [CABasicAnimation animation];
    //設(shè)置屬性值.
    anim.keyPath = @"transform.rotation";
    anim.toValue = @(M_PI);
    //動畫完成時(shí)會自動的刪除動畫.
    //動畫完成時(shí)要不要?jiǎng)h除動畫
    anim.removedOnCompletion = NO;
  //讓動畫始終保存最前面的效果.
    anim.fillMode = @"forwards";
   //添加動畫
    [self.redView.layer addAnimation:anim forKey:nil];
* 總結(jié)CABasicAnimation只能在兩個(gè)值之間做動畫,怎么多個(gè)值做動畫猪贪,用CAKeyframeAnimation

7> CAKeyframeAnimation

  • 面向view開發(fā)跷敬,拖一個(gè)view
  • values:能多個(gè)值之間做動畫,按照順序做热押。
  //添加抖動的動畫.
    CAKeyframeAnimation *anim = [CAKeyframeAnimation animation];
    //設(shè)置屬性值.
    anim.keyPath = @"transform.rotation";
    anim.values = @[@(angle2Rad(-5)),@(angle2Rad(5))];
   anim.autoreverses = YES;
   //動畫一直重復(fù)執(zhí)行.
    anim.repeatCount = MAXFLOAT;
 anim.duration = 0.5;
 //添加動畫
    [self.iconView.layer addAnimation:anim forKey:nil];
  • path
   //添加抖動的動畫.
    CAKeyframeAnimation *anim = [CAKeyframeAnimation animation];
    //設(shè)置屬性值.
    anim.keyPath = @"position";
    
  //根據(jù)路徑做動畫
//    UIBezierPath *path = [UIBezierPath bezierPath];
//    [path moveToPoint:CGPointMake(50, 50)];
//    [path addLineToPoint:CGPointMake(200, 400)];
    UIBezierPath *path = [UIBezierPath bezierPathWithOvalInRect:CGRectMake(50, 50, 300, 300)];
    anim.path = path.CGPath;    
//    anim.autoreverses = YES;
    //動畫一直重復(fù)執(zhí)行.
    anim.repeatCount = MAXFLOAT;
  anim.duration = 0.5;
  //添加動畫
    [self.iconView.layer addAnimation:anim forKey:nil];
  • 動畫節(jié)奏(timingFunction)

8> * 圖標(biāo)抖動

  • PPT分析,左邊旋轉(zhuǎn)右邊旋轉(zhuǎn) -> keyPath(transform.rotation) -> values -> 有點(diǎn)瘸 -> PPT分析 -> values添加一個(gè)值

9> * CATransition
過度動畫又叫轉(zhuǎn)場動畫 -> type(轉(zhuǎn)場類型) -> subtype(方向) -> 動畫進(jìn)度
注意:轉(zhuǎn)場動畫必須和過度代碼放在一塊西傀,否則沒有效果

static int _i = 1;
   //轉(zhuǎn)場代碼必須得要和轉(zhuǎn)場動畫在同一個(gè)方法當(dāng)中.,并沒有要求他們的上下順序.
    //轉(zhuǎn)場代碼.
    _i++;
    if (_i > 3) {
        _i = 1;
    }
    NSString *imageName = [NSString stringWithFormat:@"%d",_i];
    self.imageV.image = [UIImage imageNamed:imageName];  
    //添加轉(zhuǎn)場動畫
    CATransition *anim = [CATransition animation]; 
    anim.duration = 1;
    //動畫從哪個(gè)點(diǎn)開始.
    anim.startProgress = 0.3;
    //動畫從哪個(gè)點(diǎn)結(jié)束.
    anim.endProgress = 0.5;  
    //轉(zhuǎn)場類型.
    anim.type = @"pageCurl";  
    [self.imageV.layer addAnimation:anim forKey:nil];

10> * CAAnimationGroup
同時(shí)進(jìn)行多種動畫 -> 平移,旋轉(zhuǎn)桶癣,縮放 -> 取消反彈

-(void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event{ 
    CAAnimationGroup *animGroup = [CAAnimationGroup animation];
    //animations數(shù)組當(dāng)中存入的都是animation對象
    //平移
    CABasicAnimation *anim = [CABasicAnimation animation];
    anim.keyPath = @"position.y";
    anim.toValue = @(400); 
    //縮放
    CABasicAnimation *anim2 = [CABasicAnimation animation];
    anim2.keyPath = @"transform.scale";
    anim2.toValue = @(0.5);
    //會自動執(zhí)行數(shù)組當(dāng)中所有的動畫對象.
    animGroup.animations = @[anim,anim2];
    //動畫完成不要?jiǎng)h除動畫
    animGroup.removedOnCompletion = NO;
    //始終保持最前面的效果
    animGroup.fillMode = kCAFillModeForwards;
    [self.redView.layer addAnimation:animGroup forKey:nil];   
}

11> * UIView封裝的動畫
單視圖

+ (void)transitionWithView:(UIView *)view duration:(NSTimeInterval)duration options:(UIViewAnimationOptions)options animations:(void (^)(void))animations completion:(void (^)(BOOL finished))completion;

參數(shù)說明:
duration:動畫的持續(xù)時(shí)間
view:需要進(jìn)行轉(zhuǎn)場動畫的視圖
options:轉(zhuǎn)場動畫的類型
animations:將改變視圖屬性的代碼放在這個(gè)block中
completion:動畫結(jié)束后拥褂,會自動調(diào)用這個(gè)block
雙視圖
+ (void)transitionFromView:(UIView *)fromView toView:(UIView *)toView duration:(NSTimeInterval)duration options:(UIViewAnimationOptions)options completion:(void (^)(BOOL finished))completion;

參數(shù)說明:
duration:動畫的持續(xù)時(shí)間
options:轉(zhuǎn)場動畫的類型
animations:將改變視圖屬性的代碼放在這個(gè)block中
completion:動畫結(jié)束后,會自動調(diào)用這個(gè)block
* 什么時(shí)候用核心動畫牙寞,什么時(shí)候用UIView動畫
* 核心動畫的缺點(diǎn):都是假象饺鹃,不能真正改變圖層屬性的值
* 展示和真實(shí)的位置不同
* 如果改變位置就用UIView的動畫
* 轉(zhuǎn)場動畫就用核心動畫
* 為什么轉(zhuǎn)場用核心動畫?因?yàn)閁IView的轉(zhuǎn)場動畫太少碎税。
* 演示UIView的轉(zhuǎn)場動畫
* touchBegin,切換圖片

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末尤慰,一起剝皮案震驚了整個(gè)濱河市,隨后出現(xiàn)的幾起案子雷蹂,更是在濱河造成了極大的恐慌伟端,老刑警劉巖,帶你破解...
    沈念sama閱讀 216,544評論 6 501
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件匪煌,死亡現(xiàn)場離奇詭異责蝠,居然都是意外死亡,警方通過查閱死者的電腦和手機(jī)萎庭,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 92,430評論 3 392
  • 文/潘曉璐 我一進(jìn)店門霜医,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人驳规,你說我怎么就攤上這事肴敛。” “怎么了吗购?”我有些...
    開封第一講書人閱讀 162,764評論 0 353
  • 文/不壞的土叔 我叫張陵医男,是天一觀的道長。 經(jīng)常有香客問我捻勉,道長镀梭,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 58,193評論 1 292
  • 正文 為了忘掉前任踱启,我火速辦了婚禮报账,結(jié)果婚禮上研底,老公的妹妹穿的比我還像新娘。我一直安慰自己透罢,他們只是感情好榜晦,可當(dāng)我...
    茶點(diǎn)故事閱讀 67,216評論 6 388
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著琐凭,像睡著了一般芽隆。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上统屈,一...
    開封第一講書人閱讀 51,182評論 1 299
  • 那天,我揣著相機(jī)與錄音牙躺,去河邊找鬼愁憔。 笑死,一個(gè)胖子當(dāng)著我的面吹牛孽拷,可吹牛的內(nèi)容都是我干的吨掌。 我是一名探鬼主播,決...
    沈念sama閱讀 40,063評論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼脓恕,長吁一口氣:“原來是場噩夢啊……” “哼膜宋!你這毒婦竟也來了?” 一聲冷哼從身側(cè)響起炼幔,我...
    開封第一講書人閱讀 38,917評論 0 274
  • 序言:老撾萬榮一對情侶失蹤秋茫,失蹤者是張志新(化名)和其女友劉穎,沒想到半個(gè)月后乃秀,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體肛著,經(jīng)...
    沈念sama閱讀 45,329評論 1 310
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 37,543評論 2 332
  • 正文 我和宋清朗相戀三年跺讯,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了枢贿。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點(diǎn)故事閱讀 39,722評論 1 348
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡刀脏,死狀恐怖局荚,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情愈污,我是刑警寧澤耀态,帶...
    沈念sama閱讀 35,425評論 5 343
  • 正文 年R本政府宣布,位于F島的核電站钙畔,受9級特大地震影響茫陆,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜擎析,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 41,019評論 3 326
  • 文/蒙蒙 一簿盅、第九天 我趴在偏房一處隱蔽的房頂上張望挥下。 院中可真熱鬧,春花似錦桨醋、人聲如沸棚瘟。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,671評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽偎蘸。三九已至,卻和暖如春瞬内,著一層夾襖步出監(jiān)牢的瞬間迷雪,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 32,825評論 1 269
  • 我被黑心中介騙來泰國打工虫蝶, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留章咧,地道東北人。 一個(gè)月前我還...
    沈念sama閱讀 47,729評論 2 368
  • 正文 我出身青樓能真,卻偏偏與公主長得像赁严,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個(gè)殘疾皇子粉铐,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 44,614評論 2 353

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

  • 在iOS實(shí)際開發(fā)中常用的動畫無非是以下四種:UIView動畫疼约,核心動畫,幀動畫蝙泼,自定義轉(zhuǎn)場動畫程剥。 1.UIView...
    請叫我周小帥閱讀 3,092評論 1 23
  • Core Animation Core Animation,中文翻譯為核心動畫踱承,它是一組非常強(qiáng)大的動畫處理API倡缠,...
    45b645c5912e閱讀 3,027評論 0 21
  • 在iOS中隨處都可以看到絢麗的動畫效果,實(shí)現(xiàn)這些動畫的過程并不復(fù)雜茎活,今天將帶大家一窺ios動畫全貌昙沦。在這里你可以看...
    每天刷兩次牙閱讀 8,485評論 6 30
  • 在iOS中隨處都可以看到絢麗的動畫效果,實(shí)現(xiàn)這些動畫的過程并不復(fù)雜载荔,今天將帶大家一窺iOS動畫全貌盾饮。在這里你可以看...
    F麥子閱讀 5,110評論 5 13
  • 本文轉(zhuǎn)載自:http://www.cocoachina.com/ios/20150105/10812.html 為...
    idiot_lin閱讀 1,255評論 0 1