如何在HTC Vive中创建UI界面

无论是游戏，还是虚拟现实等，都不可能缺少UI界面的制作，对于界面我们可以分为两种UI界面，一种是能够跟随VR头盔移动的UI,另一种为不跟随头盔移动的UI,也就是将UI看作三给空间中的游戏对象。下面将带领大家通过UGUI来制作界面.

UGUI的Canvas画布的RenderMode具有三种模式:

• Screen Space – overlay
  此模式不需要UI摄像机，UI将永远出现在所有摄像机的最前面,如果我想在UI前面显显示一个模型或游戏对象就不行了，VR的界面不能采用些种方式。

• Screen Space- Camera
  此模式是我决定采取的，它需要提供一个Camera用于渲染UI界面，这种方法和NGUI的原理有些像，这种形式我可以在UI界面与摄像机中间放置一些游戏对象，可以通过设定渲染摄像机，使UI跟随头盔进行移动。

• World Space
  这个就是完全3D的UI，整个Canvas画布被认定为是一个3D空间中的游戏对象，与创建的Cube或其它预设游戏对象一样,此模式用于创建不跟随头盔移动的UI界面。

UI界面的制作

跟随头盔移动的UI界面

若要实现此模式，需要将Canvas的Render Mode选择为ScreenSpace-Camera。

设置后，摄像机的效果如下图:

当我们移动头盔时，由于UI是由头盔的摄像头渲染的，所以会跟随头盔移动。

不跟随头盔移动的UI界面

若要实现此模式，需要将Canvas的Render Mode选择为World Space。
我们只需要将Canvas中的调整为合适大小，和其它游戏对象一样，调整合适位置即可。

UI的交互方式

UI的交互方式，需要通过射线与碰撞器的结合来实现，整个实现的思路类似于NGUI元素的碰撞检测。
通过手柄发出射线，当射线碰撞到UI元素后，添加上相同大小的碰撞器，再结合手柄的Trigger键来决定相应的操作。

 SteamVR_Controller.Device device;
 Linerender line;
 void Start(){
   SteamVR_TrackedObject trackObj=this.GetComponent<SteamVR_TrackedObject>();
   device=SteamVR_Controller.Input((int)trackObj.index);
   line=this.AddComponent<Linerender>();
 }
 //通过Linerender绘制射线
 void Update(){
    //创建Ray
    Ray ray=new Ray(this.transform.position,this.transform.forward.normalized*1000);
    //设定线顶点数
    line.SetVertextCount(2);
    //按下扳机键发出射线，在通过射线所碰撞的UI名称来区分按钮(每个按钮都需要添加Collider)
    if(device.GetPressDown(SteamVR_Controller.ButtonMask.Trigger){
        RaycastHit hitInfo;
        if(Physic.Raycast(ray,out hitInfo)){
           //在此处处理

        }
    }
 }