了解「标尺」与「参考线」

设计师做图时，经常需要测量图层边距、间距，以及调整图层的X、Y值。 「标尺与参考线」功能，可以帮助设计师更直观、精准地定位及度量图层与元素，统一格式、高效对齐。

「标尺」常用于辅助设计师更精确地调整图层尺寸， 中可显示当前画布和根容器的相对坐标尺。

「参考线」以浮动的状态显示在图像上方，常与“标尺”共同使用，可以帮助用户精确地定位图像或对齐元素。

标尺

「标尺」与画布、图层的 X、Y 值相对应，你可以通过标尺更直观地查看坐标数值。 可显示「当前画布」和「根容器」两种相对坐标尺。

显示/隐藏标尺

使用 作图时，你可以通过以下方式显示或隐藏标尺：

使用快捷键显示/隐藏标尺 设计界面

显示/隐藏标尺时，同时也会显示/隐藏参考线。

高亮标尺

选中图层后，在标尺上会高亮显示图层在画布上投影的宽高和坐标。设计师可以在这里更直观地查看图层的 X、Y 值。

高亮块坐标是图层在标尺上的投影坐标

画布标尺和容器标尺

可显示「当前画布」和「根容器」两种相对坐标尺。

画布标尺

以整个画布为绝对坐标系，当没有选中容器或者没有选中容器内元素时，仅显示画布标尺。

容器标尺

以根容器左上角作为（0，0）的坐标系，当选中容器或容器内的元素时，显示容器标尺。

Tips：

容器内元素 X，Y 值参照坐标为Frame标尺选中其他情况下的图层时，标尺为其父容器标尺。多选图层时，选中的多图层若属于同一个父图层，标尺显示为其父图层坐标。选中的多图层若不属于同一个父容器，标尺显示为画布坐标。

参考线

「参考线」以浮动的状态显示在图像上方，常与“标尺”共同使用，和标尺一样，参考线也有画布和容器两种，可以在设计过程中帮助设计师精确地定位图像或对齐元素。

添加参考线

在标尺显示时，鼠标点击标尺区域，并向画布或容器中拖拽出一条参考线，

Tips：

拖拽更改参考线

参考线可在画布内随意拖动，也可拖入容器中。

调整图层大小时，如果图层边界和参考线重合，会优先拖动图层边界。如果想拖动参考线，取消图层选中即可

微调参考线

需要精确修改参考线位置时，点击选中参考线，选中后可以使用键盘方向键上下左右微调：

Tips:

若仅使用方向键调整参考线，每次调整距离为 1px。若按 shift + 方向键调整参考线，每次调整距离为 10px。

删除参考线

将参考线从画布拖拽到标尺区域，松手即可删除该条参考线。或选中参考线，点击 键删除。

评价此篇文章： 有帮助 无帮助

本篇文章对你是否有帮助？ 有帮助 无帮助，我们期待着你的反馈。