列表控件Horizontal/Vertical/Grid Layout Group使用说明

Grid Layout Group

为Panel控件添加Grid Layout Group，子控件为四个按钮，分别为Grid，Calendar，Gear，User：

默认属性为：

为方便演示，按钮的底色为控件自带image，按钮上面的图标为其子控件image：

显示效果为：

Padding为设置父控件内部与子控件周围的空白间隙，比如这样设置：

显示效果：

cell size为子控件大小，spacing为彼此之间的空白：

显示效果为：

Start Corner为子控件排列起始点，（排列方式和数量由Start Axis和Constraint决定，后面再说）默认为先从左到右排满一行再排列下一行：

Start Corner设为Upper Right会发现，按钮控件先从最右上角开始排列，从右往左排满一行再到下一行继续从右往左排列：

效果：

Start Corner设为Lower Left为控件先从左往右排列，排满一行再到上一行继续从左往右排列：

效果为：

Start Corner设为Lower Right以此类推。

Start Axis则决定了是先水平排还是先垂直排，如果设为Vertical（垂直排列），配合Upper Left，效果则为先垂直从上到下排满最左边一列，再去排下一列：

效果为：

child Alignment很简单，设定子控件在父控件内部的位置：

比如设为Middle Left，效果就是这样的，其他以此类推：

效果为：

Constraint的第一个Flexible即响应式，根据宽度自动决定每行数量

效果为：

Fixed Colomn Count则强制规定列的数量，搭配Start Corner和Start Axis使用。

比如将Constraint Count设为1，Start Corner为Upper Right，Start Axis为Verical，就是只有一列，从右上角开始排列，垂直排满一列：

效果为：

将Constraint Count设为2，Start Corner和Start Axis不变，就是垂直排为两列，从右上角开始排列，先垂直排列，再水平排列，第一个按钮在右上角，第二个按钮在右下角：

效果为：

将Constraint Count设为3，Start Corner和Start Axis不变，此时效果不变，原因是控件将垂直排为三列，每列一个控件，会排为四列，所以每一列只能设为两个控件，但根据排列顺序，要先排满一列，才会去排下一列，所以右侧的两列每列一个控件之后，最左侧的第三列就空着了：

效果为：

其余配置保持不变，将Start Axis改为Horizontal（水平），效果为这样，这就比较好理解了，是从右上角先水平排列，排满一行（三列）之后排第二行：

效果为：

Fixed Row Count与此类似，只不过限定的是行数：

效果为：

Horizontal Layout Group

水平分割布局控件

Padding和Spacing与Grid Layout Group的功能类似，不再赘述。

Child Alignment设定子控件在父控件内部的位置，将Child Control Size和Child Force Expand所有选项都勾掉，此时子控件的长宽可以自由设定，切换Child Alignment，可以看到子控件的位置在变化：

效果为:

Child Force Expand设置子控件是否均匀分布于父控件内部，比如勾选Child Force Expand-Width之后的效果：

效果为：

取消勾选Child Force Expand-Width之后的效果：

可以看到，勾选之后虽然子控件可以根据父控件的宽度均匀分布在其内部，但却没有填满。如果需要填满父控件，则可以同时勾选Child Force Expand-Width和Child Controls Size-Width：

同时勾选Child Force Expand-Height和Child Controls Size-Height则可以在高度上填满父控件：

如果只勾选Child Controls Size不勾选Child Force Expand会怎样？子控件的宽度或高度会强制变为0，所以一般Child Controls Size是搭配Child Force Expand使用：

Vertical Layout Group

与Horizontal Layout Group类似。