UGUI實現直播間聊天消息滾動功能

現在直播APP火的簡直不像樣子了。在直播間裏會有觀衆和主播交流的功能。主要方式是主播動口（說），觀衆動手（打字）。這篇文章講解一下觀衆客戶端聊天功能的實現。這裏爲了更清楚的看到效果功能，我作了一個客戶端單機版來說解。(該版本爲unity5.3.2f1)
需求功能是：觀衆新發送了聊天消息會把以前的消息頂到上面，用戶也能夠經過滾動聊天欄翻看以前的用戶聊天記錄。

先看下面gif圖功能：
 


下面講如何實現：
第一：整個功能我分了三個組件，一個藍色背景image，一個用來滑動的image（上圖圖中的黃色光芒圖片），一個text的預設物體。（以下圖：）
爲了方便將這三個物體的pivot都設置爲（0,0）。
以下圖（根據需求可自定義大小座標等）：
 




第二：給藍色背景圖片添加滑動組件和Mask組件，指定滑動目標爲光芒的那個圖片。
添加腳本slidertext，而後把text的預設和預設生成的父物體（光芒的那個圖片）拖到對應位置。
以下圖：
 


第三：腳本slidertext的源碼：（這纔是重點）
該代碼和以前我寫的彈幕生產的方法類似（彈幕方法連接http://www.manew.com/thread-95590-1-1.html）

腳本里實現了兩種文本移動方法：一種是直接跳到上面的位置，另個是緩慢移動上去（上面gif圖的樣子），緩慢移動使用了DoTween插件來實現。

  1 using UnityEngine;
  2 using System.Collections;
  3 using UnityEngine.UI;
  4 using DG.Tweening;
  5 using System.Collections.Generic;
  6 using System.Text.RegularExpressions;
  7 using System;
  8  
  9 public class productsliderm : MonoBehaviour
 10 {
 11     public GameObject Textslidermessage, Textslidermessage_parents;
 12     private GameObject texts;//生成的物體
 13     public Queue<GameObject> Textslider_queue = new Queue<GameObject>();//物體的隊列（生成物體）  
 14     
 15    
 16     
 17      
 18      
 19     private Vector3 textpositon;
 20     private Quaternion textrotation;
 21  
 22     private string content;//文字內容(ceshi)
 23     float production_timer = 2;//生成的時間間隔
 24  
 25  
 26     void Update()
 27     {
 28         #region//僅測試用
 29  
 30         production_timer -= Time.deltaTime;
 31  
 32         if (production_timer <= 0f)
 33         {
 34             int i = UnityEngine.Random.Range(0, DanMuStrings.Length);//彈幕的隨機內容
 35             content = DanMuStrings[i];
 36  
 37           
 38             createDanMuEntity(content);
 39             production_timer = 2;
 40         }
 41         #endregion
 42  
 43  
 44  
 45       
 46         if (Textslider_queue.Count > 100)//退出隊列方法一
 47         {
 48             GameObject go = Textslider_queue.Peek();
 49             Textslider_queue.Dequeue();
 50                 Destroy(go);//銷燬彈幕
 51              
 52         }
 53     }
 54  
 55     
 56     public void createDanMuEntity(string textMsg)
 57     {
 58       
 59  
 60         texts = (GameObject)(Instantiate(Textslidermessage, textpositon, textrotation));//生成text框
 61         if (texts != null)
 62         {
 63             texts.transform.SetParent(Textslidermessage_parents.transform);
 64  
 65             texts.transform.localScale = new Vector3(1, 1, 1);
 66             textrotation.eulerAngles = new Vector3(0, 0, 0);
 67             texts.transform.localRotation = textrotation;
 68             texts.transform.localPosition = new Vector3(0, 0, 0);
 69  
 70              
 71             texts.GetComponent<Text>().text = textMsg;
 72  
 73           
 74  
 75             if (texts.GetComponent<DOTweenAnimation>() == null)//移動組件添加
 76                 texts.AddComponent<DOTweenAnimation>();
 77  
 78           
 79  
 80  
 81  
 82             if (Textslider_queue.Count >= 1)
 83             {
 84                  
 85                 foreach (GameObject textssliders in Textslider_queue.ToArray())//凡是在隊列中的每個都要移動
 86                 {
 87                     Debug.Log("fouzei++++" + texts.GetComponent<RectTransform>().sizeDelta.y);
 88  
 89                     //直接移動
 90                     //textssliders.transform.localPosition= new Vector3(textssliders.transform.localPosition.x, textssliders.transform.localPosition.y + texts.GetComponent<RectTransform>().sizeDelta.y, 0f);
 91  
 92  
 93                     #region //緩緩移動 
 94  
 95                     Vector3 kk  = new Vector3(textssliders.transform.localPosition.x, textssliders.transform.localPosition.y + texts.GetComponent<RectTransform>().sizeDelta.y, 0f);
 96                    
 97                     textssliders.transform.DOLocalMove(kk, 2,true);
 98                     #endregion
 99                 }
100  
101             }
102  
103             Textslider_queue.Enqueue(texts);//添加到隊列
104         }
105  
106         
107     }
108  
109  
110  
111  
112     [HideInInspector]
113  
114     #region 測試用
115     public string[] DanMuStrings =
116    {
117         "這個劇情也太雷人了吧！",
118         "仍是好萊塢的電影經典啊，這個太次了仍是好萊塢的電影經典啊，這個太次了",
119         "是電鋸驚魂的主角，尼瑪",
120         "這個遊戲仍是很良心的麼",
121         "臥槽還要花錢，這一關也太難臥槽還要花錢，這一關也太難了臥槽還要花錢，這一關也太難了臥槽還要花錢，這一關也太難了了",
122         "這個遊戲好棒偶",
123         "全是傻逼",
124         "求約：13122785566",
125         "最近好寂寞啊，仍是這個遊戲好啊是胸再大點就更是胸再大點就更是胸再大點就更",
126         "難道玩遊戲還能擼",
127         "辦證：010 - 888888",
128         "爲何女主角沒有死？",
129         "好帥呦，你這個娘們兒",
130         "欠揍啊，東北人不知道啊",
131         "我去都是什麼人啊，請文明用語仍是好萊塢的電影經典啊，這個太次了是胸再大點就更",
132         "這個仍是不錯的",
133         "要是胸再大點就更好了",
134         "這個遊戲必須頂啊",
135         "仍是好萊塢的電影經典啊，這個太次了仍是好萊塢的電影經典啊，這個太次了怎麼沒有日本動做愛情片中的角色呢？",
136         "好吧，這也是醉了！",
137         "他只想作一個安靜的美男子！"
138     };
139     #endregion
140  
141 }