九宫格切片对象 | hyperPad Documentation
Logo
Documentation入门九宫格切片对象

9 Slice 对象(有时也称为 9 Patch)是带有用户自定义边距的对象,这些边距会将图像划分为 9 个区域,并改变对象的缩放方式。

创建用户界面或其他需要在缩放时保持特定外观的项目元素时,通常会用到 9 Slice 对象。

调整 9 Slice 对象的大小时,通常会发生以下 3 种情况:

  • 四角会移动。
  • 两侧区域会拉伸。
  • 中间部分只会缩放。

如果从下方的图像开始尝试缩放,就能轻松看出 9 Slice 对象和普通图像之间的区别。

普通图像(没有 9 Slice 边距)水平缩放至 230%。请注意,图像的四角被拉伸了,看起来不再是正方形。

将原始图像转换为 9 Slice 对象,并设置 20% 的边距(红线)。

如果将 9 Slice 对象水平缩放至同样的 230%,就能看到对象的四角仍保持原来的形状。

创建 9 Slice 对象

你可以将任何图像转换为 9 Slice 对象。为此,请打开 资源库,然后找到要转换为 9 Slice 对象的图像。

找到图像后,用手指按住它,直到出现资源菜单。在资源菜单中,选择“转换为 9-Slice”。

转换为 9 Slice 后,系统会自动为你创建 40% 的所有边距。

修改默认边距

如果要更改默认边距,请在资源菜单中选择“预览”。

“9-Slice 预览”会直观地显示图像上的边距线,并提供输入栏,让你设置边距位置(以图像的百分比表示)。

要更改边距,可以触摸并拖动每条边距线上的白色圆点,也可以手动输入数值。请注意,拖动边距线时,手动输入栏会自动更新为新的位置百分比。

修改对象专属边距

你还可以更改添加到场景中的每个 9 Slice 对象各自的边距,而不会影响原始 9 Slice 对象。

为此,只需轻点画布上的 9 Slice 对象,然后在对象属性中切换到“常规属性”选项卡(第一个选项卡)。

在“常规属性”选项卡中,你可以查看 4 条边距,并手动更改它们的位置。