当前位置: 首页 > 文档资料 > Adobe XD 用户指南 >

在 XD 中检查设计规范

优质
小牛编辑
115浏览
2023-12-01
了解如何在 XD 中检查设计规范。

在接收设计规范时,您可以检查画板中不同对象的颜色、文本、测量值和热点等属性。

查看和检查测量值

在画板中选择对象以检查其测量值和样式。

要确定对象之间的间距,请选择一个对象,然后将指针悬停在画板中其他对象的上方。

检查对象的测量值

查看颜色、字符样式和资源

在设计规范链接中选择画板时,该画板中使用的所有独特颜色都显示在“颜色”部分中。您可以查看可用的颜色格式,并使用下拉列表来选择您偏好的格式。例如,如果您喜欢以 HSLA 格式进行处理,请使用下拉列表以将颜色格式转换为 HSLA。此更改会在整个会话中保持不变,在查看其他画板时也会使用相同的颜色格式。

与此类似,您可以在“字符样式”部分中查看画板中的所有独特字符样式。

如果您在画板中标记了任何要导出的图层,则可在“资源”部分中查看这些图层的颜色和字符样式。

注意:在画板中选择某个对象时,用于该对象的颜色将显示在“外观”部分中。

将颜色从一种格式转换为另一种格式

查看、检查和复制文本属性

要检查画板中的文本属性,请选择一行文本。您也可以从“属性”面板复制文本及其颜色。

Adobe XD 不带单位,它关注的是对象之间的关系。例如,如果您设计的 iPhone 6/7 画板的尺寸是 375 x 667 个单位,并且它使用 10 个单位字体大小的文本,无论您的设计缩放到怎样的实际大小,此关系都保持不变。

但是,设计规范会根据平台为无单位的基础测量值添加默认单位(如像素、点和 dp),使您能够更好地理解您的目标开发平台的测量值。您也可以在设计规范中将一种测量单位从一种单位更改为另一种单位。

更改测量单位

查看和检查布局网格属性

要查看布局网格,请在“属性”检查器中切换“布局网格”。此选项将为设计规范中的所有画板激活布局网格。

使用切换按钮从画板中移除布局网格。使用“不透明度”滑块可控制布局网格的透明度。

如果您已在布局网格中设置了参数,请将指针悬停在这些参数上以在显示的画板中突出显示它们。

注意:设计规范不显示方形网格

在发布设计规范链接之前,请确保在相关画板中启用布局网格。默认情况下,如果您未在设计中使用布局网格,则它们不会在设计规范链接中出现。

布局网格属性

查看和检查叠加

在设计规范视图中,您可以在 UX 流程屏幕中检查叠加连接。

如需检查应用的叠加,请导航到“属性”检查器中的“交互”部分,然后单击显示的内容,或在按下 Shift 键的同时单击设计规范中的热点。

查看和检查叠加

您可以检查已应用叠加的画板详细信息、样式和目标信息:

  • 视口大小:显示可见区域尺寸,该尺寸会基于用于访问页面的设备的大小发生变化。
  • 设计大小:显示画板的设计尺寸。
  • 叠加位置:以像素、点和 dp 格式,参考源画板来显示叠加的位置。
  • 颜色:以 RGBA、Hex 和 HSLA 格式显示使用的颜色。
  • 字符样式:以像素、点和 dp 大小显示字符样式。叠加位置的格式会基于设置的字符样式发生变化。
  • 交互:显示与目标画板关联的交互和操作的相关信息。

如需恢复源画板,请按 Esc 或在屏幕上单击“关闭叠加”。

查看和检查固定对象

在设计规范中,当您在画板中单击固定对象时,其左上角会显示一个图钉图标。 

检查固定对象

查看和检查热点

如需查看在画板中定义的热点,请按住 Shift 键。如需检查热点,请在“交互”部分中单击显示的内容,或者按住 Shift 键并单击热点。

更多此类内容

  • 使用设计规范
  • 发布设计规范
  • 设计规范导航
  • 审查和评论设计规范
  • 从设计提取资源