Core Animation 核心动画

Core Animation 核心动画

Core Animation是一组非常强大的动画处理API,使用它能做出非常炫丽的动画效果,而且往往是事半功倍。也就是说,使用少量的代码就可以实现非常强大的功能。

Core Animation可以用在Mac OS X和iOS平台。

Core Animation的动画执行过程都是在后台操作的,不会阻塞主线程。

要注意的是,Core Animation是直接作用在CALayer上的,并非UIView

核心动画的继承结构如图

Core Animation的使用步骤

如果不是xcode5之后的版本,使用它需要先添加QuartzCore.framework和引入对应的框架

开发步骤:

1.首先得有CALayer

2.初始化一个CAAnimation对象,并设置一些动画相关属性

3.通过调用CALayer的addAnimation:forKey:方法,增加CAAnimation对象到CALayer中,这样就能开始执行动画了

4.通过调用CALayer的removeAnimationForKey:方法可以停止CALayer中的动画

CAAnimation

是所有动画对象的父类,负责控制动画的持续时间和速度,是个抽象类,不能直接使用,应该使用它具体的子类

属性说明:(代表来自CAMediaTiming协议的属性)

*duration*:动画的持续时间*repeatCount*:重复次数,无限循环可以设置HUGE_VALF或者MAXFLOAT*repeatDuration*:重复时间removedOnCompletion:默认为YES,代表动画执行完毕后就从图层上移除,图形会恢复到动画执行前的状态。如果想让图层保持显示动画执行后的状态,那就设置为NO,不过还要设置fillMode为kCAFillModeForwards*fillMode*:决定当前对象在非active时间段的行为。比如动画开始之前或者动画结束之后*beginTime*:可以用来设置动画延迟执行时间,若想延迟2s,就设置为CACurrentMediaTime()+2,CACurrentMediaTime()为图层的当前时间timingFunction:速度控制函数,控制动画运行的节奏delegate:动画代理

CAAnimation——动画填充模式

fillMode属性值(要想fillMode有效,最好设置removedOnCompletion =NO)kCAFillModeRemoved这个是默认值,也就是说当动画开始前和动画结束后,动画对layer都没有影响,动画结束后,layer会恢复到之前的状态kCAFillModeForwards当动画结束后,layer会一直保持着动画最后的状态 kCAFillModeBackwards在动画开始前,只需要将动画加入了一个layer,layer便立即进入动画的初始状态并等待动画开始。kCAFillModeBoth这个其实就是上面两个的合成.动画加入后开始之前,layer便处于动画初始状态,动画结束后layer保持动画最后的状态

CAAnimation——速度控制函数

速度控制函数(CAMediaTimingFunction) kCAMediaTimingFunctionLinear(线性):匀速,给你一个相对静态的感觉kCAMediaTimingFunctionEaseIn(渐进):动画缓慢进入,然后加速离开kCAMediaTimingFunctionEaseOut(渐出):动画全速进入,然后减速的到达目的地kCAMediaTimingFunctionEaseInEaseOut(渐进渐出):动画缓慢的进入,中间加速,然后减速的到达目的地。这个是默认的动画行为。

CABasicAnimation——基本动画

基本动画,是CAPropertyAnimation的子类

属性说明: fromValue:keyPath相应属性的初始值 toValue:keyPath相应属性的结束值

动画过程说明: 随着动画的进行,在长度为duration的持续时间内,keyPath相应属性的值从fromValue渐渐地变为toValue keyPath内容是CALayer的可动画Animatable属性 如果fillMode=kCAFillModeForwards同时removedOnComletion=NO,那么在动画执行完毕后,图层会保持显示动画执行后的状态。但在实质上,图层的属性值还是动画执行前的初始值,并没有真正被改变。

CABasicAnimation基础核心动画    核心动画之作用在层上面.    动画的本质是改图层的某一个属性.CABasicAnimation*anim = [CABasicAnimationanimation];    图层有那些属性,这里才能写那些属性.    anim.keyPath=@"transform.scale";    anim.toValue= @0.5;    告诉动画完成的时候不要移除    anim.removedOnCompletion=NO;    保存动画最前面的效果.    anim.fillMode= kCAFillModeForwards;    把动画添加到层上面.    [self.redView.layeraddAnimation:anim forKey:nil];

例子心跳效果

思路:就是让一张图片做一个放大缩放小的动画.    代码实现:CABasicAnimation*anim =[CABasicAnimationanimation];    设置缩放属性    anim.keyPath=@"transform.scale";    缩放到最小    anim.toValue= @0;    设置动画执行的次数    anim.repeatCount= MAXFLOAT;    设置动画执行的时长    anim.duration=0.25;    设置动画自动反转(怎么去, 怎么回)    anim.autoreverses=YES;    添加动画    [self.heartView.layeraddAnimation:anim forKey:nil];

CAKeyframeAnimation——关键帧动画

关键帧动画,也是CAPropertyAnimation的子类,与CABasicAnimation的区别是: CABasicAnimation只能从一个数值(fromValue)变到另一个数值(toValue),而CAKeyframeAnimation会使用一个NSArray保存这些数值

属性说明: values:上述的NSArray对象。里面的元素称为“关键帧”(keyframe)。动画对象会在指定的时间(duration)内,依次显示values数组中的每一个关键帧 path:可以设置一个CGPathRef、CGMutablePathRef,让图层按照路径轨迹移动。path只对CALayer的anchorPoint和position起作用。如果设置了path,那么values将被忽略 keyTimes:可以为对应的关键帧指定对应的时间点,其取值范围为0到1.0,keyTimes中的每一个时间值都对应values中的每一帧。如果没有设置keyTimes,各个关键帧的时间是平分的

CABasicAnimation可看做是只有2个关键帧的CAKeyframeAnimation

例子图片抖动

1.帧动画介绍:CAKeyframeAnimation它可以在多个值之间进行动画.        设置多值之间的属性为:        后面是一个数组,就是要设置的多个值.        anim.values= @[];        它还可以根据一个路径做动画.        anim.path= 自己创建的路径.2.图片抖动思路:        其实就是做一个左右旋转的动画.先让它往左边旋转-5,再往右边旋转5度,再从5度旋转到-5度.        就会有左右摇摆的效果了.        具体实现代码        创建帧动画CAKeyframeAnimation*anim = [CAKeyframeAnimationanimation];        设置动画属性为旋转        anim.keyPath=@"transform.rotation";        设置属性值为多个属性        anim.values= @[@(angle2radio(-5)),@(angle2radio(5)),@(angle2radio(-5))];        设置动画执行次数        anim.repeatCount= MAXFLOAT;        添加动画        [_imageView.layeraddAnimation:anim forKey:nil];3.根据圆形的路径做移动的效果.        创建路径UIBezierPath*path = [UIBezierPathbezierPathWithOvalInRect:CGRectMake(50,50,100,100)];      [path addLineToPoint:CGPointMake(200,500)];      把路径设为动画的属性        anim.path= path.CGPath;

CAAnimationGroup——动画组

动画组,是CAAnimation的子类,可以保存一组动画对象,将CAAnimationGroup对象加入层后,组中所有动画对象可以同时并发运行

属性说明: animations:用来保存一组动画对象的NSArray 默认情况下,一组动画对象是同时运行的,也可以通过设置动画对象的beginTime属性来更改动画的开始时间

例子

可以同时执行多个动画.    创建组动画CAAnimationGroup*group = [CAAnimationGroupanimation];    平移CABasicAnimation*anim = [CABasicAnimationanimation];    anim.keyPath=@"position.y";    anim.toValue= @400;    缩放CABasicAnimation*scaleAnim = [CABasicAnimationanimation];    scaleAnim.keyPath=@"transform.scale";    scaleAnim.toValue= @0.5;    设置动画组属性    group.animations= @[anim,scaleAnim];    group.removedOnCompletion=NO;    group.fillMode= kCAFillModeForwards;    添加组动画    [self.redView.layeraddAnimation:group forKey:nil];    使用动画组的好处,不需要每次都去添加动画,设置动画完成时的属性.    只需要把要执行的动画,添加到动画组的animations数组当中即可,    最后把组动画添加到层上面,就会自动执行数组当中的动画.    动画完成时设置的属性也只需要设置一次.

转场动画

转场动画就是从一个场景转换到另一个场景,像导航控制器的push效果,就是一个转场.

CATransition是CAAnimation的子类,用于做转场动画,能够为层提供移出屏幕和移入屏幕的动画效果。iOS比Mac,OSX的转场动画效果少一点

UINavigationController就是通过CATransition实现了将控制器的视图推入屏幕的动画效果

动画属性:

type:动画过渡类型

subtype:动画过渡方向

startProgress:动画起点(在整体动画的百分比)

endProgress:动画终点(在整体动画的百分比)

转场动画的过渡效果

一,CALayer进行转场动画1.创建转场动画CATransition*anim = [CATransitionanimation];2.设置转场类型      anim.type=@"cube";      anim.duration=1;3设置转场的方向      anim.subtype= kCATransitionFromLeft;4设置动画的开始位置      anim.startProgress=0.5;5设置动画的结束位置      anim.endProgress=0.8;6添加动画.了    [_imageV.layeraddAnimation:anim forKey:nil];    要执行动画的代码称为转场代码.    转场动画要和转场代码写在同一个方法当中才有动画效果.二,UIView进行转场动画      [UIViewtransitionWithView:self.imageVduration:1options:UIViewAnimationOptionTransitionFlipFromRightanimations:^{            转场代码        } completion:^(BOOLfinished) {            动画执行完毕时调用.        }];        使用UIView转场的类型比较少.

UIView与核心动画对比

1.UIView和核心动画区别

核心动画只能添加到CALayer

核心动画一切都是假象,并不会改变真实的值。

2.什么时候使用UIView的动画

如果需要与用户交互就使用UIView的动画.

不需要与用户交互可以使用核心动画

3.什么场景使用核心动画最多

在转场动画中,核心动画的类型比较多

根据一个路径做动画,只能用核心动画(帧动画)

动画组:同时做多个动画

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 205,236评论 6 478
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 87,867评论 2 381
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 151,715评论 0 340
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 54,899评论 1 278
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 63,895评论 5 368
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,733评论 1 283
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 38,085评论 3 399
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,722评论 0 258
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 43,025评论 1 300
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,696评论 2 323
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,816评论 1 333
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,447评论 4 322
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 39,057评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 30,009评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,254评论 1 260
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 45,204评论 2 352
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,561评论 2 343

推荐阅读更多精彩内容