Airbnb 的 Lottie,讓你的APP更酷炫!!

一、簡介

你有沒有遇上一些設(shè)計師,對一些酷炫的動畫著迷,喜歡根據(jù)場景設(shè)計出可愛而流暢的動畫。但是在實際工作中,哪怕開發(fā)人員也覺得這些動畫非常的棒,可我們知道,越是定制化的動畫,實現(xiàn)起來將會越麻煩和耗時。這有時候就會引發(fā)設(shè)計師和工程師的矛盾。

而自從 Airbnb 開發(fā)出 Lottie 之后,設(shè)計師只需要使用 After Effects 設(shè)計出完美的動畫,然后通過 Bodymovin 插件進行簡單的轉(zhuǎn)換和導(dǎo)出成 JSON,最后工程師將 JSON 放入 App 項目中,就可以將動畫 100% 還原到你的產(chǎn)品中。

二、為什么要用 Lottie?

Lottie 是一套跨平臺的完整解決方案,設(shè)計師只需要使用 After Effectes 設(shè)計出動畫之后,使用 Lottic 提供的 Bodymovin 將設(shè)計好的動畫導(dǎo)出成 JSON 格式,就可以直接運用在 iOS、Android 和 React Native之上,無需關(guān)心中間的實現(xiàn)細(xì)節(jié)。

對于不同的工作角色,Lottie 給你帶來的都是更簡潔的工作流。

  • 如果你是 Designer,你可以充分發(fā)揮你的動畫設(shè)計天分,因為它們最終會被 100% 的還原。

  • 如果你是 Engineer,你可以通過簡單的導(dǎo)入和有限的代碼,就可以實現(xiàn)設(shè)計師要求的動畫,并且 Lottie 并不臃腫。

  • 如果你是 Product Manager,你的產(chǎn)品將具有更人性化的酷炫動畫,而這并不會帶來開發(fā)周期的延長。

整體來說,Lottie 是一個優(yōu)秀的項目,它能解決很多關(guān)于動畫上的溝通問題和提供解決方案。可它依然有一些不足的地方:

  1. 系統(tǒng)版本限制,Android(Api 14+) 和 iOS(>=8.0) 都有不同的版本限制。

  2. 有一些交互動畫,不被支持,哪怕導(dǎo)出了也無法被正常執(zhí)行。

  3. Bodymovin 插件還有待完善,有些 After Effects 實現(xiàn)的效果,無法被正常導(dǎo)出。

而今天,我們站在一個 Android 工程師的角度,來看看如何使用 Lottie。這里只聊 Android 下使用 Lottie,如何編輯動畫,如何安裝插件,這些都是設(shè)計師需要關(guān)心的,對我們而言,拿到的就是一個 Lottie 動畫的 JSON 文件,我們只需要關(guān)心如何使用它。

三、在 Android 下使用 Lottie

Lottie Github: https://github.com/airbnb/lottie-android

Lottie 官方文檔: http://airbnb.io/lottie/

本來參考了公眾號
承香墨影

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容