Unity3D 使用Image包络Text

最近使用UGUI过程中遇到了一个小问题,在聊天页面,为玩家发出的聊天内容增加背景框。背景框是一个长方形,其宽和高都包络文字,并且文字有宽度限制,超出宽度限制之后会折行。使用Text和Image,挂了ContentSizeFitter和LayoutGroup组件,试了好久才搞出来,期间还参考了文末附带的一个链接。这里将解决方案记录下来。

最终实现的效果是这样的:

image

涉及到三个GameObject,即图中的Container、TextBG和Text,三者的设置如下:

image

image

image

详见工程源文件

REFERENCE

https://forum.unity.com/threads/limit-max-width-of-layout-component.316625/