位置和大小 UI 对象

*此内容使用人工智能（Beta）翻译，可能包含错误。若要查看英文页面，请点按此处。

除非 UI 对象受布局结构或大小修饰符/约束的控制，否则您可以完全控制它们的位置和大小。您还可以设置 Z‑index 层叠顺序，以确定对象的重叠顺序。

核心属性

所有 GuiObjects 共享一组核心属性，以定位、调整大小、锚点和层级它们在屏幕内或游戏中的容器内。

位置

Position 属性是一个 UDim2 坐标集，用于沿 X 和 Y 轴定位对象。UDim2 由每个轴的 Scale 和 Offset 值表示：

Scale 值表示容器在相应轴上的百分比大小，加上任何 Offset 值。
Offset 值表示在相应轴上移动对象的像素数，加上任何 Scale 值。

要编辑选定的 GuiObject 的位置，请单击属性窗口中的位置字段，并输入新的 UDim2 坐标集。

在 Studio 中输入 UDim2 时，括号和空格是可选的 — 您可以简单地输入四个用逗号分隔的值，例如 0.25,40,0.1,20，Studio 将推断出预期的值集。

当输入单个数字时，Studio 也会推断出预期的值集。例如，仅输入 0.5 将被转换为 {0.5, 0},{0.5, 0}，因为 0.5 可能是 Scale 值的 50%。相反，输入 20 将被转换为 {0, 20},{0, 20}，因为 20 可能是 20 像素的 Offset 值，而不是 2000% 的比例。

大小

Size 属性是一个 UDim2 坐标集，用于沿 X 和 Y 轴调整对象的大小。UDim2 由每个轴的 Scale 和 Offset 值表示：

Scale — 表示容器在相应轴上的百分比大小的值，加上任何 Offset 值。
Offset — 表示对象在相应轴上的像素大小的值，加上任何 Scale 值。

要编辑选定的 GuiObject 的大小，请单击属性窗口中的大小字段，并输入新的 UDim2 坐标集。

在 Studio 中输入 UDim2 时，括号和空格是可选的 — 您可以简单地输入四个用逗号分隔的值，例如 0.75,0,0.25,0，Studio 将推断出预期的值集。

当输入单个数字时，Studio 也会推断出预期的值集。例如，仅输入 0.5 将被转换为 {0.5, 0},{0.5, 0}，因为 0.5 可能是 Scale 值的 50%。相反，输入 20 将被转换为 {0, 20},{0, 20}，因为 20 可能是 20 像素的 Offset 值，而不是 2000% 的比例。

AnchorPoint

AnchorPoint 属性定义了对象更改位置和大小的原点。默认的 AnchorPoint 值为 (0, 0)，这将锚点放置在对象的左上角。

AnchorPoint 值是从 0 到 1 的分数，相对于对象的大小，这意味着具有 AnchorPoint 值 (0.5, 0.5) 的对象将锚点放置在对象的水平和垂直中间（50%），对其位置或大小的任何更改都将从此点向外移动和缩放。

要查看和编辑选定的 GuiObject 的锚点：

在属性窗口中，单击 AnchorPoint 字段。
输入新的 Vector2 坐标并按 Enter。

当输入单个数字时，Studio 会推断出预期的值对。例如，仅输入 0.5 将被转换为 0.5, 0.5，以获得中心锚点。

ZIndex

ZIndex 属性定义了 GuiObjects 渲染和重叠的层级顺序。如果您想创建新的渲染层，必须为每个对象将 ZIndex 属性设置为不同的正整数或负整数值。

对于像 ScreenGui 这样的 UI 容器，默认的 ZIndexBehavior 始终将子对象渲染在其父对象之上，并且每个子对象的 ZIndex 用于决定其在其他对象之上渲染的顺序。

要编辑对象的 ZIndex，请在属性窗口中找到 ZIndex 并输入一个新的整数值。

布局结构

布局结构使您能够快速组织和显示 GuiObjects，例如，形成水平或垂直的列表、均匀大小的瓷砖网格、页面序列等。布局通常会覆盖或影响其控制下对象的位置/大小。

布局	描述
列表	UIListLayout 将兄弟 GuiObjects 定位为其父容器内的水平行或垂直列。
网格	UIGridLayout 将兄弟 GuiObjects 定位为其父容器内均匀大小的单元格网格。
表格	UITableLayout 将兄弟 GuiObjects 及其子对象定位为表格格式。
页面	UIPageLayout 将其兄弟 GuiObjects 组织为独特的页面，您可以通过脚本进行过渡。

跨平台因素

Roblox 本质上是跨平台的，因为玩家可以在手机或平板电脑上发现并加入游戏，然后在 PC 或控制台上继续他们的游戏进度。您应该设计您的 Roblox 游戏，使其在您选择支持的所有平台上都可访问和愉快，而不是针对一个平台进行优化而忽视其他平台。

保留区域

在移动设备上，默认控件占据屏幕左下角和右下角的一部分。当您设计游戏的 UI 时，避免在这些区域放置重要信息或虚拟按钮。

拇指区域

大多数移动玩家使用两个拇指 — 一个在虚拟摇杆上，另一个在跳跃按钮上。根据设备的物理大小和玩家的手，过于远离底角会变得不舒服或不可能，因此您应该避免将常用按钮放置在难以触及的区域之外。

按钮在玩家的右拇指可轻松触及的范围内

按钮难以触及，除非玩家伸手或伸出拇指

请记住，舒适的拇指区域在手机和平板电脑之间是不同的，因为平板电脑的屏幕更大。放置在屏幕顶部边缘下方 40% 的按钮在手机上可触及，但在平板电脑上几乎无法触及。

按钮距离手机顶部边缘 40%，在玩家的拇指可触及范围内

按钮距离平板电脑顶部边缘 40%，难以触及，除非伸展

在手机和平板电脑上可靠的方法是将自定义按钮相对定位在常用控件附近，例如默认的跳跃按钮，将它们放置在易于触及的范围内。

以下代码放置在 StarterPlayerScripts 中的客户端脚本中，获取跳跃按钮的位置并在其左侧创建一个占位符按钮，距离其 20 像素。

客户端脚本 - 跳跃按钮附近的自定义按钮

local Players = game:GetService("Players")
local UserInputService = game:GetService("UserInputService")

local player = Players.LocalPlayer
local playerGui = player:WaitForChild("PlayerGui")

if UserInputService.TouchEnabled then
	-- 等待跳跃按钮完全加载
	while not (playerGui:FindFirstChild("JumpButton", true) and playerGui:FindFirstChild("JumpButton", true).IsLoaded) do
		task.wait()
	end
	local jumpButton = playerGui:FindFirstChild("JumpButton", true)

	-- 将新的自定义按钮放置在跳跃按钮的左侧
	local customButton = Instance.new("ImageButton")
	customButton.AnchorPoint = Vector2.new(1, 1)
	customButton.Size = UDim2.fromOffset(jumpButton.Size.X.Offset * 0.8, jumpButton.Size.Y.Offset * 0.8)
	customButton.Position = jumpButton.Position + UDim2.fromOffset(-20, jumpButton.Size.Y.Offset)
	customButton.Parent = jumpButton.Parent
else
	warn("设备不支持触摸或 Studio 没有模拟触摸设备！")
end

基于上下文的 UI

在移动设备上，屏幕空间有限，因此您应该在主动游戏期间仅显示最重要的信息。例如，如果您的游戏包含打开门和宝箱的特殊输入操作，则在屏幕上不断显示“打开”按钮是没有意义的。相反，使用接近提示或类似方法，仅在角色接近门或宝箱时接受输入。

中文(简体)