1. 程式人生 > >Android studio使用Lottie- 讓Android動畫實現更簡單

Android studio使用Lottie- 讓Android動畫實現更簡單

Lottie是什麼?

Lottie是Airbnb開源的一個支援 Android、iOS 以及 ReactNative,利用json檔案的方式快速實現動畫效果的庫。

Demo程式的github地址 :https://github.com/fengwenjing/MyLottieDemo

二、Lottie在Android端怎麼用?
下面是公司美工的工作
  1. 讓設計師使用Adobe 的 After Effects(簡稱 AE)工具(美工一般都會這個)製作這個動畫。
    AE的下載地址可以去官網下載,然後自行破解即可……
  2. 在AE中安裝一個叫做Bodymovin的外掛。
    下載 ,解壓縮後只需要\build\extension\bodymovin.zxp這個檔案就可以


    3.手動安裝plugin,以windows系統而言,要先下載 並解壓縮。
    再來把下載的bodymovin壓縮後的 bodymovin-master\build\extension 目錄下的bodymovin.zxp 這個檔案複製進去同一個資料夾。

4.去找cmd,並以系統管理員身分執行。


5.打“cd C:/ExManCmd_win 所在的路徑 “,進入ExManCmd的資料夾中


6.接著打 ExManCmd.exe /install bodymovin.zxp 就完成了


7.再來進入AE 後,可以在windows/extentions/bodymovin 找到外掛,開啟後按下Render 就完成了。 

重點來了,這時會在你選的Destination Folder目錄中生成一個json格式的檔案,這個 json 檔案描述了該動畫的一些關鍵點的座標以及運動軌跡。


1478641345-4251-svgani7
下面就是苦逼Android程式設計師應該如何做咯

1.在build.gradle中新增

dependencies {  
  compile 'com.airbnb.android:lottie:2.2.0'
}

2.layout檔案中新增

    <com.airbnb.lottie.LottieAnimationView
        android:id="@+id/animation_view"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:lottie_fileName="hello-world.json"
        app:lottie_loop="true"
        app:lottie_autoPlay="true" />

3.將你的json檔案重新命名為xml中lottie_fileName的值,將hello-world.json放入 app/src/main/assets目錄中。打包吧!!

請參考:http://blog.csdn.net/qq_36255612/article/details/77835658

然後你就會發現奇蹟出現了,沒有一張圖片,沒有一個gif,但是動畫效果出來了!就是這麼簡單,就是這麼暴力!