涨姿式！让你一分钟玩转XD切图

"关注像素大厨，把繁琐的事情交给我"👉

闲言碎语不要讲，接下来咱们话端详~

此次给你们带来 XD 切图+自动标注+线上协做＜1分钟!

相比较上一版本 XD 导入速度至少提高5倍

那么让咱们来看看如何玩转 XD 切图吧！！

大幅提升工做效率

• 导出切图到PxCook

您能够在 Adobe XD 的图层中，激活“添加导出标记”图标，或在 Adobe XD 的右边栏中最后一个分栏中，将“添加导出标记”勾选上。在 Adobe XD 中，导出当前设计稿到 PxCook 中。

新版本中，咱们加入了对 Adobe XD 的切图支持，同时完全优化了从 XD 到 PxCook 的导入过程，使得导入速度比以前提高了5倍！！让设计师和工程师之间的衔接更加紧密高效~

• 定义切图的范围

在有些状况下，可能须要特殊定义切图的范围，以固定切图的尺寸。咱们能够经过将一个“描述范围”的形状图层放置于须要切图的组内，而后将该形状图层变为透明便可，以下图所示：

支持自动标注

• 支持工程师查看自动标注

在 PxCook 软件开发模式下，工程师可经过点选画板中元素的方式，直接查看元素之间的间距「图1」。同时在软件右边栏中可查看该元素的详细尺寸，样式，及相应代码「图2」，最后工程师可直接选择并下载相应切图「图3」。

• 切换百分比标注

在开发模式下，工程师能够经过画板右下角开关来激活百分比标注模式。百分比标注的参考层是经过查看标注的两个元素自动计算获得的。您也能够经过在画板中右键来设置当前选中的元素作为百分比标注的参考层。要注意的是在同一个画板中，只容许同时存在一个手动设置的参考层。

在线协做效率提高

设计师可添加协做人员进入项目，完成的设计稿及切图可直接导入到 PxCook 协做项目中，并自动适配工程师所需的尺寸，工程师可直接查看相应代码，一键复制所需代码！

iOS 类型下: 支持 Objective-C Swift 和 ReactNative 类型的代码生成。

Android 类型下: 支持 XML 和 ReactNative 类型的代码生成。

Web 类型下: 支持 CSS 类型的样式代码生成。

---

-End-

以上就是本次 PxCook XD 切图功能的优化成果，

感兴趣的小伙伴们快来体验一下吧！为“产●设●研”而生！

微信关注公众号：像素大厨PxCook

可获取更多设计资讯，和各类做图小技巧