Yalantis团队简直就是我的偶像，用OC和Swift代码实现了诸多炫酷的动效。在这里，我将以Yalantis的StarWars.iOS作为分析对象，剖析其中几个炫酷动效的实现，就当学习了。
StarWars.iOS（https://github.com/Yalantis/StarWars.iOS）是超炫酷的一套动效，其Swift代码的实现在Github已经获得2400+赞，效果如下：
我在这里想要剖析的主要是3块：
- 星空背景；
- 点击开关后的过渡动效；
- 破裂散落效果；
建议clone一份代码，不然估计是看得一头雾水了。
1. 星空背景
这个之前我用过，靠CAEmitterLayer和CAEmitterCell实现，这两个类可以实现大部分的粒子效果，包括火焰、烟雾等效果，这边是我之前写的一个很渣的例子FNFogEaseOut。利用CAEmitterLayer和CAEmitterCell，可以控制粒子的形状、图案、初始速度、加速度、生命时间、缩放速率等等。
在这里看一下核心的代码段（StarsOverlay.swift）：
emitter.emitterMode = kCAEmitterLayerOutline
emitter.emitterShape = kCAEmitterLayerCircle
emitter.renderMode = kCAEmitterLayerOldestFirst
emitter.preservesDepth = true
在这里指定了CAEmitterLayer的发送模式（kCAEmitterLayerOutline）、发送源形状（kCAEmitterLayerOutline）、渲染模式（kCAEmitterLayerOldestFirst）。
particle = CAEmitterCell()
particle.contents = UIImage(named: "spark")!.CGImage
particle.birthRate = 10
particle.lifetime = 50
particle.lifetimeRange = 5
particle.velocity = 20
particle.velocityRange = 10
particle.scale = 0.02
particle.scaleRange = 0.1
particle.scaleSpeed = 0.02
emitter.emitterCells = [particle]
让CAEmitterCell以10个/s的生成速率生成，并指定了粒子的生命时间、速度、缩放比例和缩放速度。
最后实现的效果非常梦幻，非常关键的一段小代码：
emitterTimer = NSTimer.scheduledTimerWithTimeInterval(0.1, target: self, selector: #selector(randomizeEmitterPosition), userInfo: nil, repeats: true)
func randomizeEmitterPosition() {
let sizeWidth = max(bounds.width, bounds.height)
let radius = CGFloat(arc4random()) % sizeWidth
emitter.emitterSize = CGSize(width: radius, height: radius)
particle.birthRate = 10 + sqrt(Float(radius))
}
这一段代码使得粒子发射源的位置和生成速率具有一定的随机性，不然就会出现靠近中心的位置有很对星星，但是远一点的地方稀稀疏疏的情况。
总结：核心实现是CAEmitterLayer和CAEmitterCell。
2. 点击开关后的过渡动效
这个虽然说看着像UIViewController的过渡动效，实际上只是UIView的过渡。
简单的说，就是获取当前的View的界面新建一个View，再通过CAShapeLayer设为layer.mask来抠一个洞，实时调整这个洞的大小，从而实现圆形区域放大的效果。
核心代码（UIView+CircularAnimation.swift）：
let snapshot = self.snapshotViewAfterScreenUpdates(false)
snapshot.frame = self.bounds
self.addSubview(snapshot)
获取当前的View的界面新建一个View，重点是snapshotViewAfterScreenUpdates这个方法，iOS7之后终于再也不用UIGraphics获取截图了。这个方法后面的bool若为false，取到的即是当前的页面状态；否则如果是下面这样的代码，你取到的是一片空白，因为该参数表示是否在所有效果应用在视图上了以后再获取快照：
[view snapshotViewAfterScreenUpdates:YES];
[view setAlpha:0.0];
核心代码（CircularRevealAnimator.swift）：
let startCirclePath = CGPathCreateWithEllipseInRect(SquareAroundCircle(center, radius: startRadius), UnsafePointer())
let endCirclePath = CGPathCreateWithEllipseInRect(SquareAroundCircle(center, radius: endRadius), UnsafePointer())
var startPath = startCirclePath, endPath = endCirclePath
var path = CGPathCreateMutable()
CGPathAddRect(path, nil, layer.bounds)
CGPathAddPath(path, nil, startCirclePath)
startPath = path
path = CGPathCreateMutable()
CGPathAddRect(path, nil, layer.bounds)
CGPathAddPath(path, nil, endCirclePath)
endPath = path
startPath和endPath分别为初始状态的小圆和最终状态的大圆；
animation = CABasicAnimation(keyPath: "path")
animation.fromValue = startPath
animation.toValue = endPath
mask.addAnimation(animation, forKey: "reveal")
实现被抠区域从小变大的动效。
总结：核心实现是snapshotViewAfterScreenUpdates获取截图、CAShapeLayer指定UIView的layer.mask。
3. 破裂散落效果
其实这个效果是整套动效的关键，也是我最喜欢的部分。
前面讲到了CAEmitterCell粒子，估计会有很多人会和我一样，想用矩形或正方形的粒子来实现这个效果。不过我没能继续做下去，并且StarWars.iOS中也不是这样实现的。
另外，这是一个UIViewController的过渡动画。
实现的关键和上面讲到的过渡动画有一点类似：
- 截图；
- 分割成小块；
- 散落；
自定义UIViewController过渡动画，需要用到protocol UIViewControllerAnimatedTransitioning，实现下面2个方法：
public func transitionDuration(transitionContext: UIViewControllerContextTransitioning?) -> NSTimeInterval
public func animateTransition(transitionContext: UIViewControllerContextTransitioning)
前者制定过渡动画的时长，后者可以拿到过渡前后的页面View，从而自定义过渡过程。
自定义过渡核心代码（StarWarsUIDynamicAnimator.swift）：
public func transitionDuration(transitionContext: UIViewControllerContextTransitioning?) -> NSTimeInterval {
return self.duration
}
public func animateTransition(transitionContext: UIViewControllerContextTransitioning) {
...
}
破裂散落效果核心代码：
let fromViewSnapshot = fromView.snapshotViewAfterScreenUpdates(false)
for ... {
for ... {
let snapshotRegion = CGRect(x: x, y: y, width: width, height: height)
let snapshot = fromViewSnapshot.resizableSnapshotViewFromRect(snapshotRegion, afterScreenUpdates: false, withCapInsets: UIEdgeInsetsZero)
containerView.addSubview(snapshot)
获取当前View的截图View，并用resizableSnapshotViewFromRect得到各个方块所在位置的截图View。
func randomFloatBetween(smallNumber: CGFloat, and bigNumber: CGFloat) -> CGFloat {
let diff = bigNumber - smallNumber
return CGFloat(arc4random()) / 100.0 % diff + smallNumber
}
let push = UIPushBehavior(items: [snapshot], mode: .Instantaneous)
push.pushDirection = CGVector(dx: randomFloatBetween(-0.15 , and: 0.15), dy: randomFloatBetween(-0.15 , and: 0))
push.active = true
animator.addBehavior(push)
let gravity = UIGravityBehavior(items: snapshots)
animator.addBehavior(gravity)
给每个小块加上瞬间（Instantaneous）的推力（UIPushBehavior），randomFloatBetween的随机部分，使得每个小块在竖直和水平上都有些错开，达到裂开的效果。
给snapshots加上重力，实现下落的效果。
总结
其实我早就想仔细研究这个动效的实现了，但是看着这么炫酷，总感觉是超复杂的实现。潜下心来看代码，虽然代码也不短，但是从实现思路和核心知识点来看，都不复杂。
这3个动效学到的新知识：CAEmitterLayer和CAEmitterCell、snapshotViewAfterScreenUpdates截图、UIPushBehavior和UIGravityBehavior。
