Skip to content

移动、缩放与变换

画布上的每个对象都可以重新定位、缩放、旋转和翻转,方式有两种:在画布上拖动,或在属性面板中输入精确数值。

快速概览

  1. 拖动选中的对象即可 移动。智能参考线会把它吸附到对齐位置。
  2. 拖动角手柄可 缩放(默认等比),拖动边手柄则只沿一个方向缩放。拖动角手柄时按住 Alt 可自由拉伸。
  3. 拖动选区上方的旋转手柄可 旋转,也可以在 Layout 标签中输入精确角度。
  4. 在 Layout 标签的 Arrange 菜单中水平或垂直 翻转
  5. 用 Ctrl 或 Cmd 加 L 锁定 对象,防止误改。
  6. 属性面板 的 Layout 标签中为位置、尺寸和旋转 设置精确数值

详细参考

移动

拖动任意选中的对象即可重新定位。拖动时,智能参考线 会显示它与其他对象及画布边缘的对齐关系,Layout 标签中的 X 和 Y 字段也会实时更新。选中对象后按住 Alt,可叠加显示实时距离测量:对象到各条画布边缘的间距;如果在仍按住 Alt 的同时把鼠标悬停到第二个对象上,还会显示两者之间的间距。若要像素级精确定位,请在 X 和 Y 字段中输入数值(见 精确数值)。

缩放

拖动选区四周八个手柄之一:

手柄位置行为
角手柄四个角各一个默认等比(统一)缩放。拖动时按住 Alt 可只拉伸一个维度,打破宽高比
上 / 下上下边缘的中点只缩放高度
左 / 右左右边缘的中点只缩放宽度

拖动角手柄会自动保持宽高比,因此照片和 logo 无需按任何键就能维持比例。只有当你有意压扁或拉伸时才按住 Alt。各个边中点手柄只改变单一维度,因此它们本身就会让对象变形。

旋转

旋转手柄是选区上方那个圆形手柄(顶部两个图标中左侧那个;旁边的是移动手柄)。拖动它即可旋转,角度会在 Layout 标签中实时更新。旋转是自由的,没有内置的角度吸附,因此若需要精确角度,请在 Layout 标签的 Rotation 字段中直接输入数字,而不是靠拖动目测。

翻转

翻转位于属性面板 Layout 标签的 Arrange 分组中。点击 Flip 下拉菜单选择方向:

选项操作
Horizontal把对象左右镜像
Vertical把对象上下镜像

翻转会随对象一起保存,在保存和重新加载后依然保留。翻转不会改变对象的宽度、高度或位置,只改变它朝向的方向。

锁定

Ctrl 或 Cmd 加 L 可切换对象是否能被变换:

状态结果
已锁定它的移动、缩放和旋转全部冻结,手柄消失,在画布上也无法再被点击或选中
未锁定恢复正常交互

由于锁定的对象无法在画布上被选中,请从图层列表中选中它来解锁(再次按 Ctrl 或 Cmd 加 L)。参见 选择对象组合与图层

对齐与分布

选中范围对齐的作用
一个对象把它对齐到画布边缘或中心
两个或更多对象以选区中最外侧的对象为基准,把它们彼此对齐
三个或更多对象还会解锁分布功能,沿某个轴均匀排布对象

可用的按钮包括左对齐、水平居中、右对齐、顶对齐、垂直居中、底对齐、水平分布和垂直分布。对于单个对象,对齐按钮位于其下方出现的选区工具栏中,会把它吸附到部件的边缘或中心。当选中两个或更多对象时,Layout 标签会显示一个 Align selection 分组,把它们彼此对齐;而 Arrange 菜单中的 Distribute 选项要在选中三个或更多对象后才会解锁。

重新排列(z 轴顺序)

把对象前移或后移,即可改变谁压在谁之上。你也可以在 图层列表 中拖动行,完全掌控堆叠顺序。

精确数值

属性面板的 Layout 标签提供了数值字段,可替代拖动:

字段说明单位
X对象左上角相对部件左边缘的水平位置px
Y对象左上角相对部件上边缘的垂直位置px
W宽度(设置它会重新缩放对象)px,最小为 1
H高度(设置它会重新缩放对象)px,最小为 1
约束比例W 和 H 之间的锁定按钮。开启时(默认),改动 W 会等比缩放 H,改动 H 会等比缩放 W开关
Rotation角度,以度为单位

按 Enter,或把焦点移出字段,即可应用数值。X 和 Y 始终指对象真正的左上角,即便是以中心为锚点的对象也是如此,因此数字与你所见一致。直接输入数值是让对象精确到像素的方式,尤其是当你需要在多个部件之间保持相同尺寸或位置时。

分步操作

把对象缩放到精确的像素尺寸

  1. 点击对象将其选中,然后打开右侧属性面板中的 Layout 标签。
  2. 若要保持对象比例,让约束比例锁(W 和 H 之间的按钮)保持开启,这也是默认状态。在 W 中输入宽度,H 会自动跟随。若要单独设置 W 和 H,先点击锁按钮将其关闭。
  3. 输入数值并按 Enter。对象会围绕左上角重新缩放。字段接受的最小值为 1 px。

把对象旋转到精确角度

  1. 选中对象并打开 Layout 标签。
  2. 在 Rotation 字段中输入角度,例如 45 或 -90,然后按 Enter。对象会精确旋转到该角度。
  3. 拖动对象上方的圆形旋转手柄也可以,但它不会吸附到固定角度,因此当角度必须精确时请使用字段输入。

精确地复制并偏移对象

  1. 选中对象并按 Ctrl 或 Cmd 加 D。副本会向右和向下各偏移 20 px 出现,并成为新的选中对象。
  2. 选中副本,打开 Layout 标签,输入精确的 X 和 Y 数值把它放到想要的位置,或输入 W 和 H 来调整尺寸。重复按 Ctrl 或 Cmd 加 D,就能以相同的 20 px 步长持续复制。

水平或垂直翻转对象

  1. 选中对象并打开 Layout 标签。
  2. 在 Arrange 分组中,点击 Flip 下拉菜单并选择 Horizontal 或 Vertical。
  3. 对象会就地镜像。它的尺寸和位置保持不变,只有朝向改变,翻转会随设计一起保存。

只沿一个方向移动对象

  1. 选中对象并打开 Layout 标签。
  2. 若要水平移动而不改变垂直位置,只改动 X 值,保持 Y 不变。若只想垂直移动,则只改动 Y。
  3. 按 Enter 应用。由于两个字段相互独立,另一个方向会精确地保持原位。

锁定对象,避免误移动

  1. 选中对象并按 Ctrl 或 Cmd 加 L。它的手柄会消失,也不再响应画布上的点击或拖动。
  2. 若要再次处理它,打开图层列表,在那里选中该对象,然后按 Ctrl 或 Cmd 加 L 解锁。参见 组合与图层

常见任务

  • 拖动时打破宽高比: 拖动角手柄时按住 Alt,即可拉伸或压扁某一个维度。松开 Alt 即回到等比拖动。
  • 提交前检查间距: 选中对象后按住 Alt 查看到画布边缘的距离,再(仍按住 Alt)把鼠标悬停到另一个对象上,读取两者之间的间距。
  • 让对象在部件上居中: 选中单个对象,使用它下方选区工具栏中的水平居中和垂直居中按钮。
  • 让三个或更多对象均匀分布: 全选它们,然后使用 Layout 标签 Arrange 菜单中的水平分布或垂直分布。
  • 重新堆叠重叠的对象:] 前移一层,按 [ 后移一层,或在 图层列表 中拖动行。
  • 让一个对象匹配另一个的尺寸: 在 Layout 标签中读取第一个对象的 W 和 H,选中第二个,在它的 W 和 H 中输入相同的数字。
  • 摆正一个已旋转的对象: 把它的 Rotation 字段改回 0,让它重新回正。

键盘快捷键

快捷键操作
Alt + drag corner handle自由缩放(打破宽高比)
Alt(选中对象时按住)显示到边缘和到悬停对象的距离测量
Ctrl/Cmd + D以 20 px 偏移复制选中对象
Ctrl/Cmd + L锁定或解锁
]前移一层
[后移一层

小提示

需要精确时就直接输入

拖动很快,但 Layout 标签中的 X、Y、W、H 字段才是让对象精确对齐到像素的方式。

角手柄拖动本就保持比例

拖动角手柄时,照片和 logo 会自动保持形状,你无需按住任何键。只有当你确实想拉伸某一个维度时才用 Alt。

疑难解答

  • 缩放或旋转时按 Shift 没有反应。 这里 Shift 不是修饰键。角手柄拖动本就是等比的,打破宽高比的键是 Alt 而不是 Shift。旋转完全没有基于按键的角度吸附,因此需要精确数值时请在 Layout 标签中输入角度。
  • 我的角手柄拖动无法只拉伸一边。 那是默认的等比行为。拖动角手柄时按住 Alt 即可改变单一维度,或使用某个边中点(上、下、左或右)手柄。
  • 拖动图片的边手柄时它被裁剪了,而不是缩放。 在图片上拖动边中点手柄时按住 Ctrl 是一种快速裁剪,按下 Ctrl 时手柄甚至会变成条形。松开 Ctrl 后再拖动即可正常缩放。裁剪会至少保留 20 px。参见 图片编辑
  • 方向键无法移动我的对象。 方向键微调没有接入。请拖动对象,或在 Layout 标签中输入精确的 X 和 Y 数值。
  • 我无法再点击我的对象了。 它多半被锁定了。锁定的对象无法在画布上被选中,因此请打开图层列表,在那里选中它,然后按 Ctrl 或 Cmd 加 L 解锁。
  • Distribute 选项是灰的。 分布需要选中三个或更多对象。只选一两个时,只有对齐可用。
  • 找不到 Align selection 分组。 只有选中两个或更多对象时,Layout 标签才会显示 Align selection。若要把单个对象对齐到部件,请使用对象下方选区工具栏中的对齐按钮。
  • 我的对象在拖动时突然跳去对齐。 那是智能参考线把它吸附到了另一个对象或某条画布边缘上,目的是帮你快速对齐。关于吸附如何工作以及如何控制它,参见 参考线、网格与标尺

相关内容