Adobe XD 的新增功能

2019 年 10 月版的 XD 拥有以下增强功能：

• 混合效果
  
• 轻移和轻移调整大小
• 通过重叠图层选择

从 XD 23.0 开始，您可以应用非破坏性混合效果来设计图像或图形资源的样式。使用混合效果改变对象及其底层对象的颜色混合方式，提升设计并让设计栩栩如生！

有关应用混合效果的更多信息，请参阅应用混合效果。

从 XD 23.0 开始，您可以将这些键盘快捷键与箭头键组合在一起，以网格大小为增量精确控制 UI 元素的位置和大小。

• Shift + 箭头键：以 10 像素为增量移动选区。
• Cmd + 箭头键：以 1 像素为增量调整选区大小（元素固定在左上角）。
• Cmd + Shift + 箭头键 (Mac) 和 Alt + Shift + 箭头键 (Win)：以 10 像素为增量调整选区大小（元素固定在左上角）。

启用方形网格时：

• Shift + 箭头键：首先移动选区与网格对齐，然后以网格大小为增量移动选区。
  
• Cmd + Shift + 箭头键 (Mac) 和 Alt + Shift + 箭头键 (Win)：调整选区大小以与网格对齐，然后以网格大小为增量调整选区大小（元素固定在左上角）。

XD 23.0 扩展了键盘快捷键的操作：按住 Cmd 并单击或按住 Ctrl 键并单击，可以向下钻取设计画布上的对象的叠置顺序以及设计规范。

如果有多个图层堆叠在一起，按住 Cmd 并单击或按住 Ctrl 键并单击可选择所选图层下方的下一个对象。到达下方的最后一个图层后，使用相同的键盘快捷键遍历回到最顶层图层。

要查看并检查隐藏在设计规范中重叠图层下方的图层，请将鼠标悬停在画板上的特定区域并右键单击。该像素点会显示图层列表及其上下文详细信息。您还可以按住 Cmd 并单击，按顺序向下钻取并查看图层属性。

有关访问重叠图层的更多信息，请参阅调整对象的大小和旋转对象。

2019 年 8 月版的 XD 拥有以下增强功能：

• 在 Photoshop 中编辑
• 改进了“插件”面板
• 设计规范中的 CSS 代码片段
• 组件边界的改进
• 减少小数像素
• 在网格视图和流程视图之间切换

XD 增强了与 Adobe Photoshop 的集成，允许您直接在 Photoshop 中打开和编辑 XD 图像并实时更新它们。当您在 Photoshop 中编辑和保存图像时，XD 会保存平面文件，将位图（而不是编辑后的文件）放置到 XD 中。 

如需更多信息，请参阅使用外部资源

使用最新版本的 XD，您可在 XD 用户体验中，随设计画布一起启动 XD 插件并与之交互。新的“插件”面板与“图层和资源”面板类似，可让用户在 XD 中轻松查看和修改插件。这可帮助您在处理 XD 设计时维护创意流程。 

有关更多信息，请参阅查看和安装插件。

为了帮助将设计转换为可供使用的网站，您可以从设计规范中复制 CSS 代码片段并将其粘贴到代码中。

发布设计规范时，如果您在“共享以开发”窗口中选择“Web”作为输出目标，则 CSS 代码将自动生成。发布设计规范时，XD 会自动显示所选图层的 CSS 代码片段。

如需更多信息，请参阅在 XD 中检查设计规范。

组件支持各种覆盖，并可针对不同屏幕大小无缝调整尺寸，但在应用效果或重新组织对象时可能难以使用。在以前的 XD 版本中，如果您添加的对象超出其原始主组件的边界，则内容会被剪切。

要修复组件边界的问题，请选择主组件，右键单击以选择“调整边界以适应内容”。通过调整组件边界来显示主组件和实例中的所有剪切对象。

如果您创建新组件：

• 阴影和模糊会在组件定界框之外渲染，并且
  
• 边界区域会适应组件中的所有内容。

针对 HiDPI 屏幕设计时，小数像素会导致内容扭曲。从 XD 22.0 开始，为了消除设计摩擦和图像失真，XD 在调整对象组、组件和图像蒙版的大小时会舍入像素值。但是，XD 会保留在 XD 22.0 之前版本中所创建内容的小数值。  

若要全面了解设计流程以及画板布局信息，请单击屏幕左上角的原型名称或设计规范。在默认网格视图中，您也可以选择在网格和流程视图之间切换以显示以下内容：

• 网格视图显示所有采用网格格式布局的画板，您可以检查或导航到画板。
• 流程视图将画板的设计和布局层次结构展现出来。

有关更多信息，请参阅在 XD 中的设计规范之间导航。