目录：
动画库 - Lottie-iOS
动画库 - SVGA-iOS
动画库 - Keyframes-iOS
APP常见的动画库对比：
| 动画库 | Lottie | SVGA | Keyframes |
|---|---|---|---|
| 支持平台 | Android/iOS/Web | Android/iOS/Web | Android/iOS |
| 设计工具支持 | AfterEffects(AE) | AE&Flash | AE |
| 功能边界 | 所有 | 部分 | 矢量图 |
| 导出工具 | 插件 | 插件 | 脚本 |
| 设计成本 | 需要命名规范 | 无 | 需要脚本 |
| 资源包大小zip | 2.6M | 767K | |
| 官网 | airbnb.design/lottie/ | svga.io/ | git地址 |
简介
Lottie是一个可以解析使用【bodymovin】插件从 Adobe After Effects 中导出的格式为json的文件，并在 iOS、Android、macOS、React Native 和 Windows 中进行解析使用的开源库。
设计师导出流程图
优缺点
优点：
- 开发效率高，设计满意度高。设计师导出json + images文件，开发几行代码就能实现其效果。
- 替换GIF，远程配置动画，跨品台。运营直接在配置设计师给的json文件和资源文件，就能实现动画效果。
- 提升APP性能体验。比如iOS的GIF图非常浪费CPU和内存，但Lottie会好很多。
缺点：(转自知乎博主)
- Lottie不支持任何形式的表达式，如果把表达式转换为关键帧会降低性能，请自行斟酌
- 对于描边来说，由于AE本身不支持内外描边，lottie只能导出中心描边。在sketch/ai中请不要使用内外描边。
- 果动画中涉及到大量位图，最终性能会大幅度降低。
demo实例：
-
Pods引入解析库lottie-ios。为了快速实现demo，没有使用最新版本的库，如果你开发用到此功能，建议学习使用最新版本，毕竟Lottie库越来越完善。
pod 'lottie-ios', '~> 2.5.2'
-
导入资源文件
json + images - 具体实现
LOTAnimationView *calculateView = [[LOTAnimationView alloc] init];
calculateView.frame = self.view.bounds;
[calculateView setContentMode:UIViewContentModeScaleAspectFit];
[calculateView setAnimationNamed:@"xinghe" inBundle:[NSBundle bundleWithPath:[[NSBundle mainBundle] pathForResource:@"xinghe" ofType:@"bundle"]]];
[calculateView play];
[calculateView setLoopAnimation:YES];
[self.view addSubview:calculateView];
-
动画效果
动画效果
