lottie 动画，lottie动画资源

Lottie动画详解

文章目录 Lottie动画详解Lottie的json文件获取Lottie动画实现动画执行过程监听注意事项参考文献Demo实现

Lottie的json文件获取

主要是美工来提供需要的动效json文件

可以参考这篇文章 如何生成动画所需的json文件

Lottie动画实现

app下的build.gradle依赖lottie远程库，截止2021年6月8日10:40:21最新lottie版本为 3.7.0

dependencies { implementation 'com.airbnb.android:lottie:3.7.0'}

有多种使用和加载的方式：

加载res/raw下的.json动效文件 <com.airbnb.lottie.LottieAnimationView android:id="@+id/lottie_view_xml" android:layout_width="100dp" android:layout_height="100dp" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintLeft_toLeftOf="parent" app:layout_constraintRight_toRightOf="parent" app:layout_constraintTop_toTopOf="parent" app:layout_constraintVertical_bias="0" app:lottie_autoPlay="true" app:lottie_loop="true" app:lottie_rawRes="@raw/android_wave" /> 动态加载： lottie_view_xml.apply { setAnimation(R.raw.android_wave) repeatMode = LottieDrawable.REVERSE;//设置播放模式 repeatCount = LottieDrawable.INFINITE;//设置重复次数 playAnimation() } 加载assets下的.json动效文件 <com.airbnb.lottie.LottieAnimationView android:id="@+id/lottie_view_xml" android:layout_width="100dp" android:layout_height="100dp" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintLeft_toLeftOf="parent" app:layout_constraintRight_toRightOf="parent" app:layout_constraintTop_toTopOf="parent" app:layout_constraintVertical_bias="0" app:lottie_autoPlay="true" app:lottie_loop="true" app:lottie_fileName="android_wave.json" /> 动态加载： lottie_view_xml.apply { setAnimation("android_wave.json") repeatMode = LottieDrawable.REVERSE;//设置播放模式 repeatCount = LottieDrawable.INFINITE;//设置重复次数 playAnimation() } 加载 src/main/assets.下的zip文件 <com.airbnb.lottie.LottieAnimationView android:id="@+id/lottie_view_xml" android:layout_width="100dp" android:layout_height="100dp" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintLeft_toLeftOf="parent" app:layout_constraintRight_toRightOf="parent" app:layout_constraintTop_toTopOf="parent" app:layout_constraintVertical_bias="0" app:lottie_autoPlay="true" app:lottie_loop="true" app:lottie_fileName="lottie_zip_test.zip" /> 动态加载： lottie_view_code.apply { setAnimation("lottie_zip_test.zip") repeatMode = LottieDrawable.REVERSE;//设置播放模式 repeatCount = LottieDrawable.INFINITE;//设置重复次数 playAnimation() } 加载json或者zip文件类型的url <com.airbnb.lottie.LottieAnimationView android:id="@+id/lottie_view_xml" android:layout_width="100dp" android:layout_height="100dp" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintLeft_toLeftOf="parent" app:layout_constraintRight_toRightOf="parent" app:layout_constraintTop_toTopOf="parent" app:layout_constraintVertical_bias="0" app:lottie_autoPlay="true" app:lottie_url="https://xxx.com/xxx.json" app:lottie_loop="true" /> 动态加载： lottieAnimationView.setAnimationFromUrl("https://xxx.com/xxx.json");

- 加载json格式的string字符串. 此字符串资源可以是网络下载的

private fun loadLottieFromNetWork() { val jsonString = "{\"assets\":[],\"layers\"........,\"h\":667}" LottieComposition.Factory.fromJsonString( jsonString ) { composition -> animation_view_network.progress = 0f animation_view_network.loop(true) animation_view_network.setComposition(compositio!!) animation_view_network.playAnimation() } } 加载json文件或zip文件的InputStream LottieComposition.Factory.fromInputStream(InputStream,object :OnCompositionLoadedListener{ override fun onCompositionLoaded(composition: LottieComposition?) { TODO("Not yet implemented") } }) 动画执行过程监听 方式1，关注动画执行操控，可以拿到ValueAnimator，在回调内部操控动画 lottie_view_code.addAnimatorUpdateListener {// Log.i(TAG, " it.animatedValue: ${it.animatedValue}")// Log.i(TAG, " it.animatedFraction: ${it.animatedFraction}") if (it.repeatCount == 3) { it.cancel() } //animatedValue 动画执行一次[0,1]的过程,假如设置重复此时5次，则会执行5次 0-1的返回结果 //animatedFraction 动画执行的全过程，假如设置重复此时5次，则执行完第一次返回的值就是0.2，第二次执行完成返回值就是0.4.... } 方式2，关注动画各个时段状态 lottie_view_code.addAnimatorListener(object : Animator.AnimatorListener { override fun onAnimationStart(animation: Animator?) { Log.i(TAG, " onAnimationStart: ") } override fun onAnimationEnd(animation: Animator?) { Log.i(TAG, " onAnimationEnd: ") } override fun onAnimationCancel(animation: Animator?) { Log.i(TAG, " onAnimationCancel: ") } override fun onAnimationRepeat(animation: Animator?) { Log.i(TAG, " onAnimationRepeat: ") } }) 返回动画执行的各个时段状态： 2021-06-08 13:25:52.630 6970-6970/com.nobo.lottie I/wilfried: onAnimationStart: 2021-06-08 13:25:54.726 6970-6970/com.nobo.lottie I/wilfried: onAnimationRepeat: 2021-06-08 13:25:56.752 6970-6970/com.nobo.lottie I/wilfried: onAnimationRepeat: 2021-06-08 13:25:58.785 6970-6970/com.nobo.lottie I/wilfried: onAnimationRepeat: 2021-06-08 13:26:00.818 6970-6970/com.nobo.lottie I/wilfried: onAnimationRepeat: 2021-06-08 13:26:02.869 6970-6970/com.nobo.lottie I/wilfried: onAnimationRepeat: 2021-06-08 13:26:04.904 6970-6970/com.nobo.lottie I/wilfried: onAnimationEnd: 方式3，只关注动画的暂停和恢复状态 lottie_view_code.addAnimatorPauseListener(object : Animator.AnimatorPauseListener { override fun onAnimationPause(animation: Animator?) { Log.i(TAG, " onAnimationPause: ") } override fun onAnimationResume(animation: Animator?) { Log.i(TAG, " onAnimationResume: ") } }) 注意事项 LottieAnimationView的loop方法已过时（也可使用），推荐使用如下方式替换：
repeatMode = LottieDrawable.REVERSE;//设置播放模式
repeatCount = LottieDrawable.INFINITE;//设置重复次数app:lottie_rawRes="@raw/android_wave"
app:lottie_fileName=“android_wave.json”
两种加载方式都可以加载动画，建议使用 app:lottie_rawRes的方式，此方式会使用R文件引用的方式找到android_wave，而app:lottie_fileName只是输入字符串容易出错动画使用完成之后一定要及时取消掉cancelAnimation()可以使用setMinFrame, setMaxFrame,setMinAndMaxFrame或setMinAndMaxProgress来指定循环动画的特定部分，进度(0.0到1.0)
lottie_view_code.setMinAndMaxProgress(0.5f, 0.9f) 参考文献

lottie官方文档
Lottie for Android 实战使用总结
Lottie- 让Android动画实现更简单

Demo实现

https://github.com/WuMaoQiang/nobo_lottie