上面就是你播放动画需要的代码。在Lottie中有个LOTAnimationView分类可以直接从JSON文件下载动画数据。你要先用你已经下载好的JSON文件创建一个LOTAnimationView对象,你才能展示这个动画。
LOTAnimationView是UIView的一个子分类,所以你只要像执行其他视图一样执行LOTAnimationView就可以了。我们先将它的大小重置,放在中心位置,把内容模式设为Aspect Fill;然后我们调用addSubview把动画视图添加到主视图;最后,我们调用play()播放动画。
现在我们运行项目看看APP的效果是什么样。只要打开APP,它就会实时播放动画。
循环动画
默认情况下,动画只播放一次。如果你想循环播放动画,你可以把loopAnimation属性设为true如下:
animationView.loopAnimation = trueLOTAnimationView 分类也为你自定义动画提供了大量属性。如果你想放慢动画播放速度,只要像下面这样改变animationSpeed属性就行了:
animationView.animationSpeed = 0.5从远程服务器上载入Animation JSON File
你不仅可以把JSON文件保存在本地,而且可以把动画数据保存在远程服务器上。Lottie已经为开发者从远程URL上下载JSON文件准备好了API。用下面的代码替换animationView的初始化界面,看看你会得到什么样的动画。
let animationView = LOTAnimationView(contentsOf: URL(string: "https://github.com/airbnb/lottie-ios/raw/master/Example/Assets/PinJump.json")!)动画视图转换
LOTAnimationView和UIView一样都支持不同类型的动画转换。你可以通过合理地设置转换属性对动画进行旋转,大小重置,位置重置。下面是一个把动画顺时针转换45度的转换示例:
let rotateTransform = CGAffineTransform(rotationAngle: 45.0) animationView.transform = rotateTransform相似的,你可以像其他标准UIView对象一样把UIView动画覆盖在原来的动画上。我们在现有的动画上重建一不同大小的动画。用下面的代码把viewDidLoad()替换掉:
override func viewDidLoad() { super.viewDidLoad() if let animationView = LOTAnimationView(name: "servishero_loading") { animationView.frame = CGRect(x: 0, y: 0, width: 400, height: 400) animationView.center = self.view.center animationView.loopAnimation = true animationView.contentMode = .scaleAspectFill animationView.animationSpeed = 0.5 // Applying UIView animation let minimizeTransform = CGAffineTransform(scaleX: 0.1, y: 0.1) animationView.transform = minimizeTransform UIView.animate(withDuration: 3.0, delay: 0.0, options: [.repeat, .autoreverse], animations: { animationView.transform = CGAffineTransform.identity }, completion: nil) view.addSubview(animationView) animationView.play() } }运行APP你就会得到下面的结果,是不是很有趣呢?
接下来呢?
好的UI动画不仅能使你的应用上一个层次,而且能提供动人的用户体验。在Lottie出现之前,用After Effects来真正地实现动画的确是非常艰难又耗时的工作。但现在有了这个强大的动画库将使得动画实现变得无比轻松。
在这个教程中,你应该已经学会了如何使Lottie服务于你的iOS项目。我在这儿只是大概介绍了一下Lottie的要点,你可以在GitHub上了解更多关于Lottie的信息。不仅如此,我们在下期教程将通过建立一个炒鸡棒的管理动画对Lottie进行更加深入的探讨。
保持关注哦。如果你喜欢这个教程,请在下方留言或分享给你的朋友。
你可以在GitHub上下载这个简单的Xcode项目以供参考。