美文网首页
Lottie-android动画介绍与使用

Lottie-android动画介绍与使用

作者: small_tadpole | 来源:发表于2020-01-17 15:30 被阅读0次


    一. Lottie动画为什么会出现?

        1.为Android,iOS和React Native应用程序构建复杂的动画是一个艰难而漫长的过程,且维护困难,实现效果可能不一致,达不到设计师想要的效果.

        2.使用图片或者代码生成的动画一般比较简单,很难完成复杂的动画.

        3. 需求变更版本迭代会导致维护困难.

            考虑到以上一些原因,Airbnb公司推出了Lottie开源库

    二. Lottie动画的优缺点

    优势:

        1.跨平台,不同端共用一套动画.支持Android, iOS, React Native, Web, and Windows

        2.动画由UI设计师通过After Effects软件制作,并由Bodymovin插件导出为JSON文件的动画数据,百分百符合设计师设计的效果,减少了沟通成本.

        3. 支持多渠道加载动画,比如本地资源文件Assets,存储卡,网络等,可在线更新动画.

        4 使用简单,开发者可以轻松控制动画的播放速度,播放进度,是否重复播放,播放帧数,背景颜色等等

        5 对apk体积影响很小,未压缩情况下,增加apk包体积110k左右,压缩后为45k左右

    劣势: 

        1.Lottie动画在未开启硬件加速的情况下,帧率、内存,CPU都比属性动画差,开启硬件加速后,性能差不多。

    看到如此精美的动画,是不是有些心动呢? 赶紧来体验下吧

    三  Lottie-android的使用

        1.app module的build.gradle引入依赖:

            dependencies {

                    implementation'com.airbnb.android:lottie:$lottieVersion'    //目前最新的是3.3.1版本

               }

    特别注意(有坑):

            Lottie 2.8.0 and above only supports projects that have been migrated to androidx.

            2.8+以上版本需要在AndroidX项目中才可用,如果你的项目没有升级到AndroidX,最高可用版本是2.7.0.同时使用的动画必须是Bodymovin插件5.5以前版本导出的动画,才可以正常使用.或者如果设计师已经升级了Bodymovin插件,那么让她导出json格式的时候,选择导出兼容版本的json动画.

            2. 准备好设计师提供的动画导出的gson文件,放置在src/main/assets(没有目录则自己创建该目录)文件夹下

                        ps: 我只是想使用,设计师也不会制作,怎么办? 去lottie社区下载吧

            3 开发简单使用

                方法一:  在xml布局中使用

                方法二: xml布局只放置控件,代码控制使用

                        

            此外,Lottie还有很多高级使用方法,各位有兴趣的话,自己慢慢去探索吧.

    参考文章:

    lottie官方介绍

    Android Lottie动画使用

    相关文章

      网友评论

          本文标题:Lottie-android动画介绍与使用

          本文链接:https://www.haomeiwen.com/subject/yopczctx.html