如何從Sketch向Xcode自動匯出圖形資源

Bohemian Coding(Sketch的製作團隊)釋出過一款名為SketchTool的命令列工具，用來自動匯出.sketch檔案當中的介面和切片。

越來越多的設計師和開發者開始在iOS開發流程當中使用起Sketch。通常，整個流程中會包含很多重複性的工作，例如在Sketch當中修改設計方案，重新匯出，然後將更新後的圖形資源移入Xcode的Asset Catalogs當中，並再次執行Xcode專案以檢視實際效果。

而通過SketchTool配合Xcode，這些都可以自動化完成。

下面是完成這套圖形資源更新流程的演示視訊：

你也可以下載視訊當中涉及到的專案檔案。

接下來我們對視訊當中演示的幾個關鍵環節進行說明。

安裝SketchTool

你可以在Bohemian Coding的網站下載最新版本的SketchTool，然後將下載檔案中的sketchtool和 sketchtool resources.bundle放進/user/bin路徑中。

或者，你也可以通過在OS X的“終端”當中貼上以下程式碼來安裝SketchTool：

準備Sketch檔案

組織專案檔案的方式因人而異，不過我個人傾向於將所有的Sketch檔案放在Xcode的專案根路徑當中，為它們建立一個名為“Graphics Resources”的資料夾當中，正像各位在上面的演示視訊當中看到的那樣。

在Sketch檔案中，使用artboard和切片來組織需要匯出到Xcode當中的圖形素材。例如，在我的AppIcon.sketch裡，我會將每種規格的圖示放置在各自的artboard當中，和Sketch 3自帶的iOS App Icon模板的方式差不多，我只做了簡單的修改。

建立指令碼

在Xcode中，建立新的Run Script Phase，並確保其在列表中位於“Copy Bundle Resources”之前。

在我的專案檔案中，Run Script的程式碼如下(你也可以在下載到的檔案中看到)：

以上程式碼需要根據你的專案情況進行調整或擴充套件。