iOS杂谈 Design

iOS杂谈 - 如何快速实现一个抖音加载动画

Posted on 2021-03-24,2 min read
封面图

我们还在为写动画而苦恼么,今天通过一个动画来给大家介绍一个工具,如何通过简单的拖拽就能实现一个相对复杂的动画效果。关键点不是在实现一个动画效果,而是能快速生成对应的iOS原生动画代码。

今天我要介绍的工具是 Kite Compositor

  • 下面是关于Kite Compositor的几点

基于 Core Animation
能导出 Core Animation 的代码作为参照
时间轴动画基于 CAKeyframeAnimation
形状图层基于 CAShapeLayer
CAMediaTimingFunction 做动画曲线
Swift - Like 的动画脚本
神似 Storyboard 的布局界面

下面通过 Kite Compositor 快速实现一个抖音加载动画

通过分析抖音动画,发现抖音不是用原生代码写的,使用的图片帧动画

那么现在我通过Kite Compositor 快速实现一个原生的抖音加载动画,这里就不在赘述动画原理了,动画实现流程跟原生代码异曲同工。

动画图层通过layer实现

时间轴动画基于 CAKeyframeAnimation

导出原生代码

查看动画效果

总结:是不是从未发现iOS的动画实现起来如此简单,不仅能大大节约开发时间,还能节约图片资源带来的空间浪费,更能提高程序的稳定性和高性能。


下一篇: iOS杂谈 - 自动化构建→