UGUI中的GridLayoutGroup布局

# 1. 介绍

## 1.1 什么是UGUI？

UGUI（Unity Graphical User Interface）是Unity的一套用于创建用户界面的系统。它提供了丰富的UI组件，并支持可视化的编辑和布局，在游戏开发和应用程序开发中扮演着重要的角色。

## 1.2 GridLayoutGroup布局控件的作用

GridLayoutGroup是UGUI中的一个布局组件，用于实现网格布局。它可以根据指定的行数或列数，自动将子物体排列成二维的网格结构。GridLayoutGroup可以很方便地调整子物体的位置并控制其尺寸，使得UI界面的排版更加灵活和便捷。

## 1.3 为什么要使用GridLayoutGroup布局

使用GridLayoutGroup布局可以大大简化UI的布局工作。通过设置GridLayoutGroup的属性，可以快速实现各种网格布局需求，例如展示多个图片、按钮、文本等等。GridLayoutGroup还支持动态布局，可以根据运行时的情况来自动调整子物体的位置和尺寸。同时，GridLayoutGroup也具有很好的适配性，可以在不同的屏幕分辨率上保持良好的布局效果。通过GridLayoutGroup，开发者可以更加高效地创建出美观且易于维护的UI界面。

# 2. 基本用法

### 2.1 属性概述

GridLayoutGroup是一种布局组件，用于在Unity中创建网格布局。它可以根据用户设置的属性来自动排列并调整子物体的位置和大小。使用GridLayoutGroup布局，可以轻松实现各种网格布局需求。

GridLayoutGroup具有以下常用属性：

- Cell Size: 子物体的尺寸，可以设置固定尺寸或者根据布局大小自动调整。
- Spacing: 子物体之间的间距，可以设置水平和垂直方向的间距。
- Constraint: 确定布局的约束条件，可以选择自动适应宽度或高度，或者不做约束。
- Constraint Count: 确定每行或每列的子物体数量。
- Start Corner: 确定布局的起始角落。
- Start Axis: 确定布局的起始轴。
- Child Alignment: 子物体的对齐方式。

### 2.2 设置布局类型

通过选择GridLayoutGroup组件的Layout Type属性，可以设置布局的类型。格子网格（Grid）类型是最常用的布局类型，它根据子物体的尺寸和间距自动排列子物体。此外，还可以选择水平（Horizontal）或垂直（Vertical）布局类型，它们分别将子物体排列在水平方向或垂直方向上。

以下示例代码演示如何通过代码设置布局类型为格子网格类型：

GridLayoutGroup gridLayoutGroup = gameObject.GetComponent<GridLayoutGroup>();
gridLayoutGroup.layoutType = GridLayoutGroup.LayoutType.Grid;

### 2.3 设定初始尺寸和间距

通过调整Cell Size和Spacing属性，可以设定GridLayoutGroup的初始尺寸和间距。

Cell Size属性可以设置子物体的固定尺寸，也可以根据布局的大小自动调整。例如，如果将Cell Size设置为(100, 100)，则每个子物体的大小将被固定为100x100像素。如果将Cell Size设置为(-1, -1)，则子物体的大小将根据布局的大小自动调整。

Spacing属性可以设置子物体之间的间距。可以分别设置水平方向和垂直方向的间距，也可以统一设置。

以下示例代码演示如何通过代码设置初始尺寸和间距：

GridLayoutGroup gridLayoutGroup = gameObject.GetComponent<GridLayoutGroup>();
gridLayoutGroup.cellSize = new Vector2(100, 100);
gridLayoutGroup.spacing = new Vector2(10, 10);

### 2.4 控制布局方向

通过调整Start Corner和Start Axis属性，可以控制GridLayoutGroup的布局方向。

Start Corner属性确定布局的起始角落，可以选择左上角、左下角、右上角或右下角。

Start Axis属性确定布局的起始轴，可以选择水平或垂直方向。例如，如果将Start Axis设置为水平方向，子物体将从左到右排列；如果将Start Axis设置为垂直方向，子物体将从上到下排列。

以下示例代码演示如何通过代码控制布局方向：

GridLayoutGroup gridLayoutGroup = gameObject.GetComponent<GridLayoutGroup>();
gridLayoutGroup.startCorner = GridLayoutGroup.Corner.UpperLeft;
gridLayoutGroup.startAxis = GridLayoutGroup.Axis.Vertical;

在使用GridLayoutGroup布局时，还可以根据具体需求，通过调整其他属性来进一步定制和优化布局效果。下一章节将深入介绍GridLayoutGroup的具体属性和用法。

# 3. 具体属性详解

GridLayoutGroup布局控件具有多个属性，可以通过调整这些属性来达到不同的布局效果。下面将详细介绍这些属性的具体作用和设置方法。

#### 3.1 Cell Size属性

Cell Size属性指定了每个单元格（子物体）的尺寸大小。通过设置Cell Size属性，可以确保子物体在GridLayoutGroup中按照固定的尺寸进行排列布局。例如，如果想要创建一个网格布局，可以通过调整Cell Size属性来设置每个网格单元的大小。

GridLayoutGr