Lottie踩坑记
最近项目里面Lottie用的比较多，但是在使用的时候发现一些问题，今天先讲一个。
Toggle动画
类似这样的组件，我们应该用的很多，比如一些开关Switch，一些状态切换，比如Toggle button，这些组件我们要设置动画，就可以借助Lottie来做一些比较酷炫的动画效果。
问题
一般这样的动画，json文件是这样的，从Off状态，到On状态做一个切换效果，toggle的时候，我们需要从Off到On，或者从On到Off，这就需要对这个动画json做正向Play和逆向Play。这个时候问题就来了，Android Lottie SDK并不支持完美的逆向Play，相关的文档也几乎没有，如果拆成两个json文件，一个正向，一个逆向，可以是可以，但是在切换过程中，会有一些闪，效果不是很好，而iOS SDK那边，竟然提供了一个LOTAnimatedSwitch的组件，直接就可以完成这样的Toggle操作，而Android这边，竟然只有一个LottieAnimationView可以使用，两边的API居然都不同步。。。
解决
解决方案找了很久，最后在LottieAnimationView的注释中，找到了相应的解决方案，直接上代码了，简单来说，就是setSpeed和setProgress两个方法的组合使用，我们来看看注释。
/**
* Sets the playback speed. If speed < 0, the animation will play backwards.
*/
public void setSpeed(float speed)直接上代码了，已经封装好了。
/**
* Created by XuYisheng .
* <p>
* Lottie实现Toggle效果（Lottie文件需要满足:初始是On状态，结束是Off状态）
*/
public class LottieToggleAnimateView {
private LottieAnimationView mAnimationView;
/**
* 基本使用方法
* LottieToggleAnimateView lottieToggleAnimateView = new LottieToggleAnimateView(lottieAnimationView, true);
* 切换状态时调用toggle()
*
* @param animationView LottieAnimationView
* @param isOn 初始状态是否是On
*/
public LottieToggleAnimateView(LottieAnimationView animationView, boolean isOn) {
mAnimationView = animationView;
mAnimationView.useHardwareAcceleration(true);
float progress;
if (isOn) {
progress = 1F;
} else {
progress = 0F;
mAnimationView.setSpeed(-mAnimationView.getSpeed());
}
mAnimationView.setProgress(progress);
}
/**
* 切换状态
*/
public void toggle() {
mAnimationView.setSpeed(-mAnimationView.getSpeed());
if (!mAnimationView.isAnimating()) {
mAnimationView.playAnimation();
}
}
}注释应该写的很清楚了，用LottieToggleAnimateView包装一下LottieAnimationView就可以了。
本文参与 腾讯云自媒体分享计划，分享自微信公众号。
原始发表：2018-08-03，如有侵权请联系 cloudcommunity@tencent.com 删除
评论
登录后参与评论
推荐阅读
目录