1.首先在Canvas下闯将UIGUI中自带的Scroll View。
2.之后给Scroll View中的Content添加Vertical Layout Group组件和Content Layout Group组件,为了实现控制子物体的效果将属性修改为如图所示的状态。勾选Child Force Expend目的是为了让每个对话格都与Content长度相等。
3.在Content下创建空GameObject ChatCell添加Vertical Layout Group组件属性修改如下(为了传递子物体的尺寸和父物体的控制,同时为了实现左右两边的对话框位置)。
4.在ChatCell下依次创建空GameObject TextArea,Image bubble,Text text,属性如下图
bubble在添加了Layout Element组件后设置为Ignore Layout状态并将Rect Transform设置为自动填充父物体的区域的状态(bubble为文字区域的背景,TextArea的大小随着text大小的改变而改变),text中属性无需修改或者添加,因为Image,Text等组件都实现了同一个接口。
5.效果图
通过修改ChatCell中的属性控制是左对齐还是右对齐以及距离侧边多远。