只需5步,Unity中创建自滚动聊天室文本框
游戏人间
7 人赞同了该文章
初入Unity大门,在做界面时也走了一些弯路,这里记录下一些经验,也供分享。
想要创建一个可滚动的自动扩展文本框,并且在文本更新时能够自动滚动至最底部。在网上找了一些资料,都不太准确且有多余步骤,这里总结并精炼了一下步骤。
1、创建一个容器,用于添加ScrollRect组件,可以使用Panel也可以使用Image,推荐Panel。
2、在Panel下创建子元素Text,依需要设置好定位。
这是我的定位设置,其中Pivot X=0, Y=0.01,注意的是高度设置是没有意义的,因为下面会通过组件来控制高度。
3、在Text中添加Layout组件中的Content Size Fitter,并设置Content Size Fitter中的Vertical Fit为”Preferred Size“。
4、回到Panel,添加UI组件中的Mask和Scroll Rect组件,并设置Scroll Rect中的Content为之前添加的Text控件。因为我并不需要水平滚动,所以也将Horizontal属性清空。
至此一个可滚动的文本框就建立完毕了,其文本显示范围由Panel决定。如果只是显示静态文本,在Text的text属性中输入文本即可。
下面是添加自动滚动代码的步骤。
5、打开代码编辑器,在你需要向该文本框输入内容的类中设定两个变量:
[SerializeField]
private Text textView;
[SerializeField]
private ScrollRect scrollControl;
添加如下函数:
public void WriteText(string text)
{
textView.text += "\n"+ text;
StartCoroutine("ScrollToBottom");
}
IEnumerator ScrollToBottom()
{
yield return new WaitForEndOfFrame();
scrollControl.verticalNormalizedPosition = 0f;
}
稍微解释一下,scrollControl.verticalNormalizedPosition = 0f; 就是实现滚动自底部的代码,之所以不能立即调用,是因为控件写入值后需要一帧的时间来绘制,因此此时的滚动条位置是不准确的,必须等待该帧绘制完毕,再执行该行代码。
6、保存代码,回到Unity编辑器,将Panel关联至scrollControl变量、Text关联至textView变量即可。
添加滚动条的步骤比较简单,这里就不赘述了。
所有步骤在 Unity2017.3.0f3 版本中测试通过。