简介
iOS上的动画主要是指Core Animation框架
Core Animation是IOS和OS X平台上负责图形渲染与动画的基础框架。Core Animation可以作用与动画视图或者其他可视元素,为你完成了动画所需的大部分绘帧工作。你只需要配置少量的动画参数(如开始点的位置和结束点的位置)即可使用Core Animation的动画效果。
Core Animation将大部分实际的绘图任务交给了图形硬件来处理,图形硬件会加速图形渲染的速度。这种自动化的图形加速技术让动画拥有更高的帧率并且显示效果更加平滑,不会加重CPU的负担而影响程序的运行速度。
核心动画所在的位置如下图所示:
Core Animation类图
Core Animation类的继承关系:
CAAnimation
:是所有动画对象的父类,实现CAMediaTiming协议,负责控制动画的时间、速度和时间曲线等等,是一个抽象类,不能直接使用。CAAnimationGroup
: 组动画,将多个动画合并到一起,并发执行CAPropertyAnimation
:是CAAnimation的子类,它支持动画地显示图层的keyPath,一般不直接使用。CABasicAnimation
: 基础动画CAKeyframeAnimation
:关键帧动画
CATransaction
: 过渡动画
常用属性
duration
: 动画的持续时间beginTime
: 动画的开始时间repeatCount
: 动画的重复次数timingFunction
: 动画的时间节奏控制- kCAMediaTimingFunctionLinear 匀速
- kCAMediaTimingFunctionEaseIn 慢进
- kCAMediaTimingFunctionEaseOut 慢出
- kCAMediaTimingFunctionEaseInEaseOut 慢进慢出
- kCAMediaTimingFunctionDefault 默认值(慢进慢出)
delegate
: 动画代理监听动画开始与结束keyPath
:可以指定keyPath为CALayer的属性值,并对它的值进行修改,以达到对应的动画效果,需要注意的是部分属性值是不支持动画效果的。
使用方式
CABasicAnimation
基础动画主要提供了对于CALayer对象中的可变属性进行简单动画的操作,比如:位移、透明度、缩放、旋转、背景色等等。
重要属性:fromValue
: 不为空时,动画始终从此值开始toValue
: 不为空时动画结束时的值byValue
: 不为空时对fromValue
追加的值
动画演示:
代码演示:1
2
3
4
5
6
7
8
9
10
11
12
13
14 let move = CABasicAnimation(keyPath: "position.x")
move.duration = 1
move.byValue = 200
/* 等价于
move.fromValue = 187
move.toValue = 387
*/
// move.isRemovedOnCompletion = false
// move.fillMode = kCAFillModeForwards
/*
isRemovedOnCompletion = false &&
fillMode = kCAFillModeForwards时动画结束不会复原
*/
myView.layer.add(move, forKey: "moveAnimation")
CAKeyframeAnimation
CAKeyframeAnimation和CABaseAnimation都属于CAPropertyAnimatin的子类。CABaseAnimation只能从一个数值(fromValue)变换成另一个数值(toValue),而CAKeyframeAnimation则会使用一个NSArray保存一组关键帧。
CABaseAnimation可以说是只有两个关键帧CAKeyframeAnimation
重要属性values
: 就是上述的NSArray对象。里面的元素称为”关键帧”(keyframe)。动画对象会在指定的时间(duration)内,依次显示values数组中的每一个关键帧path
: 可以设置一个CGPathRef\CGMutablePathRef,让层跟着路径移动。path只对CALayer的anchorPoint和position起作用。如果你设置了path,那么values将被忽略.keyTimes
: 可以为对应的关键帧指定对应的时间点,其取值范围为0到1.0,keyTimes中的每一个时间值都对应values中的每一帧.当keyTimes没有设置的时候,各个关键帧的时间是平分的。
动画演示:
代码演示:
1
2
3
4
5
6
7let key = CAKeyframeAnimation(keyPath: "position")
key.duration = 2.0
key.values = [CGPoint(x: 100, y: 150),
CGPoint(x: 250, y: 250),
CGPoint(x: 250, y: 300),
CGPoint(x: 350, y: 300)]
myView.layer.add(key, forKey: "keyAnimation")
CAAnimationGroup
CAAnimation的子类,可以保存一组动画对象,将CAAnimationGroup对象加入层后,组中所有动画对象可以同时并发运行。animations
: 用来保存一组动画对象的NSArray
动画演示:
代码演示:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20let key = CAKeyframeAnimation(keyPath: "position")
key.duration = 2.0
key.values = [CGPoint(x: 100, y: 150),
CGPoint(x: 250, y: 250),
CGPoint(x: 250, y: 300),
CGPoint(x: 350, y: 300)]
let opacity = CABasicAnimation(keyPath: "opacity")
opacity.duration = 1
opacity.toValue = 0
let move = CABasicAnimation(keyPath: "transform.rotation.z")
move.duration = 1
move.toValue = CGFloat.pi*2.0
let group = CAAnimationGroup()
group.duration = 3
group.animations = [key,opacity,move]
myView.layer.add(group, forKey: "groupAnimation")
CATransaction
CAAnimation的子类,用于做过渡动画或者转场动画,能够为层提供移出屏幕和移入屏幕的动画效果。
重要属性type
: 动画的过渡类型
Apple提供四种过渡效果
- kCATransitionFade 渐变效果
- kCATransitionMoveIn 进入覆盖效果
- kCATransitionPush 推出效果
- kCATransitionReveal 揭露离开效果
还有部分私有API效果酷炫但不推荐使用
subtype
: 动画过渡方向
- kCATransitionFromRight 从右侧进入
- kCATransitionFromLeft 从左侧进入
- kCATransitionFromTop 从顶部进入
- kCATransitionFromBottom 从底部进入
动画演示:
代码演示:1
2
3
4
5
6
7
8 changeView()
let fade = CATransition()
fade.duration = 1
fade.type = kCATransitionFade
fade.subtype = kCATransitionFromRight
// fade.startProgress = 0.3
// fade.endProgress = 0.8
myView.layer.add(fade, forKey: "fadeAnimation")
经典案例
Demo地址在CoreAnimationDemo