分组动画

当知道怎样把多个动画单独添加到layer层上面，通过控制它们的时间，来实现对动画之间同步的工作。但这样的代码可读性会稍差点，所以，今天的CAAnimationGroup可以简单实现动画之间的同步工作

通过对登录界面，对登录按钮使用分组动画来了解layer的分组动画

思路： 创建了一个动画分组，继承CAAnimation。caanimation的属性也可以使用于CAAnimationGroup，
为登录按钮添加动画,将动画添加到分组中

代码如下：
let groupAnimation = CAAnimationGroup() groupAnimation.beginTime = CACurrentMediaTime() + 0.5 groupAnimation.duration = 0.5 groupAnimation.fillMode = kCAFillModeBackwards let scaleDown = CABasicAnimation(keyPath: "transform.scale") scaleDown.fromValue = 3.5 scaleDown.toValue = 1.0 let rotate = CABasicAnimation(keyPath: "transform.rotation") rotate.fromValue = CGFloat(M_PI_4) rotate.toValue = 1.0 let fade = CABasicAnimation(keyPath: "opacity") fade.fromValue = 0.0 fade.toValue = 1.0 groupAnimation.animations = [scaleDown, rotate, fade] loginButton.layer.addAnimation(groupAnimation, forKey: nil)

现在的动画已经添加出来了，但为了让这个动画看上去顺眼，需要给这个动画添加缓冲

layer动画的缓冲用到了一个CAMediaTimingFunction这样一个属性，CAMediaTimingFunction预定义了4种常量。li near匀速变化；easier开始慢，然后加速；ease out 开始块，结束慢；easeinout开始和结束慢，中间快。

groupAnimation.fillMode = kCAFillModeBackwards

layer 动画其他属性的设置：

flyLeft.repeatCount = 2.5
flyLeft.autoreverses = true
flyLeft.speed = 2.0
info.layer.speed = 2.0

效果图：

分组动画.gif

demo下载地址

layer层面的弹簧效果实现

uikit创建的是一个简单的弹簧动画，而core animation是对物理体进行的渲染。
举个例子：
在没有摩擦的情况下，钟摆会一直做左右运动。当有摩擦时，钟摆每次的摆动都会逐渐减小。这是和阻尼，初始化的里决定的。在uikit动画中，系统会根据时间自动调整这两个因素。在core animation中可以通过CASpringAnimation创建出逼真的弹簧动画效果

仍以登录的输入用户名和密码的textfield 动画结束时，产生一个动画的特效为例

let pulse = CASpringAnimation(keyPath: "transform.scale") pulse.damping = 7.5 pulse.fromValue = 1.25 pulse.toValue = 1.0 pulse.duration = pulse.settlingDuration layer?.addAnimation(pulse, forKey: nil)

实现一个当textfield输入的字符过少时，让textfield自动弹跳提示用户

首先先了解一下CASpringAnimation的四个属性：
用一张表给出：

CASpringAnimation属性.png

核心动画
func textFieldDidEndEditing(textField: UITextField) { if textField.text?.characters.count < 5 { let jump = CASpringAnimation(keyPath: "position.y") jump.fromValue = textField.layer.position.y + 1.0 jump.toValue = textField.layer.position.y jump.initialVelocity = 100.0//指定速度 jump.mass = 10.0//指定质量 jump.stiffness = 1500.0//设置引力 jump.damping = 50.0//设置阻尼 jump.duration = jump.settlingDuration textField.layer.addAnimation(jump, forKey: nil) } textField.layer.borderWidth = 3.0 textField.layer.borderColor = UIColor.clearColor().CGColor let flash = CASpringAnimation(keyPath: "borderColor") flash.damping = 7.0 flash.stiffness = 200.0 flash.fromValue = UIColor(red: 0.96, green: 0.27, blue: 0.0, alpha: 1.0).CGColor flash.toValue = UIColor.clearColor().CGColor flash.duration = flash.settlingDuration textField.layer.addAnimation(flash, forKey: nil) }

效果图：

layer弹簧动画.gif

layer层帧动画

与视图的关键帧动画不同，视图的关键帧动画是将独立的动画混合在一起。la ye r层的帧动画只能对单一属性的动画，可以创建多个点，但是不能有任何的重叠和间隔
CAKeyframeAnimation可以实现layer的关键帧动画。

补充知识：层动画是根据duration时间内，通过设置fromvalue和to value 改变指定layer的属性。而CAKeyframeAnimation会使用一个数组values代替from value和to value ，values中存储在动画时间内每个时间点上的关键值。

使用关键帧动画模仿登录认证失败时的动画

核心代码如下：
let wobble = CAKeyframeAnimation(keyPath: "transform.rotation") wobble.duration = 0.25 wobble.repeatCount = 4 wobble.values = [0.0, -M_PI_4/4, 0.0, M_PI_4/4, 0.0] wobble.keyTimes = [0.0, 0.25, 0.5, 0.75, 1.0] heading.layer.addAnimation(wobble, forKey: nil)

谈论一下如何对结构类属性做动画，目前只是单纯地为结构类的某个分量做的动画

结构类属性有常见的如：CGpoint，CATransform3D,所以要对结构体属性做动画，就需要封装这个结构体，让结构体转变成对象。此时就需要借住nsvalue这个类，nsvalue有很多初始化方法，便于结构体转变成对象。

用一张la ye r层上的图片通过改变它在屏幕上的point来验证结构体属性的动画

核心代码如下：

let balloon = CALayer() balloon.contents = UIImage(named: "balloon")!.CGImage balloon.frame = CGRect(x: -50.0, y: 0.0, width: 50.0, height: 65.0) view.layer.insertSublayer(balloon, below: username.layer) let flight = CAKeyframeAnimation(keyPath: "position") flight.duration = 12.0 flight.values = [CGPoint(x: -50, y: 0.0),CGPoint(x: view.frame.width + 50.0, y: 160.0),CGPoint(x: -50.0, y: loginButton.center.y)].map{ NSValue(CGPoint:$0)}//通过map闭包可以将cgpont类型转成nsvalue的对象 flight.keyTimes = [0.0, 0.5, 1.0] balloon.addAnimation(flight, forKey: nil) balloon.position = CGPoint(x: -50.0, y: loginButton.center.y)

效果展示：

帧动画的实现.gif

下载地址