正文

利用Swift实现各类的CATransition动画详解

︶ㄣSDDLL学院 メ
SDDLL学院V管理员 / 阅读
0701
CATransition动画主要在过渡时使用，比如两个页面层级改变的时候添加一个转场效果。CATransition分为两类，一类是公开的动画效果，一类是非公开的动画效果。这篇文章主要给大家介绍了

CATransition动画主要在过渡时使用，比如两个页面层级改变的时候添加一个转场效果。CATransition分为两类，一类是公开的动画效果，一类是非公开的动画效果。这篇文章主要给大家介绍了关于如何利用Swift实现各类CATransition动画的相关

前言

最近因为工作的需要，打算用swift重构现有项目，实现过程中发现用到了很多系统的动画实现，因为之前的都是用OC实现的，这里主要是把一些动画效果来通过swift实现一下。

这篇文章主要是实现一下CATransition动画的不同效果。

第一步 创建一个swift文件并声明相应的枚举类型

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
enum TransitionAnimType : Int {
case fade = 0,    //淡入淡出
push,      //推挤
reveal,      //揭开
moveIn,      //覆盖
cube,      //立方体
suckEffect,     //吮吸
oglFlip,     //翻转
rippleEffect,    //波纹
pageCurl,     //翻页
pageUnCurl,     //反翻页
cameraIrisHollowOpen,  //开镜头
cameraIrisHollowClose,  //关镜头
curlDown,     //下翻页
curlUp,      //上翻页
flipFromLeft,    //左翻转
flipFromRight,    //右翻转
ramdom      //随机
}
 
enum TransitionSubType : Int {
case top = 0,    //上
left,      //左
bottom,      //下
right,      //右
ramdom      //随机
}
 
enum TransitionCurve : Int {
case Default = 0,   //默认
EaseIn,      //缓进
EaseOut,     //缓出
EaseInEaseOut,    //缓进缓出
Linear,      //线性
Ramdom      //随机
}

上面三个枚举类型分别代表：

  • TransitionAnimType：动画类型
  • TransitionSubType：动画方向
  • TransitionCurve：动画曲线

第二步 自定义函数返回动画类型

?
1
2
3
4
5
6
/// 返回动画类型
private func animationType(animType: TransitionAnimType) -> String {
 /// 设置转场动画类型
 let animTypeArray = ["fade", "push", "reveal", "moveIn", "cube", "suckEffect", "oglFlip", "rippleEffect", "pageCurl", "pageUnCurl", "cameraIrisHollowOpen", "cameraIrisHollowClose", "curlDown", "curlUp", "flipFromLeft", "flipFromRight", "ramdom"]
 return objectFromDataSource(array: animTypeArray, index: animType.rawValue, isRamdom: (TransitionAnimType.ramdom == animType)) as! String
}

第三步 自定义函数返回动画方向

?
1
2
3
4
5
/// 返回动画方向
private func animationSubType(subType: TransitionSubType) -> String {
 let animSubTypeArray = [kCATransitionFromTop, kCATransitionFromLeft, kCATransitionFromBottom, kCATransitionFromRight]
 return objectFromDataSource(array: animSubTypeArray, index: subType.rawValue, isRamdom: (TransitionSubType.ramdom == subType)) as! String
}

第四步 自定义函数返回动画曲线

?
1
2
3
4
5
/// 返回动画曲线
private func animationCurve(curve: TransitionCurve) -> String {
 let animCurveArray = [kCAMediaTimingFunctionDefault, kCAMediaTimingFunctionEaseIn, kCAMediaTimingFunctionEaseOut, kCAMediaTimingFunctionEaseInEaseOut, kCAMediaTimingFunctionLinear]
 return objectFromDataSource(array: animCurveArray, index: curve.rawValue, isRamdom: (TransitionCurve.Ramdom == curve)) as! String
}

第五步 不难发现，上面三个自定义方法中我们都用到了objectFromDataSource这个方法，从我们的传参不难发现，它就是为了返回我们需要的指定数据的，下面我们来实现一下这个方法

?
1
2
3
4
5
6
7
/// 统一从数据返回对象
private func objectFromDataSource(array: Array<Any>, index: Int, isRamdom: Bool) -> AnyObject {
 let count = array.count
 let i = isRamdom ? Int(arc4random_uniform(UInt32(count))) : index
 
 return array[i] as AnyObject
}

第六步 好了，现在所有的准备工作已经做好，接下来我们来看一下具体的动画实现的方法

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
func layerTransition(animTye: TransitionAnimType, subType: TransitionSubType, curve: TransitionCurve, duration: CGFloat, layer: CALayer) {
let key = "transition"
if layer.animation(forKey: key) != nil {
 layer.removeAnimation(forKey: key)
}
let transition = CATransition()
 
/// 动画时长
transition.duration = CFTimeInterval(duration)
 
/// 动画类型
transition.type = animationType(animType: animTye)
 
/// 动画方向
transition.subtype = animationSubType(subType: subType)
 
/// 缓动函数
transition.timingFunction = CAMediaTimingFunction(name: animationCurve(curve: curve))
 
/// 完成动画删除
transition.isRemovedOnCompletion = true
 
layer.add(transition, forKey: key)
 
}

大功告成！接下来我们去需要使用动画的地方来调取我们第六步实现的方法就好了。so easy ！哈哈

?
1
layerTransition(animTye: .ramdom, subType: .ramdom, curve: .Ramdom, duration: 2.0, layer: (self.view.window?.layer)!)

是不是感觉很简单呢，上面的代码组合一下就可以直接用喽，有需要的拿走不谢～～

总结

以上就是这篇文章的全部内容了，希望本文的内容对大家的学习或者工作能带来一定的帮助，如果有疑问大家可以留言交流，谢谢大家对米米素材网的支持。

原文链接：http://www.jianshu.com/p/1f798a171e9a