imgcook for Photoshop是阿里程序員開(kāi)發(fā)的一款圖像智能化生成代碼的插件,這款插件目前支持sketch和Photoshop,這里西西提供的是Photoshop版本。這款插件可以幫助設(shè)計(jì)師們將做好的圖像稿件智能生成前端代碼,其高度智能化保證代碼和視覺(jué)的高度還原,大家可以嘗試下。
安裝方法:
1. 下載并安裝 PS 插件
在網(wǎng)站首頁(yè)下載 PS 版插件,解壓文件后會(huì)得到對(duì)應(yīng)操作系統(tǒng)的插件安裝器文件以及試驗(yàn)田試玩 PSD 文件。安裝器安裝流程如下:
Mac 用戶:雙擊 imgcook.photoshop_version.pkg 文件,按步驟提示進(jìn)行安裝,安裝完畢后可重啟 PhotoShop,在 Window(窗口)->Extensions(擴(kuò)展文件) 找到 imgcook 插件。如果遇到軟件不可信問(wèn)題,可前往 系統(tǒng)偏好設(shè)置 -> 安全性與隱私 -> 仍要打開(kāi)。
Windows 用戶:雙擊 imgcook.photoshop_version.exe 文件 ,按步驟提示進(jìn)行安裝,大概耗時(shí)幾分鐘,安裝完畢后可重啟 PhotoShop,在 Window(窗口)->Extensions(擴(kuò)展文件) 找到 imgcook 插件。
如果上述安裝器安裝流程出現(xiàn)異常(比如 Windows 安裝過(guò)程卡住時(shí)間很久),可嘗試手動(dòng)安裝。
解壓 imgcook.photoshop.zip 文件,根據(jù)各自的系統(tǒng)將解壓后的目錄文件放置到以下指定目錄里,重啟 PhotoShop 即可在 Window(窗口)->Extensions(擴(kuò)展文件) 找到 imgcook 插件。
插件手動(dòng)安裝指定目錄
Mac OS: /Library/Application Support/Adobe/CEP/extensions/
Windows x64: C:/Program Files (x86)/Common Files/Adobe/CEP/extensions/
Windows x32: C:/Program Files/Common Files/Adobe/CEP/extensions/
2. 簽署問(wèn)題
安裝完 imgcook 插件后,打開(kāi) PhotoShop 可在 Window(窗口)->Extensions(擴(kuò)展文件) 找到 imgcook 插件,首次呼起插件會(huì)提示 插件未經(jīng)正確授權(quán) 錯(cuò)誤,可通過(guò)以下操作解決。
Mac
打開(kāi) Terminal 終端,針對(duì)不同 Adobe PhotoShop CC 版本可在終端執(zhí)行以下命令:
CC 2015: defaults write com.adobe.CSXS.6 PlayerDebugMode 1
CC 2015.5: defaults write com.adobe.CSXS.7 PlayerDebugMode 1
CC 2017: defaults write com.adobe.CSXS.7 PlayerDebugMode 1
CC 2018: defaults write com.adobe.CSXS.8 PlayerDebugMode 1
Windows
打開(kāi)注冊(cè)表(運(yùn)行 regedit)
找到 HKEY_CURRENT_USER\Software\Adobe
針對(duì)不同 CC 版本找到對(duì)應(yīng)的 CSXS 項(xiàng),比如 CSXS.7
鼠標(biāo)右鍵新建字符串值
選中剛新建的字符串值注冊(cè)表-鼠標(biāo)右鍵-修改-數(shù)值名稱:PlayerDebugMode 數(shù)值數(shù)據(jù):1
CC 2015:HKEY_CURRENT_USER\Software\Adobe\CSXS.6
CC 2015.5:HKEY_CURRENT_USER\Software\Adobe\CSXS.7
CC 2017:HKEY_CURRENT_USER\Software\Adobe\CSXS.7
CC 2018:HKEY_CURRENT_USER\Software\Adobe\CSXS.8
執(zhí)行完上述流程后,重啟 PS 重新打開(kāi) Window(窗口)->Extensions(擴(kuò)展文件)-> imgcook 可看到一個(gè)小終端界面。
使用方法:
1.打開(kāi)下載包里的 imgcook試驗(yàn)田.psd 文件,找到 PS 界面 layers(圖層) 窗口(如果沒(méi)有,可以通過(guò)勾選 Window(窗口) -> layers(圖層))打開(kāi)
2.選中一個(gè)模塊最外層的圖層節(jié)點(diǎn),點(diǎn)擊插件終端界面里的 導(dǎo)出數(shù)據(jù)。
3.等待插件處理完畢顯示導(dǎo)出成功后即可點(diǎn)擊 去粘貼 前往 imgcook 平臺(tái)進(jìn)行粘貼。