Android中Lottie的简单使用

Android中Lottie的简单使用,第1张

开源项目地址: https://github.com/airbnb/lottie-android

Lottie是一个适用于Android和iOS的移动库,它可以使用 Bodymovin 解析以json 格式 导出的 Adobe After Effects 动画,并在移动设备上进行本地渲染!

lottie_loop 设置动画是否循环,默认是不循环明侍斗的(这个在新版本中已经不建议使用了!)

lottie_colorFilter 设置动画的着色颜色,这个就是把你的动画变成了一个颜色的了!但是有些动画太深的话会变谈羡得一片模糊!所以感觉这个东西和json文件的内容有关!!!

lottie_autoPlay 设置激磨动画是否自动播放

lottie_repeatCount 重复次数

lottie_imageAssetsFolder 动画依赖的图片资源文件地址

lottie_scale 设置动画的比例,但是我设置了并没有什么用!!!

lottie_repeatMode 设置动画的重复模式RESTART:重复、REVERSE:反向

lottie是一个很不错的库,能够用设计人员出动画,直接内嵌程序进行播放,酷炫而简单,大大提升开发效率。

不过iOS版本的api有一些不太友好,有两个点记录孝李一下

姿势二:

在创建LOTComposition的之后,还可以指定根目录,这纳燃样就可以使用同一个bundle了。

因为initModel会触发整个json文件的读取和ui元素初始化,包括图片初始化。初始化之后再设置root就没有任何意义了。

两个姿势供你挑选。其实关系也不大,一个是维护bundle的目录,一个是维护root的目录,半斤八两。

有的同学会问:我也在组件中使用lottie啊,怎么没涉及到bundle设置的问题?

答:因为bundle只用来获取资源,如果你洞慎虚使用json直传的方式,并且没有需要依赖的图片,那么不会影响lottie内部的加载。

Android 系统从5.0开始支持矢量图,可以通过 Android Studio自带的 Vector Assert 工具将SVG、PSD 转成VectorDrawble。

转化好的VectorDrawblew看起来好像挺复杂,是不是完全看不懂。没关系,只要转化的图形没有问题,你不用关心其内部数弊铅据。

我们直接进入矢量动画部分。

矢量动画的实现通过在xml定义<animated-vector>标签(其对应的Java对象是AnimatedVectorDrawable)实现,如下所示:

可以看到<animated-vector>标签是主要元素是target,它其实就起到一个桥梁作用,将动画和VectorDraw中的图形联系起来。

比如target1,它将属性动画splash_animator_draw和vectorDrawble对象中name等于line1的对象联系租袜好起来,即:动画将生效在line1对象上。

之前展示了由svg图片通过Android Studio Vector Assert工具转换过来的VectorDrawble,里面的实际上svg画图语好毕法,<path>标签里的pathData包含了画图的路径(坐标)和语法

在实际使用过程中有几率遇到这样两个问题(笔者都遇到过):

其实以上两个问题都要求你掌握进阶知识,svg画图语法。

官方svg语法解析: https://www.w3.org/TR/SVG/paths.html

不喜欢看英文,去这篇博客: http://www.jianshu.com/p/a3cb1e23c2c4

对于Android程序员,Lottie的动画使用很简单,步骤如下:

1.接入Lottie

从动画实现上来说,Lottie动画应该是最简单的方法了。

Lottie的优点很明显:

Lottie的缺点:

好了,如果觉得本文对你有帮助,请关注、留言、点赞我,谢谢!


欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/yw/12331337.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-05-24
下一篇 2023-05-24

发表评论

登录后才能评论

评论列表(0条)

保存