CocosCreator資源工做流程

--摘自官方文檔

資源工做流程

添加資源

資源管理器 提供了三種在項目中添加資源的方式：

• 經過 建立按鈕 添加資源
• 在操做系統的文件管理器中，將資源文件複製到項目資源文件夾下，以後再打開或激活 Cocos Creator 窗口，完成資源導入。
• 從操做系統的文件管理器中（好比 Windows 的文件資源管理器或 Mac 的 Finder），拖拽資源文件到 資源管理器 面板來導入資源

從外部導入資源

從操做系統中的其餘窗口拖拽文件到 Cocos Creator 窗口中的 資源管理器 面板上，就可以從外部導入資源。該操做會自動複製資源文件到項目資源文件夾下，並完成導入操做。

導入和同步資源

資源管理器 中的資源和操做系統的文件管理器中看到的項目資源文件夾是同步的，在 資源管理器 中對資源的移動、重命名和刪除，都會直接在用戶的文件系統中對資源文件進行同步修改。一樣的，在文件系統中（如 Windows 上的 Explorer 或 Mac 上的 Finder）對添加或刪除資源，再次打開或激活 Cocos Creator 程序後，也會對 資源管理器 中的資源進行更新。

管理資源配置文件（.meta）

全部 assets 路徑下的資源都會在導入時生成一份 資源配置文件（.meta） 這份配置文件提供了該資源在項目中的惟一標識（uuid）以及其餘的一些配置信息（如圖集中的小圖引用，貼圖資源的裁剪數據等），很是重要。

在編輯器中管理資源時，meta 文件是不可見的，對資源的任意刪除、更名、移動操做，都會由編輯器自動同步相應的 meta 文件，確保 uuid 的引用不會丟失和錯亂。

注意在編輯器外部的文件系統中（Explorer，Finder）對資源文件進行刪除、更名、移動時必須同步處理相應的 meta 文件。資源文件和其對應的 meta 文件應該保持在同一個目錄下，並且文件名相同。

處理沒法匹配的資源配置文件（.meta）

若是您在編輯器外部的文件系統（Explorer，Finder等）中進行了資源文件的移動或重命名，而沒有同步移動或重命名 meta 文件時，會致使編輯器將更名或移動的資源當作新的資源導入，可能會出現場景和組件中對該資源（包括腳本）的引用丟失。

在編輯器發現有未同步的資源配置文件時，會彈窗警告用戶，並列出全部不匹配的 meta 文件。

這時沒法正確匹配的資源配置文件會從項目資源路徑（asset）中移除，並自動備份到 temp 路徑下。

若是您但願恢復這些資源的引用，請將備份的 meta 文件複製到已經移動過的資源文件同一路徑下，並保證資源文件和 meta 文件的文件名相同。注意編輯器在處理資源更名和移動時會生成新的 meta 文件，這些新生成的 meta 文件能夠在恢復備份的 meta 後安全刪除。

跨項目導入導出資源

除了導入基礎資源外，從 1.5 版本開始編輯器支持將一個項目中的資源和其依賴完整的導出到另外一個項目，詳情請閱讀 導入導出資源工做流程。

導入其餘編輯器項目

如今能夠在 Cocos Creator 中導入其餘編輯器的項目。具體的說明請參考：導入其餘編輯器項目

常見資源工做流程

接下來咱們會介紹 Cocos Creator 中主要資源類型和相關工做流程：

• 場景資源
• 圖像資源
• 圖集資源（Atlas）
• 自動圖集資源（Auto Atlas）
• 圖像資源的自動剪裁
•  

預製資源（Prefab）

•  
•  

腳本資源

•  
• 字體資源
• 粒子資源
• 聲音資源
• 骨骼動畫資源（Spine）
• 瓦片圖資源（TiledMap）
• 骨骼動畫資源（DragonBones）

建立和管理場景

建立場景

方法一：選擇主菜單：文件/新建場景

 

方法二：在 資源管理器 中點擊建立菜單，建立新場景。

 

保存場景

方法一：使用快捷鍵 Ctrl + S (Windows) 或 Command + S (Mac)

方法二：選擇主菜單：文件/保存場景

 

切換場景

在 資源管理器 中，雙擊須要打開的場景。

修改場景資源自動釋放策略

若是項目中的場景不少，隨着新場景的切換，內存佔用就會不斷上升。除了使用 cc.loader.release 等 API 來精確釋放不使用的資源，咱們還可使用場景的自動釋放功能。要配置自動釋放，能夠在 資源管理器 中選中所需場景，而後在 屬性檢查器 中設置「自動釋放資源」選項，該項默認關閉。
從當前場景切換到下一個場景時，若是當前場景不自動釋放資源，則該場景中直接或間接引用到的全部資源（腳本動態加載的不算），默認都不主動釋放。反之若是啓用了自動釋放，則這些引用到的資源默認都會自動釋放。

已知問題：粒子系統的 plist 所引用的貼圖不會被自動釋放。若是要自動釋放粒子貼圖，請從 plist 中移除貼圖信息，改用粒子組件的 Texture 屬性來指定貼圖。

防止特定資源被自動釋放

啓用了某個場景的資源自動釋放後，若是在腳本中保存了對該場景的資源的「特殊引用」，則當場景切換後，因爲資源已經被釋放，這些引用可能會變成非法的，有可能引發渲染異常等問題。爲了讓這部分資源在場景切換時不被釋放，咱們可使用 cc.loader.setAutoRelease 或者 cc.loader.setAutoReleaseRecursively 來保留這些資源。

「特殊引用」指的是以全局變量、單例、閉包、「特殊組件」、「動態資源」等形式進行的引用。「特殊組件」是指經過 cc.game.addPersistRootNode 方法設置的常駐節點及其子節點上的組件，而且這些組件中包含以字符串 URL 或 UUID，或者以除了數組和字典外的其它容器去保存的資源引用。「動態資源」指的是在腳本中動態建立或動態修改的資源。這些資源若是還引用到場景中的其它資源，則就算動態資源自己不該該釋放，其它資源默認仍是會被場景自動釋放。

以上關於場景資源自動釋放部分的內容能夠概括爲下圖中的幾種狀況：

 

修改場景加載策略

在 資源管理器 中，選中指定場景，能夠在 屬性檢查器 中看到「延遲加載資源」選項，該項默認關閉。

不延遲加載資源

加載場景時，若是這個選項關閉，則這個場景直接或間接遞歸依賴的全部資源都將被加載，所有加載完成後纔會觸發場景切換。

延遲加載依賴的資源

加載場景時，若是選項開啓，則這個場景直接或間接依賴的全部貼圖、粒子和聲音都將被延遲到場景切換後才加載，使場景切換速度極大提高。
同時，玩家進入場景後可能會看到一些資源陸續顯示出來，而且激活新界面時也可能會看到界面中的元素陸續顯示出來，所以這種加載方式更適合網頁遊戲。
使用這種加載方式後，爲了能在場景中更快地顯示須要的資源，建議一開始就讓場景中暫時不須要顯示的渲染組件（如 Sprite）保持非激活狀態。

Spine 和 TiledMap 依賴的資源永遠都不會被延遲加載。

圖像資源（Texture）

圖像資源又常常被稱做貼圖、圖片，是遊戲中絕大部分圖像渲染的數據源。圖像資源通常由圖像處理軟件（好比 Photoshop，Windows 上自帶的畫圖）製做而成並輸出成 Cocos Creator 可使用的文件格式，目前包括 JPG 和 PNG 兩種。

導入圖像資源

使用默認的資源導入方式就能夠將圖像資源導入到項目中，以後咱們就能夠在 資源管理器 中看到以下圖所示的圖像資源。

 

圖像資源在 資源管理器 中會以自身圖片的縮略圖做爲圖標。在 資源管理器 中選中圖像資源後，屬性檢查器 下方會顯示該圖片的縮略圖。目前圖像資源的屬性設置功能尚未完善，請不要在 屬性檢查器 手動修改圖像資源的屬性設置。

Texture 和 SpriteFrame 資源類型

在 資源管理器 中，圖像資源的左邊會顯示一個和文件夾相似的三角圖標，點擊就能夠展開看到它的子資源（sub asset），每一個圖像資源導入後編輯器會自動在它下面建立同名的 SpriteFrame 資源。

 

SpriteFrame 是核心渲染組件 Sprite 所使用的資源，設置或替換 Sprite 組件中的 spriteFrame 屬性，就能夠切換顯示的圖像。Sprite 組件的設置方式請參考Sprite 組件參考。

爲何會有 SpriteFrame 這種資源？這樣的設置是由於除了每一個文件產生一個 SpriteFrame 的圖像資源（Texture）以外，咱們還有包含多個 SpriteFrame 的圖集資源（Atlas）類型。參考圖集資源（Atlas）文檔來了解更多信息。

下面是 Texture 和 SpriteFrame 的 API 接口文檔：

• Texture 資源類型
• SpriteFrame 資源類型

使用 SpriteFrame

直接將 SpriteFrame 或圖像資源從 資源管理器 中拖拽到 層級管理器 或 場景編輯器 中，就能夠直接用所選的圖像在場景中建立 Sprite 節點。

以後能夠拖拽其餘的 SpriteFrame 或圖像資源到該 Sprite 組件的 Sprite Frame 屬性欄中，來切換該 Sprite 顯示的圖像。

在 動畫編輯器 中也能夠拖拽 SpriteFrame 資源到已建立好的 Sprite Frame 動畫軌道上，詳見編輯序列幀動畫文檔。

性能優化注意事項

使用單獨存在的 Texture 做爲 Sprite 資源，在預覽和發佈遊戲時，將沒法對這些 Sprite 進行批量渲染優化的操做。目前編輯器不支持轉換原有的單張 Texture 引用到 Atlas 裏的 SpriteFrame 引用，因此在開發正式項目時，應該儘早把須要使用的圖片合成 Atlas（圖集），並經過 Atlas 裏的 SpriteFrame 引用使用。詳情請繼續閱讀下一篇。

預製資源（Prefab）

建立預製

在場景中編輯好節點後，直接將節點從 層級管理器 拖到 資源管理器：

 

便可建立出一個預製：

 

保存預製

在場景中修改了預製實例後，在 屬性檢查器 中直接點擊 保存，便可保存對應的預製資源：

 

還原預製

在場景中修改了預製實例後，在 屬性檢查器 中直接點擊 回退，便可將預製對象還原爲資源中的狀態：

 

自動同步和手動同步

每一個場景中的預製實例均可以選擇要自動同步和仍是手動同步。
設爲手動同步時，當預製對應的原始資源被修改後，場景中的預製實例不會同步刷新，只有在用戶手動還原預製時纔會刷新。
設爲自動同步時，該預製實例會自動和原始資源保持同步。

圖中的圖標表示當前預製的同步方式，點擊圖標將會在兩種模式之間切換：

 

上面的圖標表示當前預製使用手動同步，點擊圖標會切換到自動同步：

 

注意，爲了保持引擎的精簡，自動同步的預製實例有以下限制：

• 爲了便於對各場景實例進行單獨定製，場景中的預製根節點自身的 name、active、position 和 rotation 屬性不會被自動同步。而其它子節點和全部組件都必須和原始資源保持同步，若是發生修改，編輯器會詢問是要撤銷修改仍是要更新原始資源。
• 自動同步的預製中的組件沒法引用該預製外的其它對象，不然編輯器會彈出提示。
• 自動同步的預製外面的組件只能引用該預製的根節點，沒法引用組件和子節點，不然編輯器會彈出提示。

這些限制都僅影響編輯器操做，運行時不影響。

將預製還原成普通節點

從 資源管理器 中刪除一個預製資源後，你能夠將場景中對應的預製實例還原成普通節點。方法是選中預製實例，而後點擊菜單 節點 > 還原成普通節點。

預置的選項

在 資源管理器 中，選中任一預置資源，能夠在 屬性檢查器 中編輯如下選項。

設置「優化策略」

在 v1.8.0 中加入了「優化策略」選項，能優化所選預置的實例化時間，也就是執行 cc.instantiate 所需的時間。可設置的值有：

• 自動調整（默認）：
  設爲這個選項後，引擎將根據建立次數自動調整優化策略。初次建立實例時，等同於「優化單次建立性能」，屢次建立後將自動「優化屢次建立性能」。
• 優化單次建立性能：
  該選項會跳過針對這個 prefab 的代碼生成優化操做。
• 優化屢次建立性能：
  該選項會啓用針對這個 prefab 的代碼生成優化操做。

若是這個預置須要反覆執行 cc.instantiate，請選擇「優化屢次建立性能」，不然保持默認的「自動調整」便可。

在舊版本引擎中，優化方式固定爲「優化屢次建立性能」，在須要批量建立對象的場合中效果拔羣。可是有很多人將 prefab 做爲多人協做或者分步加載的工具，這些 prefab 基本只會實例化一次，就會致使節點建立速度變慢。新版本默認採用「自動調整」之後，很好的解決了這個問題。

設置「延遲加載資源」

該項默認關閉。勾選以後，使用 屬性檢查器 關聯、loadRes 等方式單獨加載預置資源時，將會延遲加載預置所依賴的其它資源，提高部分頁遊的加載速度。詳情請參考場景的延遲加載。

 

圖集資源（Atlas）

圖集（Atlas）也稱做 Sprite Sheet，是遊戲開發中常見的一種美術資源。圖集是經過專門的工具將多張圖片合併成一張大圖，並經過 plist 等格式的文件索引的資源。可供 Cocos Creator 使用的圖集資源由 plist 和 png 文件組成。下面就是一張圖集使用的圖片文件：

 

爲何要使用圖集資源

在遊戲中使用多張圖片合成的圖集做爲美術資源，有如下優點：

• 合成圖集時會去除每張圖片周圍的空白區域，加上能夠在總體上實施各類優化算法，合成圖集後能夠大大減小遊戲包體和內存佔用
• 多個 Sprite 若是渲染的是來自同一張圖集的圖片時，這些 Sprite 可使用同一個渲染批次來處理，大大減小 CPU 的運算時間，提升運行效率。

更形象生動的解釋能夠觀看來自 CodeAndWeb 的教學視頻What is a Sprite Sheet（什麼是圖集）。

製做圖集資源

要生成圖集，首先您應該準備好一組原始圖片：

 

接下來可使用專門的軟件生成圖集，咱們推薦的圖集製做軟件包括：

• TexturePacker
• Zwoptex

使用這些軟件生成圖集時請選擇 cocos2d-x 格式的 plist 文件。最終獲得的圖集文件是同名的 plist 和 png。

 

導入圖集資源

將上面所示的 plist 和 png 文件同時拖拽到 資源管理器 中，就能夠生成能夠在編輯器和腳本中使用的圖集資源了。

Atlas 和 SpriteFrame

在圖像資源文檔中，咱們介紹了 Texture 和 SpriteFrame 的關係。導入圖集資源後，咱們能夠看到類型爲 Atlas 的圖集資源能夠點擊左邊的三角圖標展開，展開後能夠看到圖集資源裏包含了不少類型爲 SpriteFrame 的子資源，每一個子資源都是能夠單獨使用和引用的圖片。

 

接下來對於 Sprite Frame 的使用方法就和圖像資源中介紹的同樣了，請查閱相關文檔。

碎圖轉圖集

在項目原型階段或生產初期，美術資源的內容和結構變化都會比較頻繁，咱們一般會直接使用碎圖（也就是多個單獨的圖片）來搭建場景和製做 UI。在以後爲了優化性能和節約包體，須要將碎圖合併成圖集。Creator 提供了自動圖集功能，能夠在發佈項目時無縫地將生產階段的碎圖合併成圖集，而且自動更新資源索引。請查看 自動圖集資源 獲取詳細用法。

自動圖集資源 (Auto Atlas)

自動圖集資源 做爲 Cocos Creator 自帶的合圖功能，能夠將指定的一系列碎圖打包成一張大圖，具體做用和 Texture Packer 的功能很相近。

建立自動圖集資源

在 資源管理器 中右鍵，能夠在以下菜單中找到 新建 -> 自動圖集配置 的子菜單，點擊菜單將會新建一個相似 AutoAtlas.pac 的資源。

自動圖集資源 將會以當前文件夾下的全部 SpriteFrame 做爲碎圖資源，之後會增長其餘的選擇碎圖資源的方式。 若是碎圖資源 SpriteFrame 有進行配置過，在打包後從新生成的 SpriteFrame 將會保留這些配置。

配置自動圖集資源

在資源管理器中選中一個 自動圖集資源 後，屬性檢查器 面板將會顯示 自動圖集資源 的全部可配置項。

屬性	功能說明
最大寬度	單張圖集最大寬度
最大高度	單張圖集最大高度
間距	圖集中碎圖之間的間距
容許旋轉	是否容許旋轉碎圖
輸出大小爲正方形	是否強制將圖集長寬大小設置成正方形
輸出大小爲二次冪	是否將圖集長寬大小設置爲二次方倍數
算法	圖集打包策略， 可選的策略有 [BestShortSideFit, BestLongSideFit, BestAreaFit, BottomLeftRule, ContactPointRule]
輸出格式	圖集圖片生成格式，可選的格式有 [png, jpg, webp]
擴邊	在碎圖的邊框爲擴展出一像素外框，並複製相鄰碎圖像素到外框中
不包含未被引用資源	在預覽中，此選項不會生效，構建後此選項纔會生效

配置完成後能夠點擊 預覽 按鈕來預覽打包的結果，按照當前自動圖集配置生成的相關結果將會展現在 屬性檢查器 下面的區域。 須要注意的是每次配置事後，須要從新點擊 預覽 纔會從新生成預覽信息。

結果分爲：

• Packed Textures, 顯示打包後的圖集圖片以及圖片相關的信息，若是會生成的圖片有多張，則會往下在 屬性檢查器 中列出來。
• Unpacked Textures，顯示不能打包進圖集的碎圖資源，形成的緣由有多是這些碎圖資源的大小比圖集資源的大小還大致使的，這時候可能須要調整下圖集的配置或者碎圖的大小了。

生成圖集

預覽項目或者在 Cocos Creator 中使用碎圖的時候都是直接使用的碎圖資源，在 構建項目 這一步纔會真正生成圖集到項目中。 生成的大圖將會放在 構建目錄 下的 res/raw-assets 相對於項目中 assets 目錄結構下的對應的目錄中，以 AutoAtlas-xx.png 結構命名。 生成項目後能夠到對應的目錄下檢查對應的圖集資源是否生成成功了。

藝術數字資源 (LabelAtlas)

藝術數字資源 是一種用戶自定義的資源，它能夠用來配置藝術數字字體的屬性。

建立藝術數字資源

在 資源管理器 中右鍵，能夠在以下菜單中找到 新建 -> 藝術數字配置 的子菜單，點擊菜單將會新建一個相似 LabelAtlas.labelatlas 的資源。

藝術數字資源 在使用以前須要進行一些配置，好比關聯渲染的圖片資源，設置每個字符的寬高和起始字符信息。

配置藝術數字資源

在資源管理器中選中一個 藝術數字資源 後，屬性檢查器 面板將會顯示 藝術數字資源 的全部可配置項。

屬性	功能說明
Raw Texture File	指定渲染圖片
Item Width	指定每個字符的寬度
Item Height	指定每個字符的高度
Start Char	指定藝術數字字體裏面的第一個字符，若是字符是 Space，也須要在這個屬性裏面輸入空格字符

配置完成後須要點擊 屬性檢查器 右上角的綠色的打勾按鈕來保存設置。

 

使用藝術數字資源

使用藝術數字資源很是簡單，你只須要新建一個 Label 組件，而後把新建好的藝術數字資源拖到 Label 組件的 Font 屬性便可。

資源導入導出工做流程

Cocos Creator 是專一於內容創做的遊戲開發工具，在遊戲開發過程當中，對於每一個項目該項目專用的程序架構和功能之外，咱們還會生產大量的場景、角色、動畫和 UI 控件等相對獨立的元素。對於一個開發團隊來講，不少狀況下這些內容元素都是能夠在必定程度上重複利用的。

在以場景和 Prefab 爲內容組織核心的模式下，1.5版本的 Cocos Creator 內置了場景（.fire)和預製(.prefab)資源的導出和導入工具。

資源導出

在主菜單選擇 「文件->導出資源」，便可打開資源導出工具面板，接下來能夠用如下兩種方式選擇須要導出的資源：

• 將場景或預製文件從 資源管理器 中拖拽到導出資源面板的資源欄中
• 點擊資源欄右邊的「選擇」按鈕，打開文件選擇對話框，並在項目中選取你要導出的資源

能夠選擇的資源包括 .fire 場景文件和 .prefab 預製文件。

確認依賴

導出工具會自動檢查所選資源的依賴列表並列出在面板裏，用戶能夠手動檢查每一項依賴是否必要，並剔除部分依賴的資源。被剔除的資源將不會被導出。

 

確認完畢後點擊 導出 按鈕，會彈出文件存儲對話框，用戶須要指定一個文件夾位置和文件名，點擊 存儲，就會生成 文件名.zip 的壓縮包文件，包含導出的所有資源。

 

資源導入

有了導出的資源包，就能夠在新項目中導入這些現成的資源了，在新項目的主菜單裏選擇 「文件->導入資源」，便可打開資源導入面板。

點擊 Zip 文件路徑 輸入框右邊的 選擇 按鈕，在文件瀏覽對話框中選擇剛纔導出的導出資源壓縮包。

 

導入過程當中也會讓用戶再次確認導入資源依賴，在這時候也能夠取消某些資源的勾選來不導入部分資源。

設置導入位置

相比導出過程，導入過程當中增長了 導入目標路徑 的設置，用戶能夠點擊旁邊的 選擇 按鈕，選擇一個項目 assets 路徑下的某個文件夾做爲導入資源的放置位置。因爲導出資源時全部資源的路徑都是以相對於 assets 路徑來保存的，導入時若是不但願導入的資源放入 assets 根目錄下，就能夠再指定一層中間目錄來隔離不一樣來源的導入資源。

設置完成後點擊 導入 按鈕，會彈出確認對話框，確認後就會把列出的資源導入到目標路徑下。

腳本和資源衝突

因爲 Creator 項目中的腳本不能同名，當導入的資源包含和當前項目裏腳本同名的腳本時，將不會導入同名的腳本。若是出現導入資源的 UUID 和項目中現有資源 UUID 衝突的狀況，會自動爲導入資源生成新的 UUID，並更新在其餘資源裏的引用。

工做流應用

有了全新的資源導入/導出功能，咱們能夠進一步根據項目和團隊須要擴展工做流，好比：

• 程序和美術分別使用不一樣的項目進行開發，美術開發好的 UI、角色、動畫能夠經過導出資源的方式引入到程序負責的主項目中。避免衝突並進一步增強權限管理。
• 一個項目開發完成後，能夠將可重用的資源導出並導入到一個公共資源庫中，在公共資源庫項目裏對該資源進行優化整理後，能夠隨時再導出到其餘項目，大大節約開發成本。
• 將一個較爲完整的功能作成場景或預製，並上傳資源包到擴展商店，方便社區直接取用。

在此基礎上還能夠發展出更多樣化的工做流程，開發團隊能夠發揮想象力，並使用擴展插件系統進一步定製導入導出的數據和行爲，知足更復雜的須要。

圖像資源的自動剪裁

導入圖像資源後生成的 SpriteFrame 會進行自動剪裁，去除原始圖片周圍的透明像素區域。這樣咱們在使用 SpriteFrame 渲染 Sprite 時，將會得到有效圖像更精確的大小。

 

Sprite 組件剪裁相關設置詳解

和圖片裁剪相關的 Sprite 組件設置有如下兩個：

• Trim 勾選後將在渲染 Sprite 圖像時去除圖像周圍的透明像素，咱們將看到恰好能把圖像包裹住的約束框。取消勾選，Sprite 節點的約束框會包括透明像素的部分。
• Size Mode 用來將節點的尺寸設置爲原圖或原圖裁剪透明像素後的大小，一般用於在序列幀動畫中保證圖像顯示爲正確的尺寸。有如下幾種選擇：
• TRIMMED 選擇這個選項，會將節點的尺寸（size）設置爲原始圖片裁剪掉透明像素後的大小。
• RAW 選擇這個，會將節點尺寸設置爲原始圖片包括透明像素的大小。
• CUSTOM 自定義尺寸，用戶在使用 矩形變換工具 拖拽改變節點的尺寸，或經過修改 Size 屬性，或在腳本中修改 width 或 height 後，都會自動將 Size Mode 設爲 CUSTOM。表示用戶將本身決定節點的尺寸，而不須要考慮原始圖片的大小。

下圖中展現了兩種常見組合的渲染效果：

 

自帶位置信息的序列幀動畫

有不少動畫師在繪製序列幀動畫時，會使用一張較大的畫布，而後將角色在動畫中的運動直接經過角色在畫布上的位置變化表現出來。在使用這種素材時，咱們須要將 Sprite 組件 的 Trim 設爲 false，將 Size Mode 設爲 RAW。這樣動畫在播放每一個序列幀時，都將使用原始圖片的尺寸，並保留圖像周圍透明像素的信息，這樣才能正確顯示繪製在動畫中的角色位移。

而 Trim 設爲 true，則是在位移徹底由角色位置屬性控制的動畫中，更推薦使用的方式。

TexturePacker 設置

在製做序列幀動畫時，咱們一般會使用TexturePacker這樣的工具將序列幀打包成圖集，並在導入後經過圖集資源下的 SpriteFrame 來使用。在 TexturePacker 中輸出圖集資源時，Sprites 分類下的 Trim mode 請選擇 Trim，必定不要選擇 Crop, flush position，不然透明像素剪裁信息會丟失，您在使用圖集裏的資源時也就沒法得到原始圖片未剪裁的尺寸和偏移信息了。

 

字體資源

使用 Cocos Creator 製做的遊戲中可使用三類字體資源：系統字體，動態字體和位圖字體。

其中系統字體是經過調用遊戲運行平臺自帶的系統字體來渲染文字，不須要用戶在項目中添加任何相關資源。要使用系統字體，請使用Label組件中的 Use System Font 屬性。

導入字體資源

動態字體

目前 Cocos Creator 支持 TTF 格式的動態字體。只要將擴展名爲 TTF 的字體文件拖拽到 資源管理器 中，便可完成字體資源的導入。

位圖字體

位圖字體由 fnt 格式的字體文件和一張 png 圖片組成，fnt 文件提供了對每個字符小圖的索引。這種格式的字體能夠由專門的軟件生成，請參考位圖字體制做工具。

在導入位圖字體時，請務必將 fnt 文件和 png 文件同時拖拽到 資源管理器 中。

導入後的字體在 資源管理器 中顯示以下：

 

注意 爲了提升資源管理效率，建議將導入的 fnt 和 png 文件存放在單獨的目錄下，不要和其餘資源混在一塊兒。

使用字體資源

字體資源須要經過 Label 組件來渲染，下面是在場景中建立帶有 Label 組件的節點的方法。

使用菜單建立 Label（字體）節點

在 層級管理器 中點擊左上角的 建立節點 按鈕，並選擇 建立渲染節點/Label（文字），就會在場景中建立出一個帶有 Label 組件的節點。

 

您也能夠經過主菜單的 節點/建立渲染節點/Label（文字） 來完成建立，效果和上面的方法同樣。

 

關聯字體資源

使用上面方法建立的字體組件默認使用系統字體做爲關聯的資源，若是想要使用導入到項目中的 TTF 或位圖字體，能夠將您的字體資源拖拽到建立的 Label 組件中的 File 屬性欄中。

 

這時場景中的字體會馬上用剛纔指定的字體資源進行渲染。您也能夠根據項目須要，自由的切換同一個 Label 組件的 File 屬性，來使用 TTF 或位圖字體。切換字體文件時，Label 組件的其餘屬性不受影響。

若是要恢復使用系統字體，能夠點擊 Use System Font 的屬性複選框，來清除 File 屬性中指定的字體文件。

拖拽建立 Label（字體）節點

另一種快捷使用指定資源建立字體節點的方法，是直接從 資源管理器 中拖拽字體文件（TTF 或位圖字體均可以）到 層級管理器 中。和上面用菜單建立的惟一區別，是使用拖拽方式建立的文字節點會自動使用拖拽的字體資源來設置 Label 組件的 File 屬性。

位圖字體合併渲染

若是位圖字體使用的貼圖和其餘 Sprite 使用的貼圖是同一張，並且位圖字體和 Sprite 之間沒有插入使用其餘貼圖的渲染對象時，位圖字體就能夠和 Sprite 合併渲染批次。在放置位圖字體資源時，請把 .fnt 文件、.png 文件和 Sprite 所使用的貼圖文件放在一個文件夾下，而後參考 自動圖集工做流程 將位圖字體的貼圖和 Sprite 使用的貼圖打包成一個圖集，便可在原生和 WebGL 渲染環境下自動享受位圖字體合併渲染的性能提高。

詳情請參考 BMFont 與 UI 合圖自動批處理。