持续创作,加快成长!这是我参加「日新方案 10 月更文应战」的第28天,点击检查活动详情,期望大家多多支撑,帮助点个赞,谢谢!

前言

上节咱们讲述了Lottie开源库怎么导入Android Studio可是,开源库是不断迭代的,所以咱们也要及时更新,这方面能够经过官方得知GitHub – airbnb/lottie-android: Render After Effects animations natively on Android and iOS, Web, and React Native:

让UI忙碌的安卓Lottie动画渲染库(二)
当然安卓假如想更新能够经过这个当地应用更新:

让UI忙碌的安卓Lottie动画渲染库(二)

让UI忙碌的安卓Lottie动画渲染库(二)

更新的问题解决后,咱们来说说怎么在安卓开发中运用它。

正篇

逻辑代码控制根底

播映动画

首要,上节咱们已经讲述了怎么在布局中运用,但在咱们逻辑代码上也有控制逻辑,便利咱们更好的控制动画,而不是xml上那几个特点:
榜首步,先调用setAnimation()和playAnimation()办法去完成播映咱们的动画

LottieAnimationView vGif = findViewById(R.id.lt_gift);
// 代码设置动画文件
vGif.setAnimation("lottie/gift.json");
// 开端播映动画,首次播映会有短暂推迟,因为加载动画文件需求时间
vGif.playAnimation();

题外话-JSON动画文件的获取办法

上述代码中用到的gift.json文件需求UI设计师去供给,当然或许UI设计师也不知道怎么去做,也有或许咱们是在家中学习,没有UI设计师帮你做JSON动画文件,所以下面先插个论题。
UI设计师或是在家实践的掘友们能够经过三种办法获取到咱们Lottie库可用的JSON动画文件:
榜首个办法过程如下:先从AE导出Json文件,Lotti 解析Json文件后调Core Animation的API制作烘托,这个办法适合会运用AE的专业UI设计师。
假如不会AE,那就能够用第二个办法:
拜访由DesignBarn公司推出的Lottie动画社区,查找咱们需求的动画,不只能够下载还支撑修改、预览、生成GIF等功能
或第三个办法:
便是运用咱们国内的平台,拜访由阿里供给的犸良平台,相同能创建动画并支撑支付宝扫描预览。

让UI忙碌的安卓Lottie动画渲染库(二)

让UI忙碌的安卓Lottie动画渲染库(二)
作者比较菜,还不能去包办UI的活,所以在家实际只能去运用第二个办法找现成的资源: Featured animations from our community (lottiefiles.com) 点击下载,前面两个选项都行,后一种是愈加节省控件提高效率的新版推荐办法,不过要钱,作者体验当然选榜首个下载办法
让UI忙碌的安卓Lottie动画渲染库(二)
下载好Lottie的JSON格式文件重命名成你想要的,然后在项目的app下的main文件夹创建assets文件夹和子文件夹lottie放入咱们的json:

让UI忙碌的安卓Lottie动画渲染库(二)
让UI忙碌的安卓Lottie动画渲染库(二)

回归正题-逻辑控制办法说明

监听动画流程办法

这样咱们就能够正常的调起动画了,此外还供给了监听动画事情的办法,这儿代码是进展监听的办法:

vGif.addAnimatorUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
    @Override
    public void onAnimationUpdate(ValueAnimator animation) {
        float progress = animation.getAnimatedFraction();//播映进展
        // TODO:
    }
});

咱们能够运用addAnimatorListener()办法以监听动画开端、完毕、撤销、重复等事情:

    vGif.playAnimation();  //播映
    vGif.pauseAnimation(); //暂停
    vGif.cancelAnimation(); //撤销
    vGif.getDuration();  //获取动画时长
    vGif.addAnimatorListener(new Animator.AnimatorListener() { //增加动画监听
      @Override
      public void onAnimationStart(Animator animation) {
      }
      @Override
      public void onAnimationEnd(Animator animation) {
      }
      @Override
      public void onAnimationCancel(Animator animation) {
      }
      @Override
      public void onAnimationRepeat(Animator animation) {
      }
    });

设置动画进展办法

咱们能够调用setProgress()办法去直接设置去动画哪个当地画面展现:

LottieAnimationView vGif = findViewById(R.id.lt_gift);
// 代码设置动画文件
vGif.setAnimation("lottie/gift.json");
// 不需求调用playAnimation,可直接展现该进展的动画作用
vGif.setProgress(0.5f);

还能调用addLottieOnCompositionLoadedListener()办法监听JSON文件加载完成,知晓动画何时开端加载:

vGif.addLottieOnCompositionLoadedListener(new LottieOnCompositionLoadedListener() {
    @Override
    public void onCompositionLoaded(LottieComposition composition) {
        //此刻烘托了动画榜首帧
    }
});

其他办法

这儿再列举两个其他办法: 榜首种,动画是否选用硬件加快,这个在制作图片的时候应该就了解过,有些当地安卓硬件加快不太适配:

让UI忙碌的安卓Lottie动画渲染库(二)

让UI忙碌的安卓Lottie动画渲染库(二)

// 硬件加快开关(默认RenderMode.Automatic,选用硬件加快,而软件加快为RenderMode.SOFTWARE)
vGif.setRenderMode(RenderMode.HARDWARE);

下面这个办法仍是运用Lottie动画时比较容易运用到的,能够调用setAnimationFromUrl()办法运用url将JSON文件经过网络下载的办法加载动画,不过要考虑一些性能问题,贵在灵活可装备,也是点睛之笔:

// 将json文件下载到本地,再进行烘托,需求考虑耗时长的状况
vGif.setAnimationFromUrl("");

可配合网络url装备,不需求下载到本地:

让UI忙碌的安卓Lottie动画渲染库(二)

此外,还能够运用LottieCompositionCache缓存机制,能够加快加载动画,不过作者还菜,现在还没看源码和各大博主的办法,所以仅在此提及

追随时髦,选用Kotlin写法

除了经典Java写法,这儿再附上作者自己在学的Kotlin写法,自己写的,没有校验,如有不标准之处望请指教:

val vGif : LottieAnimationView = findViewById(R.id.lt_gift);
vGif.setAnimation("lottie/gift.json")
vGif.addAnimatorUpdateListener { animation ->
    var progress = animation.animatedFraction;//播映进展
    //TODO:
}
vGif.playAnimation() //播映
vGif.pauseAnimation() //暂停
vGif.cancelAnimation() //撤销
vGif.duration //获取动画时长
vGif.addAnimatorListener(object : Animator.AnimatorListener {
    //增加动画监听
    override fun onAnimationStart(animation: Animator) {}
    override fun onAnimationEnd(animation: Animator) {}
    override fun onAnimationCancel(animation: Animator) {}
    override fun onAnimationRepeat(animation: Animator) {}
})
// 不需求调用playAnimation,可直接展现该进展的动画作用
vGif.progress = 0.5f;
vGif.addLottieOnCompositionLoadedListener {
    //此刻烘托了动画榜首帧
}
// 硬件加快开关(默认RenderMode.Automatic,选用硬件加快,而软件加快为RenderMode.SOFTWARE)
vGif.renderMode = RenderMode.HARDWARE;
// 将json文件下载到本地,再进行烘托,需求考虑耗时长的状况
vGif.setAnimationFromUrl("");

作用展现

最后放一下作用展现:

让UI忙碌的安卓Lottie动画渲染库(二)
怎么样,还不错吧!其实假如仅仅只是加载动画,上一节就够用(让UI繁忙的安卓Lottie动画烘托库(一) – ()),毕竟放在XML布局上就能够正常运用了,仍是十分好用的,便是有点费UI设计师。 另外要注意安卓xm布局中运用开源库要在整体布局的开头加一句:

xmlns:app="http://schemas.android.com/apk/res-auto"

让UI忙碌的安卓Lottie动画渲染库(二)
不然运用app: 语句会报红哦!

总结

尽管Lottie运用办法很简单,但要说明这些办法的运用和学习,导致本篇文章很长,这儿基本上将我网上所能找到都找了一遍,再结合源码阅览纠正,虽然或许有遗失,可是结合作者体验,应该都是正确的,耗费了作者很多时间,但也便利了今后回忆以及持续学习的掘友们,期望大家能点点赞,多和作者交流沟通,纠正作者的问题,感谢各位观看支撑!