iOS小结（三）animation blocks VS CALayer animation

最新推荐文章于 2016-05-30 20:20:30 发布

原创最新推荐文章于 2016-05-30 20:20:30 发布 · 1.1k 阅读

0 ·

CC 4.0 BY-SA版权

ios 专栏收录该内容

7 篇文章

订阅专栏

这篇博客探讨了iOS中两种常见的动画方式——UIView的animation blocks和CALayer动画。虽然UIView动画适用于简单效果，但CALayer动画更为高效，尤其适合复杂的三维变换。CALayer动画不会阻塞主线程，而UIView的动画可能会导致用户交互延迟。在需要确保动画执行顺序的情况下，animation blocks提供了更直接的解决方案，但实现特定的动画顺序时，CALayer可能需要设置delegate和实现回调方法。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

上节末尾提到 transition 的动画时说到， ios 常用的 animation 有 UIView 的 animation blocks 和 core animation （CALayer）两种，一般简单的动画 UIView 都能满足， CALayer 的动画更高效，也能达到更复杂的动画，比如三维的变换，每一个view 都有 layer 这一属性，CALayer 是对 view 的 layer 设置动画，当然使用 CAlayer 需要引入 core animation framework。

CALayer 的高效也体现在它不阻塞主线程，换句话说，用 UIView.animation 做一个2s的动画，这2s之间点击页面上的其他按钮都没有响应，要等动画做完才可以，而CALayer 的 basicAnimation 不会阻塞主线程，所以有这种需求时可以考虑CALayer。

animation blocks 有什么好处呢？下面以一个例子解释一下：

下面的 swift 函数实现的事在当前ViewController中加一个Lable，做了一系列动画之后就从View中拿掉。这期间用animation blocks做了2个动画，一个做放大，放大到1.2倍；做完放大做逐渐消失，alpha 值从 1 到 0，写法类似于js的callback，第二个动画也完成之后，把 lable 从当前 View 中 remove 掉。

    func showLable(name : String, parentView : UIViewController, center : CGPoint) {
        let lable = UILabel(frame: CGRectMake(0, 0, 200, 50))
        lable.center = center
        lable.text = name
        lable.textColor = UIColor.whiteColor()
        lable.textAlignment = NSTextAlignment.Center
        parentView.view.addSubview(lable)
        
        UIView.animateWithDuration(1.0, animations: { () -> Void in
            let transform = CGAffineTransformMakeScale(1.2, 1.2)
            lable.layer.setAffineTransform(transform)
            }, completion: {(value: Bool) -> Void in
                UIView.animateWithDuration(0.8, animations: {
                    lable.alpha = 0
                    }, completion: {(value: Bool) -> Void in
                        lable.removeFromSuperview()
                })
        })
    }

上面的block一定要注意写明animation和completion的输入参数和返回值，() -> Void 和 (value: Bool) -> Void.

上面两个动画用CALayer实现看起来就冗长了一些，

    //filter lable animation with CAlayer , do not stuck main thread
    // Usage example: Animation.scale(lable, time: 1, from: 2.0, to: 1.5)
    //                Animation.vanish(lable, time: 1.15)
    class func scale(target: UIView, time: CFTimeInterval, from: CGFloat, to: CGFloat) {
        let animation: CABasicAnimation = CABasicAnimation(keyPath: "transform.scale")
        animation.duration  = CFTimeInterval(time)
        animation.fromValue = from
        animation.toValue   = to
        animation.autoreverses = false
        target.layer.anchorPoint = CGPointMake(0.5, 0.5)
        target.layer.addAnimation(animation, forKey: "scale")
    }
    
    class func vanish(target: UIView, time: CFTimeInterval) {
        let animation: CABasicAnimation = CABasicAnimation(keyPath: "opacity")
        animation.fromValue = 1.0
        animation.toValue = 0.0
        animation.duration = CFTimeInterval(time)
        target.layer.addAnimation(animation, forKey: "Image-opacity")
        target.alpha = 0
    }

但是直接顺序调用这两个函数并不能重现像第一段swift代码中animation block实现的：“当放大动画结束之后，触发消失动画” 这个需求。想要达到这个Animation End Callback，需要 1. 设置animation.delegate = self, 2. 重载 delegate 方法 animationDidStop:finished: 。详细教程可参照http://www.raywenderlich.com/forums/viewtopic.php?t=18820&p=82648

所以，当有这种简单动画严格遵循执行顺序的需求时，直接用 animation block 还是不错的选择的。