NGUI系列教程 （角色信息跟随）

在一些网络游戏中，我们常常可以看到角色的上方显示着角色的名称，等级，血量等信息。它们可以跟随角色移动，并且可以显示和隐藏。今天我们就来学习一下这些功能的实现方法。
    1. 新建unity工程，导入NGUI插件。对于字体按钮等的制作方法参见以前的系列教程。这里我们直接开始学习制作方法。首先新建一个2DUI，设置UI的层为NGUI。新建完成后，使用菜单NGUI -->Create a Panel ,在现有Panel的节点下新建一个Panel，命名为Panel_CharacterInfo,作为角色信息面板的根节点。使用Widget Tool创建两个Label，一个命名为Name，另一个为Life。再创建一个Progress Bar,用于显示角色的血量信息。在创建一个建立完成后场景中视图列表如图：

   2.  场景设置，现在我们新建一个Plane作为地面，新建一个PointLight用于场景照明，然后再新建一个Cube，作为我们的角色。场景设置如图

3. 为cube添加角色控制器。首先导入角色控制Package。在工程窗口中点击右键，选择ImportPackage，选择 Character Controller。该包包括两个角色控制器，我们先把Cube自带的BoxCollider删除，然后为它添加FPSInputController，CharacterMotor两个脚本。就完成Cube的角色设置了，点击运行，按下键盘的方向键可以看到，Cube可以根据我们的按键左右移动。

4.编写UI跟随角色控制脚本脚本。对于实现方法，我们可以有以下思路。首先我们想要清楚，我们想要实现的是UI跟随Cube移动。这里我们就要考虑，UI要得到Cube在屏幕上的坐标位置。然后再根据位置做相应的移动。我们知道在Unity中，Camera. WorldToScreenPoint和Camera. ScreenToWorldPoint可以分别将世界坐标和屏幕坐标相互转换。有了思路我们就可以动手写代码。代码比较简单，我已经在后面注释了，大家可以一目了然。

1. public class UIFollowTarget : MonoBehaviour {
   
2. 
   
3.     public GameObject TargetObject;         //目标物体。这里是指Cube
   
4.     public Camera worldcamera;         //世界相机。
   
5.     public Camera guiCamera;           //UI相机
   
6. // Use this for initialization
   
7. void Start ()
   
8.     {
   
9.         worldcamera = NGUITools.FindCameraForLayer(TargetObject.layer);     //这里是通过物体的层获得相应层上的相机
   
10.         guiCamera = NGUITools.FindCameraForLayer(this.gameObject.layer);   //通过脚本所在物体的层获得相应层上的相机
    
11. }
    
12. 
    
13. // Update is called once per frame
    
14. void Update ()
    
15.     {
    
16.          
    
17. }
    
18.     void LateUpdate()
    
19.     {        
    
20.         Vector3 pos = worldcamera.WorldToScreenPoint(TargetObject.transform.position);         //获取目标物体的屏幕坐标
    
21.         pos = guiCamera.ScreenToWorldPoint(pos);                              //将屏幕坐标转换为UI的世界坐标
    
22.         pos.z = 0;                                //由于NGUI 2D界面的Z轴都为0，这里我们将坐标修改为0.只取其X,Y坐标。
    
23.         transform.position = pos;      //将修改过的坐标赋给UI界面。这里指Panel_CharacterInfo
    
24.     }
    
25. }

点击此处复制文本

5. 将脚本赋给Panel_CharacterInfo，设置目标物体为Cube，Worldcamera为Main Camera，guicamera设置为NGUI的Camera。完成后点击运行，我们可以看到，UI已经在跟随物体移动了。

更多精彩图片 请登录

6. 当场景中有很多角色的时候，我们可能有时候只想看我们选中的角色的信息。没有选中的就隐藏，这样的功能大家可以在熟悉了这些之后自己实现。这里提供一个思路供大家参考：首先定义一个角色信息的类，然后根据当前选择的角色，读取该角色的信息，赋值给UI里的Name life等参数。并且赋值角色的位置信息给UI，这样UI就可以动态的显示在响应角色的位置上。

好好，非常好{:1_146:}

Thanks for sharing!

元素帖子强，满满正能量！

资源发布哪家强？元素首发称大王

楼主威武，感谢分享，楼下保持队型

谢谢分享~!支持

资源甚好，发帖艰辛，且阅且珍惜！

赞一个~666

谢谢分享

路过围观，感谢分享~

感谢分享

不错的资源，谢谢分享

元素帖子强，满满正能量！

大佬辛苦辛苦

感谢分享

感谢分享

元素帖子强，满满正能量！

非常棒的资源，喜欢这里