一、簡介
你有沒有遇上一些設(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)于動畫上的溝通問題和提供解決方案。可它依然有一些不足的地方:
系統(tǒng)版本限制,Android(Api 14+) 和 iOS(>=8.0) 都有不同的版本限制。
有一些交互動畫,不被支持,哪怕導(dǎo)出了也無法被正常執(zhí)行。
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/
本來參考了公眾號
承香墨影