iOS 動畫實戰之Lottie動畫

2021-08-11 19:27:02 字數 1125 閱讀 5365

1.作為收藏按鈕, 是不是很活潑?

2.返回與選單之間的切換, 生動有趣!

3.還有各種形變動畫.

更棒的是, lottie有各種不同的版本, 安卓, ios, 前端都可以使用, 理論上動畫做一套就可以共用, 大大的減少了工作量.

使用方法

整合環境: 移動端同學整合lottie框架, ui/ue同學整合ae的bodymovin外掛程式

製作動畫, 匯出檔案, 拖進工程

非常簡單, 下面看兩個實際例子

實戰

先看第乙個例子:

典型的形變動畫加上幾個普通動畫融合在一起, 如果由程式設計師來寫, 確實還要花一番心思, 使用lottie就非常容易了.

if (_launchmask && _launchanimation) completion:^(bool finished) ];

}];}

}- (void)setuplaunchmask

甚至可以用在引導頁中, **都很簡單, 就不重複貼了. 值得注意的是, 像這樣多次使用到lottie時一定要注意素材的名字不能一樣, 否則動畫就是錯亂的, 簡單講一講怎麼改.

幾點值得注意的是:

我這建立乙個uiimageview作為背景, 是拆分了動畫, 將不動的部分作為背景, 避免記憶體中載入的過多, 後面會細說這個問題.

lotanimationview這個類就是動畫本身了, 也可以設定contentmode, 所以為了適配, 這個屬性應該與啟動頁一致(建議啟動頁用storyboard + uiimageview).

在檢視載入完成之後呼叫_launchanimation的play方法, 完成之後漸變色隱藏並置空.

很容易的, 乙個精美的啟動動畫就完成了.

總結

看完了本篇文章, 你會發現動畫竟然如此簡單, 那我們以後動畫全用lottie來實現? 其實lottie也有一定的限制

lottie是基於calayer的動畫, 所有的路徑預先在ae中計算好, 轉換為json檔案, 然後自動轉換為layer的動畫, 所以效能理論上是非常不錯的, 在實際使用中, 確實很不錯, 但是有幾點需要注意的:

君凱商聯網-ios-字唐名僧

iOS 上接入Lottie動畫 接入Json動畫

ios裝置上的動畫借助官方sdk coreanimation那一套已經比較強大了,基本上的動效都能實現,就是1 開發這邊比較累 2 安卓那邊也比較累況且 倆平台最後展示的可能有些細節還不一樣。早幾年出了個動效引擎庫lottie,比較強大,好幾個平台都能使用 web h5 ios android上都有...

Android之動畫 Tween動畫(線性動畫)

簡介 包括alpha 透明度 scale 縮放 translate 位移 和rotate 旋轉 動畫,可以單獨顯示,也可以多種動畫組合在一起使用。宣告檔案的位置 res anim filename.xml,filename會被用來作為動畫的索引。檔案的宣告 xmlns android android...

iOS 學習總結之動畫

objc view plain copy uiview的,翻轉 旋轉,偏移,翻頁,縮放,取反的動畫效果 翻轉的動畫 開始動畫 uiviewbeginanimations doflip context nil 設定時常 uiviewsetanimationduration 1 設定動畫淡入淡出 uiv...