Android 学习使用Lottie动画库

   日期:2020-07-13     浏览:96    评论:0    
核心提示:Android Lottie动画库最近工作上面需要所以导入了一个Android的动画库Lottie ,这篇博客主要是为了记载一下这个动画库,以及动画库的简单的用法。简单的来说下这个lottie动画库Lottie是适用于Android和iOS的移动库,它可以使用Bodymovin解析以json 格式导出的Adobe After Effects动画,并在移动设备上进行本地渲染!(官方的github上是这么说的)我这里给上github的地址https://github.com/airbnb/lottie

Android Lottie动画库

最近工作上面需要所以导入了一个Android的动画库Lottie ,这篇博客主要是为了记载一下这个动画库,以及动画库的简单的用法。

简单的来说下这个lottie动画库
Lottie是适用于Android和iOS的移动库,它可以使用Bodymovin解析以json 格式导出的Adobe After Effects动画,并在移动设备上进行本地渲染!(官方的github上是这么说的)

我这里给上github的地址
https://github.com/airbnb/lottie-android

不要聊了!不要聊了!先上图。

Lottie优势
1、开发可以不用写动画了,而且是那些复杂的动画。
2、Android, iOS, 和React Native多平台支持。
3、性能好,显示效果完美。

Lottie劣势
1、苦了UI,对AE使用要求高一点, 动画更加依赖设计师

怎么使用
导入动画库,github上面有新的自己去写版本号,我用的是他现在最新的

implementation 'com.airbnb.android:lottie:3.4.1'

把UI给你们的json动画文件放进你的assets文件夹中间

你如果只是做一下测试没得UI给你整这个json文件的话
这里可以白嫖(Lottie社区)

第一种方式布局里面直接使用就行了

 <com.airbnb.lottie.LottieAnimationView
        android:id="@+id/loading_animation"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_gravity="center_horizontal"
        app:lottie_fileName="my_card.json"
        app:lottie_loop="true"
        app:lottie_autoPlay="true"/>
app:lottie_fileName="my_card.json"

这里可以直接设置动画的文件。

第二种方式代码里面设置

LottieAnimationView loading_animation = (LottieAnimationView) findViewById(R.id.loading_animation);
loading_animation.setAnimation("my_card.json");
loading_animation.loop(true);
loading_animation.playAnimation();
loadingAnimation.addAnimatorListener(new Animator.AnimatorListener() {
            @Override
            public void onAnimationStart(Animator animation) {
                MyLoge.addLoge("loadingAnimation","start");
            }

            @Override
            public void onAnimationEnd(Animator animation) {
                MyLoge.addLoge("loadingAnimation","end");
            }

            @Override
            public void onAnimationCancel(Animator animation) {
                MyLoge.addLoge("loadingAnimation","Cancel");
            }

            @Override
            public void onAnimationRepeat(Animator animation) {
                MyLoge.addLoge("loadingAnimation","Repeat");
            }
        });

里面还有很多的方法可以自己去试一试!

 
打赏
 本文转载自:网络 
所有权利归属于原作者,如文章来源标示错误或侵犯了您的权利请联系微信13520258486
更多>最近资讯中心
更多>最新资讯中心
0相关评论

推荐图文
推荐资讯中心
点击排行
最新信息
新手指南
采购商服务
供应商服务
交易安全
关注我们
手机网站:
新浪微博:
微信关注:

13520258486

周一至周五 9:00-18:00
(其他时间联系在线客服)

24小时在线客服