Lottie 在 Android中的用法初探

发表于 | 分类于 | | 阅读次数 | 浏览 次

一、概述

  • Lottie 是一个由 Airbnb 开源的第三方动画库，它能够同时支持 iOS，Android 与 ReactNative 的开发；

  • Lottie 通过 AE ( After Effects ) 中的 Bodymovin 插件将 AE 中制作好的动画导出成一个 json 文件，这个 json 文件就是我们需要的动画。

  • 在 github 上有几种动画效果和源码介绍：https://github.com/airbnb/lottie-android

  • CSDN 上也有一篇博文讲的不错：http://blog.csdn.net/trojx2/article/details/54896899

二、 AE 是什么

  • 反正本人刚看到这个词的时候一脸懵逼，还专门去搜索了 - -！

  • Adobe After Effects ，没错，就是这个软件，由 Adobe 公司提供更新的，目前最新版本为 CC(13.5)。

  • 由上边的这个软件来制作动画，然后导出为 json 格式的文件。

    三、用法

本人目前并不会使用 AE ，而且， AE 还是收费软件，所以就在 github 上找了 json 文件，以写 demo 的形式来练习使用

1、 在概述中的 github 中找到 sample 文件中的 app/src/main/assets 目录下的 json 文件，随便选择一个，导入到自己项目的 assets 文件夹下
2.在 app 的 build.gradle 中 添加如下依赖：
1
2
3
dependencies {  
  compile 'com.airbnb.android:lottie:2.0.0-beta4'
}
3. 在布局文件中添加使用
1
2
3
4
5
6
7
8
<com.airbnb.lottie.LottieAnimationView
    android:id="@+id/lottie"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    app:lottie_fileName="hello_AE.json"
    app:lottie_loop="true"
    app:lottie_autoPlay="true"
    />

也可以在代码中使用，但是不知道为嘛代码方式老是找不到 assets 目录中的 json 文件

未完待续