网格和表格布局

与 UIListLayout 相比，UIGridLayout 和 UITableLayout 允许更多结构化和组织化的布局。这些最适合用于诸如商店库存的界面，在这种情况下，每个项目可以在均匀大小的网格瓦片中展示，或者项目可以被归类为相关的行/列。

网格布局

UIGridLayout 在其父容器内以统一大小的网格单元排列同级的 GuiObjects。单元格根据布局的 FillDirection 以行或列的方式添加，直到下一个单元不适合，然后开始新的一行或新的一列。为了进一步控制，您可以使用 FillDirectionMaxCells 属性设置每行或每列的最大单元格数量。

默认情况下，UIGridLayout 按照同级 GuiObjects 的 LayoutOrder 排序，其中较低的值在较高的值之前，而相等的值则根据您添加它们的顺序进行排序。如果您将布局的 SortOrder 更改为 Enum.SortOrder.Name，则同级将按字母顺序排序。

表格布局

UITableLayout 将同级 GuiObjects 及其子对象排列成表格格式。默认的 FillDirection 为 Vertical，这意味着同级首先被排列成行，这些同级的子对象则水平排列以形成列，从而使每行中的每个单元格具有相同的高度，每列中的每个单元格具有相同的宽度。

这种模式模仿标准的 HTML 行/列结构：

<table>
	<tbody>
		<tr>
		<!-- 行1 -->
			<td>标签1</td> <!-- TextLabel1 -->
			<td>标签2</td> <!-- TextLabel2 -->
			<td>标签3</td> <!-- TextLabel3 -->
		</tr>
		<tr>
		<!-- 行2 -->
			<td>标签4</td> <!-- TextLabel4 -->
			<td>标签5</td> <!-- TextLabel5 -->
			<td>标签6</td> <!-- TextLabel6 -->
		</tr>
		<tr>
		<!-- 行3 -->
			<td>标签7</td> <!-- TextLabel7 -->
			<td>标签8</td> <!-- TextLabel8 -->
			<td>标签9</td> <!-- TextLabel9 -->
		</tr>
	</tbody>
</table>

除非您启用布局的 FillEmptySpaceColumns 或 FillEmptySpaceRows 属性，否则同级 GuiObjects 的大小决定单元格的维度。例如，大小为 UDim2.new(0.25, 0, 0.1, 0) 的 TextLabel 将在父容器内创建一个宽度为 25% 和高度为 10% 的表格单元格。