Unity For Android Cardboard App ( 1 ):基础入门

作者: ericzwhuang

前言

目前Google官方推出的VR设备有DayDream(2016年推出)和Cardboard(2014年推出)两种。

  • Daydream是消费级VR解决方案,提供了手持遥控设备Controller,提高渲染效率,优化延迟。
  • Cardboard是体验级VR解决方案,属于入门级VR设备的首选,物美价廉。

本文针对的VR设备是Cardboard,Google为Cardboard提供的VR SDK主要有四种,分别是Android,iOS,Unity和Unreal。本文主要阐述的是如何在Unity环境下开发VR场景,实现视线与物体的简单交互。

软件准备

工欲善其事,必先利其器,首先介绍开发过程中需要用到的软件环境和开发工具

  • Unity Editor 编辑图形界面的利器,所见即所得,使用的是Unity 5.4.2f2个人版
  • Visual Studio 微软出品的C#开发编辑器,使用的是Visual Studio 2015个人版
  • VR SDK 使用的是Google VR为Unity提供的SDK ,下载得到GoogleVRForUnity.unitypackage文件
  • Android SDK Android开发必备环境,推荐和Android Studio配套下载
  • JDK JAVA开发必备环境,需要配置环境变量
  • Cardboard 最便宜的VR体验设备盒子,可以网购或自行组装

开发流程

本文将通过以下步骤来完成开发过程,使用清晰直观的图片辅助说明

  • 导入资源,构建双目视图
  • 添加交互物体
  • 代码编写
  • 建立物体、代码、事件之间关联关系
  • Android平台打包

导入资源,构建双目视图

新建项目之后,从Assets -> Import Package中引入之前下载完成的 unitypackage 包,Project中的Assets文件夹下会添加两个文件夹GoogleVRPlugins,包含Google为VR提供的一系列模板文件。

目前在Cardboard上展示的视图一般都是双目视图,又称分屏视图,左右眼看见的图片内容略有不同,图像相互叠加形成立体效果。将Assets->GoogleVR->Prefabs->GvrViewerMain.prefab移到结构列表中,选中GvrViewerMain ,在Inpsector中设置Screen Size值为Nexus 5Viewer Type值为Cardboard May 2015

此时在Scene视图中看不出有什么变化,点击运行之后可以看出已经有双目效果

Windows下按住Alt+移动鼠标,可以转动视角,目前还没有添加任何物体,VR中需要和视野范围内的物体进行交互,这就引出了一个问题:如何确定当前看到的是哪个物体。你也许会说是当前视野的视线聚焦的位置,事实也的确如此,如何将他标记出来呢?

为了有更好的用户体验,Google早就为我们提供了良好的呈现方式,称之为Gaze(注视、凝视)。

Assets->GoogleVR->Prefabs->UI->GvrReticlePointer.prefab 移到Main Camera结构下。注意这里Main Camera GvrReticlePointer是上下层级关系,不是并列关系。

添加交互物体

选中Main Camera,在Inspector中的底部选择Add Component ,添加GvrPointerPhysicsRaycaster

这个组件可以让camera与物体进行互动,Raycaster是光线发射的意思,好比摄像头发出的光,如果照射到物体,物体就会做出反应。添加之后如图所示

此时运行项目,就可以看见左右屏幕中间(不是正中间)都会有个白色的点,也就是上面提到的注视的点。移动方向和位置,项目会以第一人称的视角去观察。

项目只需要实现一个最简单的例子:视线聚焦到物体的时候物体变色,视线移开时物体恢复原状。首先我们创建一个球体Sphere,在Hierarchy的空白处鼠标右键点击->3D Object->Sphere,视图中会出现一个球体,位置默认是原点坐标(0,0,0),需要将Sphere移到camera的可见范围内,在Scene模式下可以点击camera查看摄像头的视角和范围,也可以在Game模式观察是否可以看到物体,Game模式下的所见内容就是camera的视野内容。点击Sphere可以看见Inspector中的相关属性,主要有位置、旋转角度和规模等。

代码编写

接下来需要编写代码来实现交互效果了,在Unity中一般使用C#或JavaScript来编写,Unity默认是使用MonoDevelop编辑器,但是一般编写C#是用Visual Studio编辑器,这里我采用的就是Visual Studio来编写C#。

在Assets下创建Script文件夹,主要存放代码文件。

在Script文件夹中鼠标右击创建代码文件,Create->C# Script,命名为GazeToSphere,主要的代码如下所示:

using UnityEngine;
using System.Collections;

public class GazeToSphere : MonoBehaviour {

    // Use this for initialization
    void Start ()
    {
        ChangeColor(false);
    }

    // Update is called once per frame
    void Update ()
    {

    }

    public void GazeEnter()
    {
        ChangeColor(true);
    }

    public void GazeExit()
    {
        ChangeColor(false);
    }

    public void ChangeColor(bool gaze)
    {
        GetComponent<Renderer>().material.color = gazedAt ? Color.black : Color.white;
    }

}

MonoBehaviour是每个脚本的基类,Javascript脚本自动继承MonoBehaviour ,使用C#时,需要显式继承MonoBehaviour,其中Start() ,Update()等方法是可以重写的。

下面对各个方法进行解释:

  • Start() 物体初始化方法,可重写。
  • Update() 物体刷新的方法,可重写。频率是每帧刷新,帧数可以由fps参数得知,如果fps是60,则表示每秒刷新60次,两次update之间的时间间隔是1/60s。
  • GazeEnter() 自定义的方法,表示视线进入物体。
  • GazeExit() 自定义的方法,表示视线离开物体。
  • isGazed() 自定义的方法,表示对当前渲染的物体进行变色处理。

Visual Studio默认不会自动保存文件,所以编写完代码之后记住要手动保存文件,否则在后面关联过程会出现问题。目前实现的功能是视线进入球体,球体变成黑色,视线离开物体,球体变成白色。

建立物体、代码、事件之间关联关系

下一步是将物体、代码、事件之间关联起来,选中Sphere,在Inspector中点击Add Component ,搜索创建的C#文件的名字GazeToSphere,添加相关部件。

首先建立视线与物体之间的关联关系,需要添加事件系统,在Hierarchy的空白处鼠标右键点击->UI->Event System ,选中Event System 之后,在Inspector中点击Add Component 按钮,然后在输入框中搜索GvrPointertInputModule ,添加对应模块。

接下来就要将之前写的GazeToSphere 和这个module关联在一起,再回到Sphere 上,继续添加component,搜索Event Trigger并添加。

然后要添加触发的事件类型,点击Add New Event Type ,选择添加Pointer Enter ,表示进入事件,然后点击+ 按钮,

None(Object) 中点击右侧的小圆圈,

会弹出框中选择当前的Sphere 对象,

然后点击No Function 这一栏,在下拉框中选择GazeToSphere->GazeEnter ,这里需要注意之前提到的要主动保存文件,否则在这里无法索引到GazeToSphere的GazeEnter方法。

上面的操作主要实现的内容就是当视线进入球体时,会触发GazeEnter方法,而GazeEnter 方法执行的就是将球体的颜色变成黑色。因此还需要添加离开事件,按照同样的方法,再添加一个Event Type ,这次选择添加Pointer Exit ,表示离开事件,关联的是GazeToSphere的GazeExit 方法,结果如图所示。

在pc上测试的效果如图所示,焦点在球体外的时候,球体显示白色。

当焦点进入球体时,焦点会从白点变成一个圆圈,表示Gaze状态变化,球体变成黑色。

Android平台打包

将项目保存成.scene 类型文件,然后点击File->Build Settings ,选择Android平台,首次移植到Android时会显示如下图片。

点击Open Download Page ,会自动下载一个UnitySetup-Android-Support-for-Editor 文件,点击安装,会提示先关闭Unity编辑器,安装完成之后再次打开Unity编辑器。目前还只是在PC端上测试,下面需要打包成可以在Android系统上运行的apk文件。这里需要配置SDK和JDK的路径,点击Edit->Preferences->External Tools ,勾选默认使用VS打开C#文件,配置SDK和JDK路径,NDK路径可以先暂时不用配置。

点击File->Build Settings ,点击Add Open Scenes ,选中保存的项目,在平台中选择Android,点击底部的Player Settings

在这些位置需要编辑包名,主要是公司名称和产品名称,注意不能有数字。

在Resolution and Presentation 中勾选Landscape Left 或者Landscape Right,因为Cardboard 中默认手机是横向放置,所以默认选择横屏,一般习惯是Left。

然后点击Build And Run ,选择安装包的位置,等待手机运行即可(当然手机要通过usb连着电脑了,而且只能连一台手机,因为没有可以选择安装在哪一台手机上的过程),第一次编译过程会比较慢,之前一直是在Windows平台编译,这次转换平台,很多资源需要重新转换。接下来就把手机放在Cardboard中,感受一下VR的效果吧。

原创声明,本文系作者授权云+社区-专栏发表,未经许可,不得转载。

如有侵权,请联系 yunjia_community@tencent.com 删除。

编辑于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏黑白安全

利用XSS绕过WAF进行SQL注入

通俗讲,就是XSS和sql注入相结合绕过waf。知识要能灵活运用嘛。做一个灵活的胖子(虽然我不是胖子)。

611
来自专栏逍遥剑客的游戏开发

Tiled源码分析(一): GUI编辑和布局

2509
来自专栏Jerry的SAP技术分享

Jerry的Fiori原创文章合集

我曾经于2014年10月到2016年5月工作于SAP CRM Fiori应用的开发团队, 我所在的团队负责下列这8个Fiori应用的维护和持续开发:

2025
来自专栏FreeBuf

如何通过Python实现自动填写调查问卷

0X00 前言的,我才想起来貌似我也还没做。对于这种无意义的问卷,我是不怎么感冒的,所以我打算使用”特技”来完成,也就是python,顺便重新复习一下pytho...

3595
来自专栏编程

python编程

使用python编写客户端不是一件很复杂的事情。比如说,基本上不管是mac版本,还是windows版本、linux版本,一般python都默认安装了Tkinte...

19510
来自专栏SEO

「SEO技巧」页面分页优化技巧

2877
来自专栏理论坞

UI(用户界面)设计规则和规范

界面是软件与用户交互的最直接的层,界面的好坏决定用户对软件的第一印象。而且设计良好的界面能够引导用户自己完成相应的操作,起到向导的作用。同时界面如同人的面孔,具...

733
来自专栏诸葛青云的专栏

两个小巧好用的C语言编辑器

近期有一些新关注的伙伴在后台经常留言刚入门 C语言 我该选择什么 C语言 编辑器好呢?都说欲善其事必先利其器,网络上也有很多不同类型的编辑器,让人很难进行抉择!...

60
来自专栏黑白安全

注入利器之“四人帮”

“注入”者,名如其义,在与对方数据库的一次次“别有用心”刺探访问中猜解出那些敏感信息的长要、范围,最终精确到点,颇有些让自己战友悄悄地打入敌人内部一样。看危险漫...

551
来自专栏非著名程序员

强烈推荐:一个简单高效的截图工具

工欲善其事必先利其器,今天我给大家推荐一个非常简单,非常高效,非常好用的截图工具。没办法,我这个人就是看见好东西喜欢和大家一起分享。真心是忍不住要分享一下。 1...

2458

扫码关注云+社区