Animate CC導出spriteSheets給原生js使用！

1、準備工具

1. Adobe Animate CC 2017
2. jsMovieclip 類庫

2、工做流程

1. 使用Adobe Animate CC 導出sprite sheets

• • 新建一個元件（影片剪輯MovieClip），在這個元件裏添加 序列幀動畫；
  • 在庫中選中這個元件，右擊——生成Sprite 表——而後如圖，進行設置

注意：

①這裏算法要 選擇 MaxRects ，默認算法會使生成的sprite表裏的小圖大小不一，雖然會節省空間，可是使用起來會麻煩一點；

選中 MaxRects ，生成的sprite表裏的小圖會統一按照最大的那張小圖的大小進行計算規劃。

②數據格式 選擇 JSON-Array

③這裏的寬高，是指輸出的 sprite表的大小，能夠本身設置，也能夠選擇自動調整大小，可是不能 =＞2048*2048，否則遊覽器讀取的時候會產生BUG，卡頓等現象；這是遊覽器的限制；

• • 導出後有兩個文件，一個UI.json，一個UI.png；

　　2.進行數據轉換，把json裏的數據轉成jsMovieclip插件須要的格式

• • 1.打開jsMovieclip文件夾裏的——tools——convert——index.html

　　　　　　注意：index.html裏的jq連接可能失效了，改爲正確的路徑

• • 2.複製UI.json裏的數據，而後貼到index.html裏的文本框裏，點擊 OK按鈕，輸出jsMovieclip格式的數據；
  • 3.而後具體使用，參照jsMovieclip裏的example，如：jsMovieclip——samples——basic——index.html，等等；