iOS Lottie集成与使用

Life

Lottie介绍

“Lottie is a mobile library for Android and iOS that parses Adobe After Effects animations exported as json with bodymovin and renders the vector animations natively on mobile and through React Native!” - 自官网:https://github.com/airbnb/lottie-ios

大致意思是:Lottie是一个可以解析使用【bodymovin】插件从 Adobe After Effects 中导出的格式为 json 的文件,并在 iOS、Android、macOS、React Native 中进行解析使用的开源库。

这个库由 Airbnb 开发并在2017年2月份左右开源的。

看一下官方实现的一部分效果:

Community 2_3.gif

Examples1.gif

Examples2.gif

Examples3.gif

Examples4.gif

是不是很cool!看到此库我是非常喜欢开心的!为什么呢?

先来脑补一些场景:
场景一:在开发 app 过程中,需要在 app 中实现设计师提供的效果动画,都是通过代码来实现,针对复杂的动画,开发同学更是会花费很长时间去实现,如果是处女座的设计师,还会坐在开发同学旁边“折磨”开发同学一起调细节,做过的同学一定深有体会。

场景二:还有一些情况,因为实现动画的开发成本比较高,比如需要1~2天去实现一个动画效果,但是因为版本周期比较紧,会在无奈中砍掉或者简化动画,那么原本想提升用户体验的,却打了折扣。

总的来说,动画要实现,需要设计师通过设计出来,然后开发同学再通过代码实现。开发完成后,再和设计同学一起对代码实现的效果进行微调,达到满意效果。
那么对一些炫酷的、体验非常好的动画设计,开发的成本很高,虽然现在一些第三方的开源动画可以参考,但是要做的有自己的特色,还是需要花时间去理解分析、实现、调试。对一些迭代周期短的app来说,花那么多时间去做一个动画,基本会被kill,设计同学一定很无奈和郁闷。

但是现在不同了!!!

Airbnb 开源的这个库,应该可以让设计师和开发同学喜笑颜开了。通过bodymovin 这个AE的插件,可以将AE设计好的动画导出为json格式的文件。交给开发同学,开发同学通过集成Lottie库,就可以读取设计同学给到的json文件,在程序中通过几行代码就可以实现原本要花费1天甚至更久的时间来实现的动画啦。是不是很cool?大大降低了开发同学的开发成本,而在客户端上展示的动画效果是和AE中的一样的,不需要花额外时间和开发一起微调了,这样一来,开发同学就把时间和精力放在动画以外的事情上就好了。boss开心了、设计同学开心了、开发同学也开心了、用户使用的也开心了,皆大欢喜是不是

猜你喜欢

转载自blog.csdn.net/Keep_Moving31038/article/details/81386973