一. Lottie動畫為什么會出現(xiàn)?
????1.為Android饿悬,iOS和React Native應(yīng)用程序構(gòu)建復(fù)雜的動畫是一個艱難而漫長的過程,且維護困難,實現(xiàn)效果可能不一致,達不到設(shè)計師想要的效果.
????2.使用圖片或者代碼生成的動畫一般比較簡單,很難完成復(fù)雜的動畫.
????3. 需求變更版本迭代會導(dǎo)致維護困難.
? ? ????考慮到以上一些原因,Airbnb公司推出了Lottie開源庫
二.?Lottie動畫的優(yōu)缺點
優(yōu)勢:
? ? 1.跨平臺,不同端共用一套動畫.支持Android, iOS, React Native, Web, and Windows
? ? 2.動畫由UI設(shè)計師通過After Effects軟件制作,并由Bodymovin插件導(dǎo)出為JSON文件的動畫數(shù)據(jù),百分百符合設(shè)計師設(shè)計的效果,減少了溝通成本.
? ? 3. 支持多渠道加載動畫,比如本地資源文件Assets,存儲卡,網(wǎng)絡(luò)等,可在線更新動畫.
? ? 4 使用簡單,開發(fā)者可以輕松控制動畫的播放速度,播放進度,是否重復(fù)播放,播放幀數(shù),背景顏色等等
? ? 5 對apk體積影響很小,未壓縮情況下,增加apk包體積110k左右,壓縮后為45k左右
劣勢:?
? ? 1.Lottie動畫在未開啟硬件加速的情況下,幀率、內(nèi)存服傍,CPU都比屬性動畫差票灰,開啟硬件加速后蔬墩,性能差不多斤贰。
看到如此精美的動畫,是不是有些心動呢? 趕緊來體驗下吧
三??Lottie-android的使用
? ? 1.app module的build.gradle引入依賴:
????????dependencies {
????????????????implementation'com.airbnb.android:lottie:$lottieVersion'? ? //目前最新的是3.3.1版本
? ? ? ? ? ?}
特別注意(有坑):
????????Lottie 2.8.0 and above only supports projects that have been migrated to?androidx.
????????2.8+以上版本需要在AndroidX項目中才可用,如果你的項目沒有升級到AndroidX,最高可用版本是2.7.0.同時使用的動畫必須是Bodymovin插件5.5以前版本導(dǎo)出的動畫,才可以正常使用.或者如果設(shè)計師已經(jīng)升級了Bodymovin插件,那么讓她導(dǎo)出json格式的時候,選擇導(dǎo)出兼容版本的json動畫.
? ? ? ? 2. 準(zhǔn)備好設(shè)計師提供的動畫導(dǎo)出的gson文件,放置在src/main/assets(沒有目錄則自己創(chuàng)建該目錄)文件夾下
? ? ? ? ? ????????? ps: 我只是想使用,設(shè)計師也不會制作,怎么辦? 去lottie社區(qū)下載吧
? ? ? ? 3 開發(fā)簡單使用
? ? ? ? ? ? 方法一:? 在xml布局中使用
? ? ? ????? 方法二: xml布局只放置控件,代碼控制使用
? ??????????????????
? ? ? ? 此外,Lottie還有很多高級使用方法,各位有興趣的話,自己慢慢去探索吧.
參考文章: