了解如何导出和下载设计规范中的资源。
优质
小牛编辑
138浏览
2023-12-01
了解如何导出和下载设计规范中的资源。
导出设计规范中的资源
如果您为图层添加了导出标记,并在发布设计规范时,在其中包含了资源,则您可以通过已发布的设计规范链接下载这些资源。矢量资源以 SVG、PNG 和 PDF 格式提供,而位图资源以 PNG 和 PDF 格式提供。
为图层添加导出标记
将已添加导出标记的图层作为资源包含在设计规范中。如需为资源添加导出标记,请选择画布上的任意图层,并选择以下任一选项:
- 单击任意画板图层,并单击弹出菜单中的“添加导出标记”复选框。
- 右键单击画布上的图层,并选择弹出菜单中的“添加导出标记”。
- 使用macOS 中的键盘快捷方式,以及 Windows 操作系统中的 键盘快捷方式。
- 打开图层面板,然后单击“添加导出标记”图标(位于图层名称旁边)。
如需导出多个资源,请选择同一画板的多个图层,并单击“添加导出标记”。
如果您导入或打开的 Illustrator 或 Photoshop 文件包含图片,则 XD 将自动为所有位图图像添加导出标记。
为资源添加导出标记
发布带有资源的设计规范
发布设计规范时,如果您在其中包含资源并与开发人员共享已发布链接,您就向开发人员提供了一个集中位置来下载这些资源。
- 在 XD 中为图层添加导出标记。
- 单击屏幕右上角的“共享”按钮,并选择“共享以开发”。在设计规范中,假设设计采用 1 倍的分辨率。
共享以开发 - 从“针对下列平台导出”下拉列表中,选择要针对哪一平台导出设计。选择“包括供下载的资源”选项,然后单击“创建链接”。
在原型中包括资源由于平台所对应的设计有所不同,每个平台都具备单独的一组分辨率设置:- Web:资源将以“1 倍”和“2 倍”分辨率导出。
- iOS:资源将以“1 倍”、“2 倍”和“3 倍”分辨率导出。
- Android:资源会针对以下 Android 屏幕密度进行优化并导出:
- ldpi — 低密度 (75%)
- mdpi — 中等密度 (100%)
- hdpi — 高密度 (150%)
- xhdpi — 超高密度 (200%)
- xxhdpi — 超超高密度 (300%)
- xxxhdpi — 超超超高密度 (400%)
- 要在浏览器中打开已发布的设计规范,请单击“在浏览器中打开”图标,然后选择画板以查看资源。浏览器会显示所选资源以及其他画板详细信息。在将指针悬停在资源上时,上下文选择会用蓝色突出显示所选资源。
从设计规范下载资源
在您与设计人员共享已发布设计规范后,开发人员可以从中下载资源。开发人员可以单独下载资源,也可以同时下载。
您也可以使用 Cmd+ A 或 Ctrl+A 键选择所有资源,或者按下 Shift 键进行多选。资源会以 .zip 文件的形式下载到计算机上的下载文件夹中。您可以将矢量资源的格式更改为 SVG、PDF 和 PNG,并将位图资源的格式更改为 PNG 和 PDF。
下载资源