photoshop cc 自動切圖

很多年前，當我只知道photoshop有圖層這個概念時，我就猜想，應該有一個功能能把這些圖層都分別導出來纔對呀。不過從今時今日來看，我的這個猜想還是比較超前的，因爲知道photoshop cc版本纔有了“自動切圖”這一自動導出圖層的功能。

導出所有圖層

這個功能適合比較懶的人，但不太適合追求效率的人。這麼說，是因爲對於一個複雜的PSD來說，圖層的數量是相當驚人的，要導出所有的圖層是相當花費時間的，而其中我們真正用到的也許並不是那麼的多（比如說純文本、簡單的按鈕、簡單的色塊等我們直接用代碼實現了，就不需要圖片了）。
具體的操作是這樣的：

我個人比較推崇通過這種方式來導出圖層，因爲可以準確導出自己想要的圖層，並控制好導出後的文件名稱、格式、尺寸、質量等，導出後甚至直接就能拿來合併sprite圖了，非常方便。
具體的操作時這樣的：

先打開圖像生成器：在“編輯” =》 “首選項” =》 “增效工具”，勾上“生成器”，按“確定”按鈕保存設置後重啓photoshop。
在“文件” => “生成” 裏勾上“圖像資源”。
給某個圖層/組改名，如下面的這個例子，給一個名叫”iTunes”的組改名爲”iTunes.png”，然後就會發現在psd的目錄下，多了一個“psd文件名-assets”的目錄，打開就能發現已經生成好了的iTunes.png文件，非常方便。
改名有這樣的規則：
除上表外，還可以控制圖片的尺寸，比如說要生成Retina用的圖片，可以在文件名開頭加上“200% ”，比如說：”200% iTunes.png”，就可以生成長寬都是原圖片兩倍的圖片了。但是要注意的是，如果要生成不同尺寸的圖片，需要在每次生成好圖片後稍微改下圖片文件名，這樣可以避免在下次生成圖片時老圖片被新圖片替換了的窘境。
這個方法其實也是可以生成svg文件的，不過首先你的photoshop得支持svg格式才行。