主页 > 游戏开发  > 

Unity聊天气泡根据文本内容适配

Unity聊天气泡根据文本内容适配
第一步 拼接UI

1、对气泡图进行九宫图切割

2、设置底图pivot位置和对齐方式

pivot位置:(0,1)

对齐方式:左上对齐

3、设置文本pivot位置和对齐方式,并挂上布局组件

pivot设置和对齐方式和底图一样,文本作为底图的子节点

文本组件宽度不变,主要控制高度根据文本内容适配

第二步 代码控制适配

主要控制高度适配

气泡底图的高度包括三部分组成:顶部间隔+文本组件高度+底部间隔

using UnityEngine; using UnityEngine.UI; public class Test : MonoBehaviour { public RectTransform bgRect; public Text txt; private RectTransform txtRect; private void Start() { txtRect = txt.GetComponent<RectTransform>(); AutoFitBg(); } private void Update() { //测试用 if (Input.GetKeyDown(KeyCode.A)) { txt.text = "南无阿弥陀佛"; AutoFitBg(); } //测试用 if (Input.GetKeyDown(KeyCode.D)) { txt.text = "56456e4f564awe564f564ewa56f456ewa4f56ewa456f4a6ew54f56a4ewf"; AutoFitBg(); } } public void AutoFitBg() { LayoutRebuilder.ForceRebuildLayoutImmediate(txtRect); var txtHeight = txtRect.rect.height;//文本组件高度 var topHeight = 36;//顶部间隔 var bottomHeight = 36;//底部间隔 var sumHeight = topHeight + txtHeight + bottomHeight; bgRect.SetSizeWithCurrentAnchors(RectTransform.Axis.Vertical,sumHeight); } }

标签:

Unity聊天气泡根据文本内容适配由讯客互联游戏开发栏目发布,感谢您对讯客互联的认可,以及对我们原创作品以及文章的青睐,非常欢迎各位朋友分享到个人网站或者朋友圈,但转载请说明文章出处“Unity聊天气泡根据文本内容适配