1. 插件对 Photoshop 的兼容性支持

支持 Photoshop CC 2015 及以上版本。

2. 开启插件

安装好 PxCook 3.9.x 及以上版本后。首次开启打开PxCook，即已经为您安装好全新切图插件。 打开 Photoshop （如果已开启，则需要您重启一下Photoshop，以确保插件被正确加载。） 通过 窗口 > 扩展功能 > PxCook-切图 开启插件。

3. 切图的标记与尺寸制定

在 Photoshop 的右侧边栏，找到PxCook-切图面板。

标记切图

选中想要切图的 图层 或者 图层组 ，然后点击切图面板上的 标记为切图 按钮。

当被标记为切图后，将在图层前面增加 p:: 作为标记。如果要取消切图，点击 取消标记 即可。

自定义切图的尺寸

需要确保被标记的图层为 图层组 ，如果不是图层组的话，需要将指定的图层进行打组。

之后我们在组内创建一个名为 @bounds 或 # 的图层，通过 矩形工具，在该图层内绘制一个矩形来描述要切出切片的范围，如下所示：

这样，上图中的 heart_icon 图层组即会按照组内的 @bounds 图层的范围来进行切图了。

4. 导出画板与切图到 PxCook 或 导出切图到本地

设备和分辨率的选择

该设备和分辨率选项，需要您根据当前设计稿的尺寸来进行选择（例如：您的设计稿是 iOS 设备且宽度为 375，那需要您将设备选择为iOS，分辨率选择为1x）。

设备类型和设计稿分辨率的选项，只会决定标记的切图的生成尺寸，标记的切图将会根据您设置的设计稿分辨率为基准，缩放为当前项目所需的各个尺寸。

例如：您在 Photoshop 某个画板中，有个尺寸为 20×20 px 的标记切图，如果您将导出面板的当前设计稿分辨率设置为 iOS 1x，那么该标记切图会被同时输出为 20×20 px 的1倍切图，40×40 px 的2倍切图，和 60×60 px 的3倍切图。

又例如：如果您将上述导出面板的当前设计稿分辨率设置为 iOS 2x，那么该标记切图会被同时输出为 10×10 px 的1倍切图，20×20 px 的2倍切图，和 30×30 px 的3倍切图。

设备类型和设计稿分辨率的选项，并不会影响您导出的图的尺寸。

例如：您在 Photoshop 中某个画板的尺寸为 375×667 px，其导出到 PxCook 的之后的尺寸也为 375×667 px。

Android 设计稿同理，需要您根据当前在 Photoshop 中的设计稿的尺寸，选择对应的正确的分辨率。

导出画板与切图到 PxCook (推荐)

先保存 Psd，然后点击导出到 PxCook即可将画板附带切图导出到PxCook中，将如下的 Photoshop 画板，按照如图所示的设置导出到 PxCook：

在 PxCook 中，进入画板，切换到 开发模式 ，即可在右侧边栏查看到如下的画板及切图数据：

导出切图到本地

点击面板右下角【导出当前选中到本地】即可将当前选中的图层或组直接导出到本地文件夹中。

点击面板右下角【导出所有切图到本地】即可将当前Psd中所有标记为切片的图层保存在本地文件夹中。

之后在弹出的对话框中，可以选择需要导出的分辨率，默认为导出全部。