前言

我们都知道，安卓里面有三种基本的播放动画方式：
帧动画，属性动画，补间动画
今天介绍一种新的实现方式：Lottie动画
Lottie是爱彼迎开源的一个动画框架。可以支持iOS、Android 和 React Native ，
可实时渲染 After Effects 动画，让应用程序使用动画就像使用静态图像一样轻松。
这波博客主要介绍基本的使用，文末也会贴上相关的资料

导入方式

导入依赖的方式比较简单：

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

我这里用的是5.2.0的版本

基本使用

Lottie动画支持XML配置和代码配置，如果要在xml里面写，就可以像这样：

    <com.airbnb.lottie.LottieAnimationViewandroid:id="@+id/animationView1"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_gravity="center"android:scaleType="centerInside"app:lottie_autoPlay="true"app:lottie_fileName="anim/item_gift_jd_new_selected/index.json"app:lottie_imageAssetsFolder="anim/item_gift_jd_new_selected/images"app:lottie_loop="true" />

其实LottieAnimationView继承的也就是一个AppCompatImageView
常用的xml属性有：
lottie_fileName ：在app/src/main/assets目录下的动画,以json文件名。
lottie_rawRes：存放在app/src/main/res/raw 目录下的json动画
app:lottie_rawRes，app:lottie_fileName这两个属性基本相似。
lottie_loop：动画是否循环播放，默认不循环播放。
lottie_autoPlay：动画是否自动播放，默认不自动播放。
lottie_imageAssetsFolder：动画所依赖的图片目录，在app/src/main/assets/目录下的子目录，该子目录存放所有图片。
lottie_colorFilter ：设置动画的着色颜色
lottie_repeatCount ：重复次数，当你设置-1的时候就代表相应的循环了！
lottie_scale ：设置动画的比例
lottie_repeatMode：设置动画的重复模式RESTART：重复、REVERSE：反向

当然，更多的动态配置还是可以在代码里写的，比如这样：

        LottieAnimationView animationView1 = findViewById(R.id.animationView1);animationView1.setImageAssetsFolder("anim/item_gift_jd_new_selected/images");animationView1.setAnimation("anim/item_gift_jd_new_selected/index.json");

还有一些基本的API如下：
加载网络的资源
setAnimationFromUrl(String url)
设置循环次数
setRepeatCount(int count)
设置循环模式（LottieDrawable.INFINITE,LottieDrawable.RESTART,LottieDrawable.REVERS，默认RESTART）
setRepeatMode(int)
是否无限循环
loop(boolean loop)
设置最大帧和最小帧
（1.frame从0开始计算
2.播放的帧范围为：[minFrame, maxFrame)，不包含第maxFrame帧）
setMinAndMaxFrame(int minFrame, int maxFrame)
播放
lottieAnimationView.playAnimation()
暂停播放
lottieAnimationView.pauseAnimation()
取消播放
lottieAnimationView.cancelAnimation()
重启动画
animationView.resumeAnimation();
设置X轴方向上的缩放比例，0f为不可见，1f原始大小 Ps.原setScale方法在2.0.0版本后已弃用
animationView.setScaleX(0.5f)
设置Y轴方向上的缩放比例
animationView.setScaleY(0.5f)
Lottie内部有两个缓存map（强引用缓存，弱引用缓存），在动画文件加载完成后会根据设置的缓存策略缓存动画，方便下次使用。
lottieAnimationView.setAnimation(animation, LottieAnimationView.CacheStrategy.Strong) //强缓存
lottieAnimationView.setAnimation(animation, LottieAnimationView.CacheStrategy.Weak) //弱缓存
LottieAnimationView.CacheStrategy.None) //默认
设置当前进度
lottieAnimationView.setProgress(progress)
强制缓存绘制数据
lottieAnimationView.buildDrawingCache()
获取当前绘制数据
Bitmap image = lottieAnimationView.getDrawingCache()
Lottie动画还提供了很多监听的api，下面继续介绍

常用监听方法

addLottieOnCompositionLoadedListener：动画加载完成监听
setFailureListener:动画加载失败回调
addAnimatorUpdateListener：动画进度监听回调
addAnimatorListener：同上，只不过上面是监听具体的值，这边是有四个回调方法（start，end，cance，repeat）
addAnimatorPauseListener:只关注暂停和恢复的回调

优缺点

优点：
1.由于将动画变成了json字符串，相比几M体积的gif图，等质量下的压缩率达到80%及以上。
2.支持云端动画资源加载，上线新的动画效果不需要发版
3.支持实时渲染 After Effects 动画，让 app 加载动画像加载图片一样简单。
4.因为Lottie是利用json文件生成动画，从而避免了不同分辨率、不同设备尺寸上面动画效果存在差异的问题。
5.拿到动画.json文件后，研发可以灵活的自行修复动画的颜色、路径等数据，自行扩展
6.拥有完整丰富的API，除了常规的播放、控制进度、暂停控制，还可以缓存、添加额外的原生UI
7.在未开启硬件加速的情况下，帧率、内存，CPU都比属性动画差，开启硬件加速后，性能差不多。

缺点：
1.Lottie尚不支持效果菜单中的表达式或任何效果。
2.使用alpha遮罩会影响性能。如果你使用的是alpha遮罩或alpha倒置遮罩，遮罩的大小会对性能产生更大的影响。
3.Lottie还不支持阴影，颜色叠加或笔触等图层效果。

（原创）Lottie动画使用介绍

前言

导入方式

基本使用

常用监听方法

优缺点

相关资料

（原创）Lottie动画使用介绍相关推荐

最新文章

热门文章