虚拟现实的UI制作和交互

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

UGUI的Canvas渲染模式：

第一种：Screen Space - overlay
此模式不需要UI摄像机，UI将永远出现在所以摄像机的最前面，如果想在UI前面显示一个模型或者NPC等游戏对象就不行了，所以VR的UI不适用这种渲染模式

第二种：Screen Space -Camera
从模式是比较适合VR开发的，它需要提供一个摄像机用于渲染UI界面，这种形式我们就可以在UI界面与摄像机之间放置一些游戏对象，可以通过设定渲染摄像机，使用UI跟着头盔进行移动。（你怎样转动UI都会一直出现在视野前方）

第三种：Screen Space - Space
把UI当做3D物体一样的，完全是个3DUI，整个Canvas画布被认定为是一个3D空间中的游戏对象，与创建的其他游戏物体一样，即此模式下的UI不会跟着头盔移动

Unity中UI的交互：
在VR 中的交互通常情况下，会通过手柄发出一条射线，用线来操作UI界面，，，

给玩家看的线条的绘制：有下面几种方式

• 利用LineReander绘制
• 3DUI实现
• 利用Cube缩放
• GL库绘制

UI的交互方式：通过手柄发出射线，当射线碰撞到UI元素后，结合手柄的操作，调用相应的方法，，，

using System.Collections;
using System.Collections.Generic;
using UnityEngine;

//代码挂载到手柄上
public class MyLineTest : MonoBehaviour { private LineRenderer line; //要画出来的线 private Vector3[] posArray = new Vector3[2]; //射线的起始点 private Ray ray; //真正检测用的射线 private RaycastHit rayHit; //获取射线碰撞信息 private SteamVR_TrackedObject steamvrObj; //获取VR组件引用 private SteamVR_Controller.Device device; //用来接收设备索引 void Start () { //获取射线组件 line = GetComponent<LineRenderer>(); if (line == null) {   //没有则添加 line = this.gameObject.AddComponent<LineRenderer>(); } //设置画出来线的宽度，，（使用户看起来想红外线一样） line.startWidth = 0.002f; line.endWidth = 0.002f; //获取组件上的设备索引，，找到当前连接的设备 steamvrObj = this.GetComponent<SteamVR_TrackedObject>(); device = SteamVR_Controller.Input((int)steamvrObj.index); } // Update is called once per frame void Update () { //设置起点和终点，起点是手柄的位置，终点是手柄前面100个单位的位置 posArray[0] = this.transform.position; posArray[1] = this.transform.position.normalized * 100; //画线使 用户看到 line.SetPositions(posArray); //创建出射线 ray = new Ray(posArray[0], posArray[1]); //检测碰撞 if (Physics.Raycast(ray, out rayHit, 100)) { //按下Trigger键 if (device.GetPressDown(SteamVR_Controller.ButtonMask.Trigger)) { //碰撞到Cube if(rayHit.collider.name == "Cube") { Debug.Log("射线碰撞到了Cube");  //这样就可以做交互了 } } } }
}

  

 

  
1
  
2
  
3
  
4
  
5
  
6
  
7
  
8
  
9
  
10
  
11
  
12
  
13
  
14
  
15
  
16
  
17
  
18
  
19
  
20
  
21
  
22
  
23
  
24
  
25
  
26
  
27
  
28
  
29
  
30
  
31
  
32
  
33
  
34
  
35
  
36
  
37
  
38
  
39
  
40
  
41
  
42
  
43
  
44
  
45
  
46
  
47
  
48
  
49
  
50
  
51
  
52
  
53
  
54
  
55
  
56
  
57
  
58
  
59
  
60
  
61
 

文章来源: czhenya.blog.csdn.net，作者：陈言必行，版权归原作者所有，如需转载，请联系作者。

原文链接：czhenya.blog.csdn.net/article/details/78482914