一. Lottie 是什么

首先這個庫是做什么的？

通過 AE 上的 Bodymovin 插件將 AE 中制作好的動畫導出成一個 json 文件，Lottie 實現了 Android/iOS/React Native 三個平臺對該 json 文件的解析和渲染。

可能看到這里你該有疑問了，那 Bodymovin 插件從何而來？

bodymovin從項目介紹上看是一個個人庫，它的主要功能是將 AE 導出的動畫在 Web 端執行。所以 Airbnb 做的主要工作是將該項目擴展到移動端。

二. 優點

它最大的優點是提供了一套完整的跨平臺的動畫實現工作流。

試想一下，以往要實現一個動畫，我們需要多端各自實現且動畫的復雜度受時間成本和開發者能力的約束。現在，通過這套流程我們可以將 AE 中的動畫很輕松得在 web 端、移動端顯示出來，這大大提高了動畫的開發效率及減輕工作量。

其次，相對于類似的實現方案GIF、手寫動畫、幀動畫而言，這個方案更為輕量，性能和存儲上都更佳

從代碼上看，Android 端的實現是基于 Drawable、iOS 端是基于 Layer —— 最終都是對 canvas 的操作，中間除去解析 json 外，基本無耗費性能的行為。(官方文檔有提到，masks 和 mattes 動畫較為耗費性能，原因是需要額外的 Bitmap 輔助，這點需注意)

而存儲上，動畫由 json 文件描述，占用空間不多。

三. 適用場景

1.啟動(splash)動畫：典型場景是APP logo動畫的播放

2.上下拉刷新動畫：所有APP都必備的功能，利用 Lottie 可以做的更加簡單酷炫了

3.加載(loading)動畫：典型場景是網絡請求的loading動畫

4.提示(tips)動畫：典型場景是空白頁的提示

5.按鈕(button)動畫：典型場景如switch按鈕、編輯按鈕、播放按鈕等按鈕的切換過渡動畫

6.禮物(gift)動畫：典型場景是直播類APP的高級動畫播放

7.視圖轉場動畫

四. 仍然存在的問題

1. Bodymovin 插件待完善，仍然有部分 AE 效果無法成功導出；

2. Lottie 對 json 文件的支持待完善，目前有部分能成功導出成 json 文件的效果在移動端上無法很好的展現；

3. 目前不支持文字，所有文字必須轉成矢量圖才能正常展現動畫；

4. 動畫無法被編輯，即移動端無法更改遠端下載到本地的動畫；

5.安卓需要API 16及以上，iOS需要iOS8及以上。

demo

下拉刷新demo

總結

以上是生活随笔為你收集整理的ios html下拉刷新,Lottie_ios 实现下拉刷新的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。