HoloLens开发手记 - UI搭建

使用UGUI

---

本文主要讲述在unity中使用UGUI 进行 2D UI的搭建，以一个简单的demo示例，在HoloLens上进行button的触发实现cube的随机颜色变换。

1.新建一个unity工程，从HoloToolKit中添加Main Camera、Cursor组件

Main Camera在Holotoolkit -> Utilities -> Prefabs中可以找到；
Cursor在Holotoolkit -> Input-> Prefabs中可以找到，cursor对象中包含了CursorManager.cs脚本组件

2.新建一个空物体，命名为Manager，在Manager对象上添加GazeManager.cs 、GestureManager.cs脚本组件，为应用添增凝视和手势特性。

同时可以加上HandManager.cs脚本组件，并在Holotoolkit -> Input-> Prefabs中的HandDetectedFeedback预制体拖拽至Manager对象作为其子物体，为应用添加手势检测反馈。

Paste_Image.png

3.新增一个cube对象，并在此上添加一个CubeChangeColor.cs脚本

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

public class cubeChangeColor : MonoBehaviour {

    public static cubeChangeColor instance;

    void Awake()
    {
        instance = this;
    }

    public void OnChangeColor()
    {
        gameObject.GetComponent().material.color = new Color(Random.Range(0, 255) / 255f, Random.Range(0, 255) / 255f, Random.Range(0, 255) / 255f);
        Debug.Log("OnChangeColor");
    }
} 

4.UI -> Image 新建一个Image,会自动生成一个Canvas 和一个EventSystem

5.在EventSystem上添加Hololens输入模块。用以实现对按钮的点击操作等。

6.Canvas设置

• 修改Canvas相关参数，以适应控件在hololens视野中的大小。
  1)调整宽和高 （根据需要进行修改）
  2)调整缩放比例 （根据需要进行修改）
• 将Canvas对象中Canvas组件中的Render Mode设置为World Space；
• 将场景中的Main Camera拖拽至Canvas组件中的Event Camera；

• 对Canvas添加碰撞器，并修改碰撞器Size，使凝视射线能够凝视到UI界面上

7.设置Image的背景图片，这里其实和UGUI 常规做法相同，不加细述；

8.UI->Button 新建一个Button,并修改对应的缩放参数

9.给ButtonCanvas添加碰撞器

修改碰撞器Size，使凝视射线能够凝视到Button以便Gesture手势能对其进行交互触发。其实此时Button就相当于了一个游戏对象

给Button添加一个ButtonEvent.cs脚本组件：

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

public class buttonEvent : MonoBehaviour {

    public void OnSelect()
    {
        cubeChangeColor.instance.OnChangeColor();
        Debug.Log("OnSelect");
    }
}

GestureManager.cs手势识别对凝视到的对象进行发送OnSelect()消息实现触发。因此在Button上编写OnSelect()函数，函数内容是调用cube对象的CubeChangeColor.cs脚本组件上的随机改变颜色的函数。以此实现在HoloLens中点击Button随机变换cube颜色。

10.调试运行

可以看到在Hololens的视野中出现了一个UI界面,并且Hololens凝视射线可以凝视在上面。点击Button实现cube的随机颜色变换。

11.存在问题

• 和某些技术群讨论，说有一种做法是直接在Button上的OnClick()进行触发事件的添加，就可以对Gesture手势的点击响应，不用特意编写OnSelect()方法来响应手势识别。对此实验后无果，此做法仍待考证；
• 在Button上挂载ButtonEvent.cs脚本，实验表明脚本组件是否处于激活状态，都可以对OnSelect()进行触发，实现随机变换cube颜色；
• 使用Unity联机Hololens调试时，可以看到点击button时，cube随机变换颜色效果可以实现，但此时控制台会报错，提示如下，但报错后不影响程序的继续运行。待解决...