Android 动画之Lottie动画应用

一:简介
Lottie是Airbnb开源的一套跨平台的残缺解决方案,设计师只须要应用After Effects(简称AE)设计动画之后,应用Lottic提供的Bodymovin插件将设计好的动画导出成JSON格局,就能够间接iOS,Android和React Native之上,无需关怀两头的实现细节。

二:Android下应用Lottie
1.增加依赖在app下的build.gradle下增加
//lottie
implementation 'com.airbnb.android:lottie:3.4.4'
2.把动画的JSON文件,放在app/src/main/assets目录下

JSON字符串的最外层的构造

{    "v": "4.6.0",               //bodymovin的版本    "fr": 29.9700012207031,     //帧率    "ip": 0,                    //起始关键帧    "op": 141.000005743048,     //完结关键帧    "w": 800,                   //动画宽度    "h": 800,                   //动画高度    "ddd": 0,     "assets": [...]             //资源信息    "layers": [...]             //图层信息}

3.最简略的应用是间接应用LottieAnimationView,LottieAnimationView 间接继承自 AppCompatImageView在Layout布局文件中

<com.airbnb.lottie.LottieAnimationView android:layout_width="wrap_content" android:layout_height="wrap_content" app:lottie_autoPlay="true" app:lottie_fileName="draw_rose.json" app:lottie_loop="true"/>

它反对几个属性:
lottie_fileName:播放动画的json文件
lottie_loop:是否循环播放,默认为false
lottie_autoPlay:是否加载完之后,自动播放,默认是false
或者代码中实现

LottieAnimationView lottieAnimationView=findViewById(R.id.animation_view);lottieAnimationView.setAnimation("heart.json");lottieAnimationView.loop(true);lottieAnimationView.playAnimation();

3.1增加一个动画监听

lottieAnimationView.addAnimatorListener(new Animator.AnimatorListener() {    @Override public void onAnimationStart(Animator animation) {        Log.d("aa","动画开始"); }    @Override public void onAnimationEnd(Animator animation) {        Log.d("aa","动画完结"); }    @Override public void onAnimationCancel(Animator animation) {        Log.d("aa","动画勾销"); }    @Override public void onAnimationRepeat(Animator animation) {        Log.d("aa","动画每一次调用执行属性动画"); }});

3.2动画里有图片,不仅是画下来的,还有些图片资源应用本地的图片资源,能够应用setImageAssetsFolder("/images");
这个是加载资产目录assets下images目录的图片

设置一个 Lottie 动画中应用到的图片文件夹的相对路径,并确保他们和 bodymovin 插件输入的用到的图片文件名称,放弃不变

3.3从网络上下载图片

lottieAnimationView.setImageAssetDelegate(new ImageAssetDelegate() {    @Nullable @Override public Bitmap fetchBitmap(LottieImageAsset asset) {        return null; }});

3.4缓存

//Lottie外部有两个缓存map(强援用缓存,弱援用缓存),在动画文件加载实现后会依据设置的缓存策略缓存动画,不便下次应用。lottieAnimationView.setAnimation(animation, LottieAnimationView.CacheStrategy.Strong);    //强缓存lottieAnimationView.setAnimation(animation, LottieAnimationView.CacheStrategy.Weak);      //弱缓存

3.5硬件加速,解决lottie卡顿问题

lottieAnimationView.useHardwareAcceleration(true);

LottieFiles网站https://lottiefiles.com/

Github门路:https://github.com/airbnb/lottie-android/tree/v3.4.4