Content Size Fitter与Vertical Layout Group、LayoutElement的结合使用

Content Size Fitter组件主要是用来设置UI的长宽，Horizontal Fit和Vertical Fit分别是控制UI的宽和高，有三个值可选：

Unconstrained：组件不根据布局元素调整 ，可手动修改长宽的值。
MinSize：根据布局元素的最小值来调整，不能手动修改长宽的值。
PreferredSize：根据布局元素的内容来调整，不能手动修改长宽的值。
 

一、最简单的用法，挂在Text上，根据文本内容改变尺寸

只需要设置为PreferredSize就行。

二、文字后边固定位置加图片：如游戏中聊天（名字+表情）

文字固定，图片随文字长度变化位置（左右移动）：

 创建一个Text，将Text的锚点Anchor设置为左对齐，调节好适当的X坐标，在Text上添加Content Size Fitter，将Horizontal Fit 的属性修改为Preferred Size，在Text下创建一个子物体Image，Image 的锚点Anchor设置为右对齐，调节好适当的X坐标，现在向Text里面添加文字，图片就会跟随文字更改位置。

三、控制Scroll View(Scroll Rect组件)控件下Content的大小。

    Scroll View常用来显示奖励列表、排行榜之类的UI。这里举一个简单的Scroll View例子，这里就介绍垂直方向的拖拽。当你将UI做好之后，如果子物体在较多，或者比较大，可能会发现鼠标拖拽Content往下来，松开鼠标之后，Content会还原到原来的位置。还需要添加vertical layout。如图：

 这是因为Content有一个默认大小，当你Content下的子物体的Height加起来大于Content的高的时候，下边的子物体肯定显示不下啊，这时候在Content下添加一个Content Size Fitter组件，将Vertical Fit的值设置为Preferred Size，Content的Height就不需要你去关心了，这个时候就不怕子物体的多少了！
 

可滑动的不定长文本

如：游戏公告

在Scroll View的Content下添加一个Content Size Fitter组件和vertical layout，再添加个Text作为Content的子节点。设置为Preferred Size，text和content都会根据文本的内容而改变大小。

vertical layout勾选control child size，自行根据需要选择宽高

四、自适应窗口大小,将子物体设置为显示或者隐藏可以自己改变窗口大小，如技能，装备升级类窗口。

    大多数游戏的装备升级锻造等会有一个弹出来的窗口，里面会显示标题，当前等级效果，下一等级效果，描述，然后是一些按钮之类的。有一个问题，有的策划会在等级满级的时候将下一等级效果，升级类的按钮隐藏掉！有的人会直接设置窗口的大小，子物体的位置来实现，这里介绍一下用UGUI的Content Size Fitter来实现。以内容垂直分布为例，水平分布同理。分布示例如图：

Hierarchy结构如下：

Window就是你的窗口，下边添加Virtical Layout Group和Content Size Fitter组件。属性设置如下：

在Window下添加子物体，可以先加图片最为背景和该模块的父物体，用来控制改模块的整体占Window的大小。这样你就不用关心窗口的大小，内容的位置了，不需要的时候直接隐藏掉就OK。
 

unity ContentSizeFitter立即生效

ugui Text上添加了ContentSizeFitter组件后，如果在代码里对Text.text重新赋值，文本框并不会马上改变大小，而是会延迟到下一帧。需要调用如下方法 方可立即改变!

tagtxgo.GetComponent<ContentSizeFitter> ().SetLayoutHorizontal ();//水平适应调用

tagtxgo.GetComponent<ContentSizeFitter> ().SetLayoutVertical ()。//垂直适应调用

如果没有调用这两个方法,则立即获取sizeDelta会出现问题！

Content Size Fitter与Vertical Layout Group、LayoutElement的结合使用

根节点添加Content Size Fitter和Vertical Layout Group，vertical layout勾选control child size的高。即可根据让子节点根据自身内容适配尺寸，根节点根据子节点适配。

如果子节点的子节点也需要适配，在子节点上添加Vertical Layout Group，然后勾选control child size的高度即可。

如果根节点的背景图需要根据所有子节点的尺寸来适配，则在根节点下添加个节点作为背景图，然后添加LayoutElement组件，勾选忽略布局，背景图就不会受Content Size Fitter的控制。背景图改为全局拉伸，再调整尺寸即可

LayoutElement

 ignore Layout：勾选，即可不受布局影响。这里主要是不会受Content Size Fitter和Vertical Layout Group的控制

preferred Height：设为50，即可让任意组件默认高度为50。不会被Content Size Fitter和Vertical Layout Group改变高度

更多布局文章

unity 自动排版（Layout Element）

Unity UI自动布局相关组件

Unity/Auto Layout -- 理解Layout Elements（布局元素）

————————————————
版权声明：本文为CSDN博主「Unique_849997563」的原创文章，遵循CC 4.0 BY-SA版权协议，转载请附上原文出处链接及本声明。
原文链接：https://blog.csdn.net/qq_33461689/article/details/79270565