PxCook可以說是一款非常強(qiáng)大的切圖軟件，這款軟件最大的兩個(gè)功能就是標(biāo)注和切圖了。這款軟件的標(biāo)注功能非常的齊全，并且簡(jiǎn)單好用，能夠精準(zhǔn)的提供各種數(shù)據(jù)數(shù)值。這一切的目的就是為了讓切圖變得更加的準(zhǔn)確。最主要的是軟件的操作簡(jiǎn)單，即便是第一次接觸都可以輕松上手，而且軟件還附帶教程輔助操作。

軟件介紹

想必所有的UI設(shè)計(jì)師在工作的時(shí)候都會(huì)需要進(jìn)行一個(gè)圖片標(biāo)注以及切圖的過程，那么久必須要用到切圖工具了，而一款好的標(biāo)注切圖工具往往可以讓大家的工作效率變得更加的高并且質(zhì)量也更好。而這款像素大師就是一款符合要求的利器，他可以快速高效的對(duì)設(shè)計(jì)中的各種尺寸數(shù)據(jù)進(jìn)行處理，非常的智能化，使用起來也很流暢不拖泥帶水，除了主要的標(biāo)注和切圖功能外沒有其他多余的功能。切圖功能也是簡(jiǎn)單好用，不需要復(fù)雜的步驟，只用看一兩次教程，就可以輕松上手了。另外，這款軟件還是免費(fèi)使用的，感興趣的朋友們快來下載吧。

軟件特色

云協(xié)作 & 本地項(xiàng)目任選

與團(tuán)隊(duì)一起同步最新設(shè)計(jì)稿, 協(xié)作更高效。

將設(shè)計(jì)上傳到PxCook云或保存為本地文件, 滿足全部需求。

支持存儲(chǔ)方式：云存儲(chǔ), PXCP項(xiàng)目文件, PNG

自動(dòng)手動(dòng)隨意切, 既精準(zhǔn)又快捷

只需點(diǎn)擊拖拽, 即可輕松獲得間距尺寸, 字體, 陰影圓角等所有信息。

PNG, JPG也能手動(dòng)測(cè)量。支持標(biāo)注單位：PX , PT , DP/SP , REM。

提高前端開發(fā)效率

直接生成可執(zhí)行樣式代碼

熱門語言全部支持：CSS, XML, Objective-C, Swift, ReactNative

滿足所有團(tuán)隊(duì)配置

支持Win／Mac, 支持PS／Sketch

無論你是用Windows, 還是macOS。無論你用Photoshop設(shè)計(jì), 還是Sketch,

在本地項(xiàng)目和云協(xié)作項(xiàng)目中, 都全部支持。

軟件安裝

很多朋友都不知道怎么安裝，因?yàn)檫@款軟件的安裝程序和其他的都不大一樣。

1.首先軟甲你的安裝前置是安裝abobe air，在壓縮包中找到air.exe并運(yùn)行

2.然后點(diǎn)擊我同意就可以進(jìn)行自動(dòng)安裝了

3.air安裝完畢之后就可以安裝軟件了，運(yùn)行壓縮包中的PxCook.air，點(diǎn)擊安裝

4.首選參數(shù)勾選起來，然后選擇軟件的安裝目錄，選完之后點(diǎn)擊繼續(xù)

5.讀條安裝中，安裝完畢之后既可以運(yùn)行軟件

切圖方法

1.首先我們要做的是打開PS，在編輯菜單欄中找到遠(yuǎn)程連接，然后設(shè)置密碼，勾選啟動(dòng)遠(yuǎn)程連接，在點(diǎn)擊確定

2.然后在像素大師的右上角，找到下圖紅框處的切圖工具，點(diǎn)擊運(yùn)行

3.出現(xiàn)如下界面，設(shè)置可以參考下圖，也可以自行設(shè)置，點(diǎn)擊紅框處可以設(shè)置切圖輸出位置

4.準(zhǔn)備完畢之后，我們選中一個(gè)圖標(biāo)，再點(diǎn)擊切所選圖層

5.點(diǎn)擊圖中知道了，然后等待切圖

6.切圖結(jié)束之后就可以在所選文件夾中找到圖標(biāo)了

智能標(biāo)注

1.尺寸標(biāo)注

點(diǎn)擊選中圖片中的區(qū)域之后，點(diǎn)擊圖片中左上角的紅箭頭處即可進(jìn)行尺寸標(biāo)注

尺寸標(biāo)注的數(shù)據(jù)展現(xiàn)如下圖

2.文本樣式標(biāo)注

點(diǎn)擊圖中的文本，然后選擇左上箭頭的文本樣式標(biāo)注，即可產(chǎn)生字體、字號(hào)、對(duì)齊方式、色值等的數(shù)據(jù)信息。

圖中就是文本的相關(guān)信息

3.區(qū)域標(biāo)注

點(diǎn)選圖中的區(qū)域?qū)ο?，然后點(diǎn)擊左上箭頭的區(qū)域標(biāo)注，即可獲得長(zhǎng)度和寬度的數(shù)值

圖中就是區(qū)域的長(zhǎng)寬數(shù)值

4.內(nèi)部間距標(biāo)注

首先我們選中大圖，可以看到大圖外部有邊框產(chǎn)生，然后按住ctrl選擇大圖中的一個(gè)對(duì)象，這樣A就包裹了B，點(diǎn)擊左上箭頭的內(nèi)部間距標(biāo)注

即可獲取AB之間的內(nèi)部間距

5.矢量圖層樣式

選中對(duì)象之后，點(diǎn)擊左邊箭頭處的矢量圖層樣式

即可獲得相關(guān)矢量圖層的信息。

常見問題

智能標(biāo)注功能適用于什么文件?

目前PxCook的智能標(biāo)注適用于.psd文件和sketch畫稿。.psd文件直接拖入PxCook即可開始智能標(biāo)注。Sketch可通過下載插件，將設(shè)計(jì)稿導(dǎo)入到PxCook。

能直接生成自動(dòng)標(biāo)注嗎?

可以。自動(dòng)標(biāo)注是在智能標(biāo)注的基礎(chǔ)上更進(jìn)了一步——在pxcook中，只要拖拽psd或插件上傳sketch，就可以在頂部選擇開發(fā)模式后，點(diǎn)擊圖層元素，直接生成代碼。生成的包括文字信息，尺寸間距，陰影漸變圓角等所有信息。隨時(shí)可以通過設(shè)計(jì)稿查看前端代碼。

為什么我的Ps設(shè)計(jì)稿拖入后會(huì)一片空白?

因?yàn)镻s沒有在設(shè)計(jì)稿保存前勾選最大兼容模式，win和mac的最大兼容模式勾選方法如下：

Win：點(diǎn)擊頂部菜單的編輯，找到首選項(xiàng)，在首選項(xiàng)彈窗內(nèi)勾選最大兼容模式

Mac：點(diǎn)擊頂部的Photoshop按鈕，找到首選項(xiàng)，在首選項(xiàng)彈窗內(nèi)勾選最大兼容模式

切圖PxCook也支持嗎?

標(biāo)注切圖，在PxCook里，一起搞定。

更新日志

v3.8.7：

1.優(yōu)化：標(biāo)注過程可能會(huì)引發(fā)卡頓的問題。

2.優(yōu)化：對(duì)于設(shè)計(jì)稿中元素自動(dòng)識(shí)別的體驗(yàn)優(yōu)化。

v3.8.6：

1.優(yōu)化：新用戶引導(dǎo)的優(yōu)化。

2.優(yōu)化：設(shè)計(jì)稿中重疊的元素不易選擇的問題。

3.優(yōu)化：體驗(yàn)細(xì)節(jié)若干。

4.修復(fù)：從切圖面板切換回主窗體后，當(dāng)前畫板內(nèi)容消失的bug。