前言:
- 你是否因为在使用UI元素时迟迟无法对其一排元素而痛苦,你是否因为元素数量动态变化而绝望。如果是,恭喜你找到绝佳良药
一、什么是Layout Group
Layout Group
翻译为“布局组”,从字面意思就可以理解,可以对一组元素进行动态布局,这里说的动态是,组内元素数量发生变化时,Layout Group
可以智能的帮助你重新排版,可以从下面的演示图看到:
当我们为父元素添加一个Layout Group
组件时,改变子元素的数量时,就会有这样一个动态的效果,这样无论合适,我们的排版都可以保持很工整的样子
二、排版的几种方式
2.1、Horizontal Layout Group:
即水平布局方式,子元素只会按照水平的方式排列,就算子元素太多超过父元素以后不会换行排列,关于具体的介绍可以看之前写的博客 unity中排版组件Horizontal Layout Group的使用
2.2、Vertical Layout Group:
垂直布局的方式,与Horizontal Layout Group
相对应,同样当元素超过父元素也不会换行:
2.3、Grid Layout Group:
Grid Layout Group
即网格布局组,听名字也可以理解就是可以按照面的方式来进行排版
Grid Layout Group
这种方式的布局,就是可以让元素换行的布局,就是综合Horizontal Layout Group
与Vertical Layout Group
这两种布局的综合体
Layout Group的具体使用:
首先对相关需要排版的父元素添加需要的排版类型,然后会出现如图的属性面板(以Grid Layout Group
为例):
属性面板:
具体解释:
Padding
:类似网页设计内边距Cell Size
:组中每个布局元素要使用的大小Spacing
:布局之间的元素间距Start Corner
:类似元素居中、靠左、靠右等Start Axis
: 沿着哪个主轴放置元素。在开始新行之前,水平将填满整个行。在开始新列之前,Vertical将填充整个列。Child Alignment
:如果布局元素未填满所有可用空间,则用于这些元素的对齐方式Constraint
:将网格限制为固定数量的行或列,以辅助自动布局系统