Lottie簡單使用

現在使用各平台的 native **實現一套複雜的動畫是一件很困難並且耗時的事，我們需要為不同尺寸的螢幕載入不同的素材資源，還需要寫大量難維護的**，而lottie可以做到同乙個動畫檔案在不同平台上實現相同的效果，極大減少開發時間，實現不同的動畫，只需要設定不同的動畫檔案即可，極大減少開發和維護成本。

lottie 官網：

執行時效率上僅僅用canvas去draw而已，流暢度非常棒，所以哪怕在listview裡去大量顯示，記憶體占用和繪圖效率都遠遠高於幀動畫。

實現效果可以按設計出的100%還原到產品中

開發周期大大減少

dependencies

直接布局載入*.json檔案的方法：

lottie_filename表示本地assets檔案中存的json動畫檔案 lottie_loop表示動畫迴圈執行 2. **載入動畫方法 android:id= "@+id/animation_view" android:layout_width= "wrap_content" android:layout_height= "wrap_content" "hello-world.json" "true" "true" />

//宣告控制項
lottieanimationview =
findviewbyid
(r.id.animation_view)
;//這個可有可無，如果不涉及本地做動畫可忽略
lottieanimationview.
setimageassetsfolder
("images");
//設定動畫檔案
lottieanimationview.
setanimation
(".json");
//是否迴圈執行
lottieanimationview.
loop
(true);
//執行動畫
lottieanimationview.
playanimation()
;

載入網路.json檔案

private void loadurl(string url) 
@override public void onresponse(call call, response response) throws ioexception 
});} catch (jsonexception e) 
}});
}

animationview.pauseanimation(); 暫停動畫

animationview.cancelanimation(); 取消動畫

animationview.setprogress(progress); 設定進度,progress範圍0~1

監聽動畫進度

設定動畫硬體加速

快取動畫

lottie本身在 android 平台已經做了適配工作，而且適配原理很簡單，解析時，從讀取寬高之後會再乘以手機的密度。再在使用的時候判斷適配後的寬高是否超過螢幕的寬高，如果超過則再進行縮放。以此保障 lottie 在 android 平台的顯示效果使用lottie超過2.8.0版本必須相容androidx，api28

使用lottie2.0系列的必須通知設計匯出json檔案的時候相容舊版本，如下圖：

機型適配問題需要注意：對於需要落到固定位置的動畫，切記一定要讓設計標出動畫的尺寸

Lottie簡單使用

UWP 在UWP平台中使用Lottie動畫

iOS 動畫實戰之Lottie動畫

Lottie動畫庫最新版使用方法詳解教程示例

Lottie簡單使用

UWP 在UWP平台中使用Lottie動畫

iOS 動畫實戰之Lottie動畫

Lottie動畫庫最新版使用方法詳解 教程 示例

相關推薦

Lottie動畫庫最新版使用方法詳解教程示例