Lottie——复杂动画的实现工具


最近学习动画,了解到Android的LottieGitHub源码

常用方法

  1. 监听动画进度
 lottieAnimationView.addAnimatorUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
        @Override
        public void onAnimationUpdate(ValueAnimator valueAnimator) {
            // 判断动画加载结束
            if (valueAnimator.getAnimatedFraction() == 1f) {
                if (dialog.isShowing() && getActivity() != null)
                    dialog.dismiss();
            }
        }
    });
  1. 暂停/取消/播放
lottieAnimationView.pauseAnimation();
lottieAnimationView.cancelAnimation();
lottieAnimationView.playAnimation();
  1. 循环/播放某个部分
lottieAnimationView.loop(true);

播放动画某个部分

setMinFrame(...)
setMaxFrame(...)
setMinProgress(...)
setMaxProgress(...)
setMinAndMaxFrame(...)
setMinAndMaxProgress(...)
  1. 硬件加速
lottieAnimationView.useHardwareAcceleration(true)
  1. 缓存问题

按照GC的引用强度,可以划分为强引用缓存和弱引用缓存

// 在动画文件加载完成后会根据设置的缓存策略缓存动画,方便下次使用
lottieAnimationView.setAnimation(animation, LottieAnimationView.CacheStrategy.Strong);    //强缓存

lottieAnimationView.setAnimation(animation, LottieAnimationView.CacheStrategy.Weak);      //弱缓存

根据进度缓存,为下次播放作准备

lottieAnimationView.setProgress(progress);        //设置当前进度
lottieAnimationView.buildDrawingCache();          //强制缓存绘制数据
Bitmap image = lottieAnimationView.getDrawingCache(); //获取当前绘制数据

优缺点

😊优点:

  • 支持多平台,可在不同的平台实现相同的效果

参考文章:


Author: Casey Lu
Reprint policy: All articles in this blog are used except for special statements CC BY 4.0 reprint polocy. If reproduced, please indicate source Casey Lu !
评论
 Previous
原生JS实现帧动画 原生JS实现帧动画
所谓帧动画就是在连续的关键帧中分解动画动作,也就是在时间轴的每一帧上面逐帧绘制出不同的内容,使得其能够连续播放而成为动画 常见的帧动画 Gif CSS animation Javascript 前两者实现帧动画存在着不足: 不能灵活
2020-06-26
Next 
React之高阶组件 React之高阶组件
高阶函数: 函数可以作为参数被传递 函数可以作为返回值被输出 高阶组件: 接受一个组件作为参数,并返回一个新组件 高阶组件的本质是函数非组件 高阶组件的定义 高阶组件的使用 higherOrderComponent(Wr
2020-05-26
  TOC