iOS复习 - CATransition转场动画

CATransition初识

转场动画主要用于不同的视图场景之间的切换。比如我们经常使用的PPT,每一页的PPT都是可以作为一个独立的场景，在这个单独的场景中可以添加各种各样的UI。但是当这一页展示完毕，需要进入到下一页时，添加一个合适的过渡动画会使得转场的下过比较平滑。在ios中经常使用CoreAnimation核心动画中的CATransition实现这个功能。

CATransition使用

• （1）实例化CATransition，并设置相应的转场动画的key。
• （2）设置合适的转场动画的属性，比如动画周期、过渡方向、动画保持状态等。
• （3）将动画效果添加到相应的视图的Layer图层中

在第一步设置动画效果时候需要注意，ios提供了大量的的炫酷动画效果，不过总体上来说可以分为共有API和私有API，共有API制作的APP可以直接上线，私有的API制作的APP有被拒的风险。

共有API:

fade:淡入淡出效果，可以使用常量kCATransitionFade表示
push：推送效果，可以使用常量kCATransitionPush表示
reveal：揭开效果，可以使用常量kCATransitionReveal表示
movein：移动效果，可以使用常量kCATransitionMoveIn表示

私有API:

pageCurl:向上翻页效果，只能用字符串表示
pageUnCurl:向下翻页效果，只能用字符串表示
cube:立体翻转效果，只能用字符串表示
oglFlip:翻转效果，只能用字符串表示
suckEffect:收缩效果，只能用字符串表示
rippleEffect:水滴波纹效果，只能用字符串表示
cameraIrisHollowOpen:相机打开效果，只能用字符串表示
cameraIrisHollowClose:相机关闭效果，只能用字符串表示

在第二个步骤中，设置动画的周期、最终状态等属性和CoreAnimation核心动画中的CABasicAnimation类使用方法相同，这里主要介绍转场动画的方向属性设置。转场动画支持以下四种方向。

kCATransitionFromRight：从右侧转场
kCATransitionFromLeft：从左侧转场
kCATransitionFromTop：从顶部转场
kCATransitionFromBottom：从底部转场

第三部实现将动画添加到指定的图层上。如果想让整个视图控制器进行转场，那么可以添加到当前的self.view上,如果想对某个特定的图层进行转场，那么可以直接添加到相应的图层上。

实例

• 收缩效果

  
  jy_suckEffect.gif

• 水滴波纹效果

  
  jy_rippleEffect.gif

• 翻页效果

  
  jy_page.gif

代码

class ViewController: UITableViewController {

    let animationTypes = ["fade",
                          "push",
                          "reveal",
                          "movein",
                          "pageCurl",
                          "pageUnCurl",
                          "cube",
                          "oglFlip",
                          "suckEffect",
                          "rippleEffect",
                          "cameraIrisHollowOpen",
                          "cameraIrisHollowClose"]

    override func viewDidLoad() {
        super.viewDidLoad()
    }

    override func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath) {
        let transitionVC = UIStoryboard.init(name: "Main", bundle: nil).instantiateViewController(withIdentifier: "CATransitionVC") as! CATransitionVC
        transitionVC.animationType = animationTypes[indexPath.row]
        self.navigationController?.pushViewController(transitionVC, animated: true)
    }

 @IBAction func startAnimationClick(_ sender: UIButton) {
        jyImageView.image = #imageLiteral(resourceName: "jy2")
        let animation = CATransition()
        animation.duration = 2
        animation.type = animationType
        animation.subtype = kCATransitionFromRight //设置当前动画的转场方向
        self.view.layer.add(animation, forKey: nil)
    }

第一次简单的转场动画就介绍到这里，后续的视图过渡动画会持续更新，demo也会后续跟新出。

Demo地址