android导航栏动画,Android 带Lottie动画的导航栏

什么是Lottie动画

Lottie 是Airbnb开源的一个面向 iOS、Android、React Native 的动画库，能分析 Adobe After Effects 导出的动画，并且能让原生 App 像使用静态素材一样使用这些动画，完美实现动画效果，动画效果比原生动画要优美很多。Lottie动画由UI提供，UI给到我们的是xxx.json文件，这个文件就是动画文件。

优点：动画效果好，灵活，导入方便，使用简单，可以从网络下载，支持多平台。

缺点：性能没有属性动画好。

导入Lottie动画库

github地址

在app build.gradle 中导入

implementation 'com.airbnb.android:lottie:$lottieVersion'

$lottieVersion 为版本号。

注意2.8.0及之后的版本加入了android x, 如果你的项目没有使用android x ，要使用2.8.0之前的版本，否则会编译失败

Lottie 2.8.0 and above only supports projects that have been migrated

to androidx.

导入动画文件

在 main文件夹下创建assets文件夹，将json文件放入assets文件夹下。需要确认json中是否包含本地文件路径，例如 img0/image1.png，如果存在，需要将本地图片按路径存储，否则运行会报错。

代码中实现动画播放

关键类 LottieAnimationView ，LottieDrawable 。此类实现Lottie动画的配置及控制。

LottieAnimationView继承AppCompatImageView，所以它是支持Lottie的Imageview。

mLottieView.setImageAssetsFolder("image0"); //设置本地文件路径

mLottieView.setRepeatCount(0); //设置重复次数，默认0

mLottieView.setAnimation(mAnimationPath);//mAnimationPath 是动画json文件的相对路径

mLottieView.playAnimation();//播放动画

//其他属性自行搜索

以上配置也可以在xml中配置。

app:lottie_fileName="xxx.json"

app:lottie_repeatCount="0"

app:lottie_imageAssetsFolder="image0"//其他属性自行搜索

导航栏实现

新建自定义控件 LottieTabView

public class LottieTabView extends FrameLayout {

private int mTextNormalColor;

private int mTextSelectColor;

private float mTextSize;

private String mTabName;

private Drawable mIconNormal;

private String mAnimationPath;

private LottieAnimationView mLottieView;

private TextView mTabNameView;

private TextView mMsgView;

private boolean