程序員也想改 Lottie 動畫？是的！

1、前言

Hi，你們好，我是承香墨影！git

Lottie 是 Airbnb 開源的一套跨平臺的完整的動畫效果解決方案，用過都說好。徹底解耦開發人員和設計師，讓設計師設計的動畫，在程序中無縫還原，真是一旦拿起毫不放下。程序員

以前也寫過兩篇關於 Lottie 基礎的文章，還不瞭解的能夠先看看。github

Lottie 雖然很是好用，可是從反饋上來看，仍是碰到一些問題。在沒有設計師配合的狀況下，咱們如何找到合適本身 App 風格的 Lottie 動畫的 JSON 文件。markdown

以前也介紹過，有一個 LottieFiles 的網站，其內提供了不少設計師上傳的 Lottie 動畫，並提供預覽的效果，只要咱們看中了，就能夠下載下來使用，很是的方便。編輯器

https://www.lottiefiles.com工具

雖然這個網站特別的方便，可是有時候找到的動畫，並不符合咱們 App 的風格或者咱們的主觀須要。oop

例如這個動畫，若是咱們想爲聖誕作一個禮盒動畫，找到這個動畫以爲很是的合適，可是想將動畫中黃色的絲帶和星星，修改成紅色。怎麼辦？難道只能依賴設計師小姐姐了嗎？學習

最開始我認爲動畫中，使用到的顏色，應該是寫在了 Lottie 動畫的 JSON 中，可是實際你去閱讀 JSON 文件的時候，是找不到相似 ARGB 或者其餘的色值內容的，因此也沒辦法經過直接修改 JSON 文件，來達到修改動畫的目的的。優化

不過沒關係，咱們有工具能夠修改它。動畫

今天就再給你們推薦一個 Lottie 動畫的編輯器：Lottie-editor。

它已經在 Github 上開源，有興趣能夠看看源碼。

https://github.com/sonaye/lottie-editor

簡單來講，Lottie-editor 爲咱們提供了編輯現成 Lottie JSON 文件的能力。它能夠針對動畫中，不一樣的顏色進行編輯，使用起來很是的簡單。

將 JSON 文件拖拽進 Lottie-editor，左側的每一個色塊，就對應了當前動畫中的一個顏色區域，咱們能夠對其進行顏色的修改。一目瞭然，所見即所得。最終咱們能夠將咱們修改好的動畫 JSON 下載下來就能夠直接使用了。

LottieFiles 這個網站，考慮到快速編輯的問題，自己已經支持 Lottie-editor 去編輯動畫了。

咱們只須要在動畫的預覽界面，點擊右上角的 "Customize with Bodymovin Editor"，便可直接對該動畫進行編輯。

LottieFiles 還提供了 AE 動畫的源文件下載功能（部分支持），這樣假如咱們不只僅是對動畫的顏色不滿意，還須要修改一些更多的細節。咱們能夠將 .aep 的文件一同下載下來，而後拜託設計師小姐姐幫忙修改一下。

注意，一個支持 AEP 文件下載的 Lottie 動畫，都有其獨特的標誌。

拿到 AE 源文件以後，就能夠根據本身的須要進行微調了。若是設計師小姐姐對 AE 動畫不熟悉，也可讓她經過這樣的方式，學習別人製做動畫的過程。

好了，對於 Lottie 動畫能本身編輯，就本身編輯吧，實在不行就抱好小姐姐的大腿。😁

今天在公衆號後臺回覆成長『成長』，將會獲得我整理的一些學習資料，也能回覆『加羣』，一塊兒學習進步。