惠山区住房和建设厅网站免费推广网站哪家好
一个聊天气泡的基本结构是一张Image作为背景，上面叠加一个文字组件，随着文本内容的增加，背景图片会跟着扩张
而想要达成这种效果，需要分别在Image和Text上添加组件
1. 对于背景的Image
需要VerticalLayoutGroup和ContentSizeFitter，这两个组件缺一不可，且ContentSizeFitter的Vectical Fit需要设置为Preferred Size
2. 对于Text
需要ContentSizeFitter调整自身大小
3. 原理探究
为什么Imgae上必须有VerticalLayoutGroup和ContentSizeFitter这两个组件？首先看下两个组件的说明
从字面上能看到，垂直布局组能够确定当前布局组自身的最小高度或偏好高度，而内容大小适配器是根据布局元素的最小或偏好值来改变宽高的
接下来查看源码
4. 先看VerticalLayoutGroup
方法都在LayoutRebuilder中调用
但改变自身属性的是CalculateLayoutInputHorizontal和CalculateLayoutInputVertical这两个方法
继续深入
此方法会“沿给定轴计算此布局元素的布局元素属性”
以上是DeepSeek的解释，其中对于combinedPadding的计算就是组件上的Padding属性
继续深入
此方法会将计算出来的属性保存下来
4. 再看ContentSizeFitter
主要改变方法为这两个
即依旧在LayoutRebuilder中调用
继续深入，主要看LayoutUtility.GetMinSize和LayoutUtility.GetPreferredSize这两个方法
可以看到，在计算最终布局属性时，传入的是e.minHeight和e.preferredHeight，而e是一个ILayoutElement，正好LayoutGroup系列的组件都是ILayoutElement
在LayoutGroup中，preferredHeight指向另一个方法
取的就是LayoutGroup自身存储的数据
5. 总结
LayoutGroup类的组件会根据子物体不断该改变其最小或偏好数据（如果是LayoutElement组件的话，值是固定不变的），然后ContentSizeFitter会获取到这些数据，进行最终的宽高计算