用Unity2017做一个简易的CardBoardVR应用

CardBoadVR + Gaze操作：

利用Unity2017做一个简易CardBoard的应用

CardBoard应该是目前VR市场上最廉价的”VR头显”，由于低廉的价格以及智能手机的普及使得这个纸盒有一个广泛的应用。这次就来介绍一下做一个CardBoard简易应用所需要的基础。

 

1.一台有陀螺仪的手机。

2.Unity，我这里使用的是Unity2017.1.0f3

由于Unity在5.6的时候就已经内置了GoogleVR的SDK，所以开发起来非常方便。

这次我们介绍一下怎么用Unity2017来搭一个简单的VR应用，其中实现了射线选择目标的效果。

 

一、启用 VR 并将 CardBoard添加为目标平台：

首先新建一个项目，打开项目后转换平台到安卓：

 

然后在PlayerSetting下的OtherSetting中勾选Virtual Reality Supported并在下面的SDK选择CardBoard。

 

 

注：CardBoard支持的最低的安卓API Level是19（安卓4.4），如果是DayDream的话最低API Level为24（安卓7.0）。

转换完成后在PC端是看不出来什么的，我们只需要搭好场景，导到手机上跑一下就好了。

  （ 如果不想使用VR模式或者是需要提供VR与正常模式切换的话，需要写一个脚本

需要 using UnityEngine.VR;    

在切换场景时写 VRSettings.enabled = false;  //关闭VR模式   

就能够关闭VR模式

）

 

 

这里拖入一个小方块，然后Build在导入手机运行，一个简易的场景就有了。

Unity  Game视图：

 

 

手机上：

 

下面来说Gaze操作的实现。

二、凝视Gaze操作来与虚拟物体进行交互：

利用凝视操作对物体作一个选择是简易的VR应用交互比较常见的方式。我们在看这个物体一定的时间之后选择这个物体。

1.首先我们需要做一个准星来表示我们屏幕正中间，也就是我们的“视点”：

 

将这个图标导入，并将其类型设置为Sprite(2DandUI)；

2.建立一个Image，并将我们的准星赋值给SurceImage，调整Image的大小和颜色合适并将其Type设置为Filled。再把Cavas的模式设置为WorldSpace，调整位置到摄像机前，并且在虚拟物体之前，然后把Cavas放到MainCamera下成为子物体。

 

 

3.这里利用射线做一个物体的选择，选择到物体3s后改变物体颜色，并在这选择的过程中让准星UI做一个变化，下面是主要代码和注释：

using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.UI;
 
public class test : MonoBehaviour
{
 
    public Image img;  //Gaze图标
    public float gazeTime = 0f;  //盯着的时间
    public float waitTime = 3f;  //盯多久才选中
    public bool hasChangeMat = false;
 
    //private float x;
    //private float y;
    private Material otherMat;
    // Use this for initialization
    void Start ()
    {       
       // x = y = 0f;     //方便电脑测试
    }
// Update is called once per frame
void Update ()
    {
       /*
 	//下面三行方便电脑测试 鼠标输入
        x += Input.GetAxis("Mouse X")*2f;
        y += Input.GetAxis("Mouse Y")*2f;
        this.transform.rotation = Quaternion.Euler(-y, x, 0);
        */
        //射线检测
        Ray ray = new Ray(this.transform.position, this.transform.forward);
        RaycastHit hitInfo;
        if (Physics.Raycast(ray, out hitInfo, Mathf.Infinity))
        {
            MeshRenderer otherRenderer = hitInfo.collider.gameObject.GetComponent();
            if (otherRenderer != null)
            {
                if (!hasChangeMat)  //如果没有换颜色
                {
                    gazeTime += Time.deltaTime;  //设置盯着的时间
                    otherMat = otherRenderer.material; //设置材质引用
                }
            }
            else
            {
                otherMat = null;
            }
 
        }
        else
        {
            otherMat = null;
            gazeTime = 0f;
            hasChangeMat = false;  //退出凝视则重置hasChangeMat
        }
 
        //如果盯着的时间>=应该等待的时间，则表示选中
        if (gazeTime >= waitTime)
        {
            gazeTime = 0f;
            hasChangeMat = true;
            //随机颜色并给材质
            float r = Random.Range(0f, 1f);
            float g = Random.Range(0f, 1f);
            float b = Random.Range(0f, 1f);
            Color randomColor = new Color(r, g, b);
            otherMat.color = randomColor;
            
        }
        else
        {
            //设置准星形状
            img.fillAmount = 1 - (gazeTime / waitTime); //设置FillAmount
        }
 
 
}
 
}

4.将这个脚本拖到MainCamera下，并给Image赋值，也可以修改WaitTime。

5.运行测试，电脑上运行如下：

选择前

选择中

 

选择后

 

手机端功能也正常。

 

 

简易的Gaze操作就是这样，主要就是射线和图片UI的设置。

下一次我们来实现一个简易的全景相册和全景视频的播放。

本文内容部分参考自Think加速想象力出版的《AR与VR开发实战》教程，更多学习资料也请关注www.arvrthink.com。