基于VR技術(shù)的三維校園漫游系統(tǒng)的設(shè)計(jì)與實(shí)現(xiàn)

李滿 陳展鵬

摘? 要：基于VR技術(shù)的三維校園漫游系統(tǒng)，是根據(jù)VR技術(shù)的三大特征——沉浸感、交互性和構(gòu)想性去設(shè)計(jì)實(shí)現(xiàn)的，其中使用到三維建模軟件3DS MAX、功能實(shí)現(xiàn)軟件Unity3D 5.5.3f以及SteamVR插件和VRTK插件。本文主要實(shí)現(xiàn)漫游功能、UI交互功能。借助于虛擬現(xiàn)實(shí)設(shè)備，能夠做到足不出戶就能觀察到真實(shí)的虛擬校園。

關(guān)鍵詞：校園漫游;虛擬現(xiàn)實(shí);Unity3D;C#

中圖分類號(hào)：TP391.41? ? ? ?文獻(xiàn)標(biāo)識(shí)碼：A 文章編號(hào)：2096-4706（2019）19-0100-04

Abstract：The design and implementation of 3D campus roaming system based on VR technology is designed according to the three characteristics of VR technology-immersion，interactivity and conception，including 3D modeling software 3DS MAX，function realization software Unity 3D 5.5.3f，as well as the steam SteamVR plugin and the VRTK plugin. This topic mainly implements roaming functions and UI interaction functions. With the help of virtual reality devices，real virtual campuses can be observed without leaving home.

Keywords：campus roaming system;VR;Unity3D;C#

0? 引? 言

隨著科技的進(jìn)步，VR（Virtual Reality，虛擬現(xiàn)實(shí)）技術(shù)和設(shè)備開(kāi)始走向大眾，據(jù)IDC（國(guó)際數(shù)據(jù)公司）近期發(fā)布的《中國(guó)VR/AR市場(chǎng)季度跟蹤報(bào)告》顯示，2019年第一季度中國(guó)頭顯設(shè)備出貨量接近27.5萬(wàn)臺(tái)，同比增長(zhǎng)15.1%[1]。VR設(shè)備的俏銷說(shuō)明VR的應(yīng)用越來(lái)越廣泛，如在教育、醫(yī)療、旅游、游戲及建筑行業(yè)的應(yīng)用如日中天，各個(gè)大學(xué)也紛紛把校園以VR形式搬到線上，達(dá)到宣傳學(xué)校、提高學(xué)校社會(huì)知名度的目的。

在國(guó)內(nèi)，BAT（B——百度，A——阿里巴巴，T——騰訊）三巨頭都在投資虛擬現(xiàn)實(shí)。僅在中國(guó)網(wǎng)民中，BAT就已經(jīng)擁有了非常龐大的虛擬現(xiàn)實(shí)內(nèi)容受眾群體。如：

百度在2017年提出建造世界上最大的中國(guó)語(yǔ)言VR服務(wù);阿里巴巴建設(shè)了VR購(gòu)物體驗(yàn)系統(tǒng)，推出VR商場(chǎng)——Buy+;2015年，騰訊公布了Tencent VR SDK及開(kāi)發(fā)者支持計(jì)劃，并且系統(tǒng)闡釋了對(duì)虛擬現(xiàn)實(shí)領(lǐng)域硬件和平臺(tái)兩大部分的規(guī)劃。

在國(guó)內(nèi)不少高校已經(jīng)建立起VR實(shí)驗(yàn)室，開(kāi)展虛擬現(xiàn)實(shí)相關(guān)的教學(xué)活動(dòng)和研究活動(dòng)。并且把校園以VR的形式搬到線上，達(dá)到更直觀地宣傳學(xué)校的目的[2]。

未來(lái)，5G技術(shù)帶來(lái)的高帶寬和低時(shí)延等優(yōu)勢(shì)，將帶動(dòng)VR應(yīng)用市場(chǎng)朝著更高精度、更強(qiáng)專業(yè)性的行業(yè)領(lǐng)域深入發(fā)展。IDC中國(guó)終端系統(tǒng)研究部市場(chǎng)分析師譚睿指出：“在經(jīng)歷了一段技術(shù)與生態(tài)的沉淀期后，國(guó)內(nèi)VR/AR行業(yè)將伴隨著迭代產(chǎn)品進(jìn)入市場(chǎng)從而釋放增長(zhǎng)潛能。VR/AR產(chǎn)業(yè)作為5G技術(shù)重要的落地應(yīng)用場(chǎng)景之一，深度應(yīng)用云計(jì)算、語(yǔ)音交互等技術(shù)，建立先發(fā)優(yōu)勢(shì)。”[3]

1? 校園漫游系統(tǒng)總體設(shè)計(jì)

本文以廣州工商學(xué)院三水校區(qū)為藍(lán)本，設(shè)計(jì)完成校園的漫游系統(tǒng)。主要解決模型、移動(dòng)、場(chǎng)景切換、UI交互以及打包發(fā)布五個(gè)問(wèn)題，如圖1所示。模型由美工、美術(shù)人員進(jìn)行搭建。移動(dòng)和UI交互需要用到SteamVR和VRTK（Virtual Reality Toolkit）這兩個(gè)插件去實(shí)現(xiàn)，場(chǎng)景切換需要載入和UI交互配合使用。打包發(fā)布用軟件的打包工具。

1.1? 用戶漫游移動(dòng)

在SteamVR插件的[CameraRig]上添加VRTK的VRTK_HeightAdjustTeleport腳本實(shí)現(xiàn)虛擬現(xiàn)實(shí)的基本遠(yuǎn)程傳送，通過(guò)調(diào)整這個(gè)腳本的參數(shù)可以調(diào)整是否使用重力、速度等的參數(shù)。

在SteamVR的[CameraRig]下的兩個(gè)Controller上都掛載VRTK的VRTK_Tracked Object和VRTK_Simple Pointer來(lái)實(shí)現(xiàn)在手柄上添加一條射線，方便用戶知道自己在往哪個(gè)方向傳送和知道哪些地方能夠過(guò)去、哪些地方不能過(guò)去。再配合VRTK_ControllerEvents等腳本實(shí)現(xiàn)手柄射線控制用戶移動(dòng)[4]。

1.2? 場(chǎng)景切換

Unity3D引擎由于場(chǎng)景物體過(guò)多會(huì)導(dǎo)致過(guò)度占用內(nèi)存，所以一個(gè)場(chǎng)景之中一般不能存在過(guò)多的物體，否則會(huì)占用大量?jī)?nèi)存，影響用戶體驗(yàn)。這個(gè)時(shí)候就需要使用場(chǎng)景切換。場(chǎng)景切換有四種方法。

第一種是同步載入，代碼是Application.LoadLevel（）;第二種是異步載入，代碼是Application.LoadLevelAsync（）;第三種是同步附加式載入，代碼是Application.LoadLevel Addictive（）;第四種是異步附加式載入，代碼是Application.LoadLevelAddictiveAsync（）。

使用同步載入的時(shí)候，在A場(chǎng)景切到B場(chǎng)景時(shí)，Unity3D會(huì)銷毀A場(chǎng)景顯示B場(chǎng)景，但是如果B場(chǎng)景比較大的時(shí)候會(huì)感到異常的卡頓。

使用異步載入的時(shí)候，載入場(chǎng)景是在后臺(tái)進(jìn)行的，所以在切換場(chǎng)景的時(shí)候不會(huì)卡頓，適合載入大型場(chǎng)景的時(shí)候使用。

使用同步附加式載入的時(shí)候，在載入結(jié)束后場(chǎng)景A和場(chǎng)景B將會(huì)同一時(shí)間存在，比較適合地圖比較大的時(shí)候使用。

異步附加式載入跟同步附加式載入的區(qū)別依舊是一個(gè)在主線程運(yùn)行一個(gè)在后臺(tái)線程異步進(jìn)行。

1.3? UI交互

在Unity3D中有兩種方法制作UI交互面板。一個(gè)是NGUI插件，另一個(gè)是Unity自帶的UGUI。NGUI和UGUI都是出自同一個(gè)制作組，前者是在Unity3D沒(méi)有UI制作面板的時(shí)候由NGUI的制作組制作發(fā)布供給用戶使用;后者則是在Unity3D 5.X版本之后Unity的公司招募這個(gè)制作組制作的。

1.3.1? 使用NGUI進(jìn)行制作UI交互面板

在創(chuàng)建NGUI的時(shí)候，系統(tǒng)會(huì)自動(dòng)檢測(cè)有沒(méi)有UI Root和NGUI的Camera，如果沒(méi)有，會(huì)自動(dòng)生成UI Root和Camera，所有UI空間都必須放在UI Root中。其中，Sprite是圖片，使用Sprite的時(shí)候需要把圖片打包成圖集，使用NGUI的Atlas Maker把圖片打包，然后使用圖片，通過(guò)調(diào)整參數(shù)調(diào)整圖片大小等。Label是文字，值得注意的是NGUI自帶的字體不支持中文，需要使用Unity3D里的字體才能支持中文。Texture也是圖片，它與Sprite的區(qū)別是不用把圖片打包成圖集，一般用于制作背景。Prefab Toolbar把里面需要的按鈕放上去就能直接使用，按鈕背景可以根據(jù)自己喜好去修改[5]。

1.3.2? 使用UGUI進(jìn)行制作UI交互面板

因?yàn)槭浅鲎酝粋€(gè)制作組，跟NGUI部分原理相同。UGUI使用的時(shí)候需要添加一個(gè)Canvas（畫(huà)布），用作于承載體，所以UGUI的控件也必須放在Canvas里。Panel相當(dāng)于NGUI的Texture，image相當(dāng)于NGUI的Sprite，Text相當(dāng)于NGUI的Label。功能一樣，但是，使用image的時(shí)候，圖片不需要打包成圖集，可以直接放進(jìn)去使用。功能按鈕控件的使用方法和NGUI基本相同，導(dǎo)入就能直接使用。

1.4? Unity的打包與發(fā)布

在制作好之后要把自己制作好的東西打包發(fā)布成exe、apk等格式的文件供用戶使用，因?yàn)檫@個(gè)三維校園漫游系統(tǒng)是在PC端運(yùn)行的，所以需要將文件打包成exe格式發(fā)布供用戶下載使用。

2? 三維校園漫游系統(tǒng)的設(shè)計(jì)與實(shí)現(xiàn)

2.1? 前期準(zhǔn)備

在制作三維校園漫游系統(tǒng)之前，首先要進(jìn)行拍攝，掌握學(xué)校每一棟建筑的特點(diǎn)，這對(duì)于建模和場(chǎng)景搭建都有非常深遠(yuǎn)的影響。以學(xué)生宿舍為例，學(xué)生宿舍結(jié)構(gòu)都是一樣的，只不過(guò)是位置和房間的數(shù)量不同，掌握好這些基本條件，很快就能將大量宿舍的模型創(chuàng)建出來(lái)。同時(shí)還需要準(zhǔn)備一張學(xué)校的俯視圖和施工圖，這樣方便場(chǎng)景搭建，能夠很好地確定每個(gè)模型在場(chǎng)景中的具體位置。

2.2? 場(chǎng)景搭建

場(chǎng)景搭建是至關(guān)重要的一步，如果沒(méi)搭建好場(chǎng)景就開(kāi)始制作，會(huì)導(dǎo)致一些功能的實(shí)現(xiàn)出現(xiàn)bug。在搭建場(chǎng)景時(shí)，需要注意比例。在Unity3D里面所使用的單位是米，所以在建模和搭建場(chǎng)景要使用米來(lái)做單位，防止因?yàn)閱挝槐壤粚?duì)而導(dǎo)致出現(xiàn)模型失調(diào)等bug。在制作初期通常使用白模或者是低精度模去搭建場(chǎng)景，以便保持進(jìn)度一致，在完成低模場(chǎng)景搭建后再進(jìn)行功能實(shí)現(xiàn)，在后期將白模或者低精度模替換成有貼圖的高精度模型，并不會(huì)影響到功能的實(shí)現(xiàn)。圖2是制作三維校園漫游系統(tǒng)使用白模搭建的校門口場(chǎng)景。在使用虛擬現(xiàn)實(shí)設(shè)備調(diào)試時(shí)，由于純白色的模型顯示會(huì)對(duì)眼睛造成傷害，要把模型加上顏色，如紫色，方便觀察以及后期的調(diào)試。

在搭建場(chǎng)景時(shí)，使用地形工具創(chuàng)建河流和湖泊，首先要先將地形抬高，再按住Shift+鼠標(biāo)左鍵，對(duì)地形進(jìn)行降低處理，再在降低的地形上放置Unity3D官方提供的水材質(zhì)，把水鋪上去就能完成河和人工湖了。如圖3所示為校園內(nèi)河流添加水面后的效果。

2.3? 漫游系統(tǒng)的實(shí)現(xiàn)

漫游系統(tǒng)的實(shí)現(xiàn)主要是靠SteamVR插件和VRTK這兩個(gè)插件共同完成，SteamVR插件主要是使用[CameraRig]預(yù)制體。這個(gè)預(yù)制體是已經(jīng)自帶相機(jī)的，所以需要?jiǎng)h除或者隱藏場(chǎng)景中的主要攝像機(jī)，以獲取SteamVR的攝像機(jī)。[CameraRig]下是帶有兩個(gè)控制手柄的，這個(gè)控制手柄只有在運(yùn)行的時(shí)候才會(huì)顯示出來(lái)。這兩個(gè)手柄都已經(jīng)是有對(duì)應(yīng)的腳本功能的，使用時(shí)只要獲取按鈕就能實(shí)現(xiàn)交互功能。使用SteamVR_TrackedObject trackdeObjec;這句代碼能夠獲取到SteamVR手柄[6]。

在開(kāi)始前輸入這一段代碼能夠獲取到手柄上的組件。

void Awake（）

{

//獲取手柄上的這個(gè)組件

trackdeObjec = GetComponent<SteamVR_TrackedObject>（）;

}

在獲取完手柄組件之后，在FixedUpdate中獲取手柄的輸入“var device = SteamVR_Controller.Input（（int）trackdeObjec. index）;”，然后使用if（）條件語(yǔ)句來(lái)設(shè)置事件，例如下面這一句是當(dāng)觸碰到扳機(jī)鍵后，控制臺(tái)會(huì)打印出“觸碰扳機(jī)鍵，持續(xù)中…”：

if （device.GetTouch（SteamVR_Controller.ButtonMask.Trigger））

{

Debug.Log（"觸碰扳機(jī)鍵，持續(xù)中…"）;

}

這就是SteamVR手柄按鈕的獲取以及功能的實(shí)現(xiàn)。

在獲取SteamVR手柄按鈕之后，就需要實(shí)現(xiàn)漫游功能，而VRTK這個(gè)插件的腳本正好能夠?qū)崿F(xiàn)漫游功能。VRTK_HeightAdjustTeleport這個(gè)腳本能實(shí)現(xiàn)基本的傳送功能，把它掛載到SteamVR的攝像機(jī)上，但是它必須要使用VRTK的世界坐標(biāo)。然后使用VRTK_Tracked Object、VRTK_Simple Pointer、VRTK_ControllerEvents等腳本，掛載在SteamVR手柄上，能實(shí)現(xiàn)可視化傳送目標(biāo)，能夠根據(jù)射線顏色和目標(biāo)點(diǎn)來(lái)確定傳送的地方。

if （pointer.gameObject.activeSelf）

{

Ray pointerRaycast = new Ray（transform.position， transform.forward）;

RaycastHit pointerCollidedWith;

var rayHit = Physics.Raycast （pointerRaycast， out pointerCollidedWith， pointerLength，～layersToIgnore）;

var pointerBeamLength = GetPointerBeam Length（rayHit， pointerCollidedWith）;

SetPointerTransform（pointerBeamLength， pointerThickness）;

}

這一段代碼實(shí)現(xiàn)可視化傳送，在手柄上發(fā)射一條射線，射線擊中的地方就是傳送的目的地。但是要注意，因?yàn)橛行┑胤绞遣荒苓^(guò)去的，所以要給物體加上碰撞體的組件，否則會(huì)出現(xiàn)穿模。

在添加碰撞體組件時(shí)要注意包裹住整個(gè)模型，以免出現(xiàn)因?yàn)椴糠执┠６a(chǎn)生bug。添加完碰撞體組件后，有阻擋的地方射線會(huì)變成紅色，用戶就無(wú)法傳送到紅色的地方。

2.4? 場(chǎng)景跳轉(zhuǎn)的實(shí)現(xiàn)

實(shí)現(xiàn)場(chǎng)景跳轉(zhuǎn)需要使用UI交互，UI交互是用戶體驗(yàn)最重要的環(huán)節(jié)。在這個(gè)三維校園漫游系統(tǒng)里面，選擇使用異步載入的方式，以防止部分用戶因設(shè)備問(wèn)題導(dǎo)致加載卡頓。異步載入使用SceneManager.LoadSceneAsync（）方法進(jìn)行載入場(chǎng)景。首先是在場(chǎng)景A里面創(chuàng)建一個(gè)Canvas，然后在Canvas里面創(chuàng)建一個(gè)Button，新建一個(gè)腳本，用于實(shí)現(xiàn)跳轉(zhuǎn)加載場(chǎng)景，因?yàn)榧虞d場(chǎng)景里面就只有一張圖片和加載條，所以一般用戶很快就能讀取到加載場(chǎng)景。所以腳本直接使用同步載入。代碼如下：

public class ToLoading ： MonoBehaviour，IPointerClickHandler

{

[Tooltip（"Loading"）]

public string nextSceneName="Loading";

public void OnPointerClick（PointerEventData eventData）

{

SceneManager.LoadScene（nextSceneName）;

}

}

在加載場(chǎng)景Loading里面放入圖片和滑動(dòng)條以及文字，在文字上新建一個(gè)腳本就能實(shí)現(xiàn)異步載入。完成異步載入，能夠使得電腦配置較差的用戶在切換場(chǎng)景時(shí)不會(huì)過(guò)于卡頓。

任何漫游系統(tǒng)都不能缺少場(chǎng)景切換，如果場(chǎng)景較小，對(duì)于設(shè)備要求不高的可以使用同步載入;如果場(chǎng)景較大，對(duì)于設(shè)備要求較高的就需要使用異步載入。如果說(shuō)場(chǎng)景較大對(duì)設(shè)備要求不高但是切換場(chǎng)景后不銷毀前一個(gè)場(chǎng)景那就是用同步附加式載入;對(duì)設(shè)備要求高則用異步附加式載入。

2.5? UI交互實(shí)現(xiàn)

UI交互是非常常見(jiàn)也是必需的一種功能，三維校園漫游系統(tǒng)是使用虛擬現(xiàn)實(shí)設(shè)備手柄去體驗(yàn)UI交互的。所以需要使用到SteamVR插件和VRTK插件。

在右手的手柄上添加以下幾個(gè)組件：VRTK_Controller Events;VRTK_Controller Actions;VRTK_Pointer;VRTK_UI Pointer以及VRTK_Straight Pointer Render。添加完組件之后要注意指定Renderer，否則無(wú)法運(yùn)行。

然后開(kāi)始設(shè)置UI。創(chuàng)建UGUI，把GUI的模式設(shè)置為World Space，如果不設(shè)置World Space的話會(huì)無(wú)法使用UI的。在Canvas上添加一個(gè)VRTK_UI Canvas組件用于交互。然后把需要的按鈕等放進(jìn)去就能使用虛擬現(xiàn)實(shí)設(shè)備去進(jìn)行UI交互了。

但是這樣還不夠，不能讓UI面板一直顯示在視線前面，需要先把UI面板隱藏，然后添加一個(gè)腳本，獲取到手柄的輸入，當(dāng)用戶按下菜單鍵的時(shí)候讓UI面板顯示，不需要時(shí)再按一次將其隱藏。

2.6? 音樂(lè)的添加

音樂(lè)也是必須要有的功能，可以讓用戶在輕松愉快的音樂(lè)聲中漫游虛擬校園。

在SteamVR的攝像機(jī)上添加一個(gè)Audio Source組件，把準(zhǔn)備好的音樂(lè)放進(jìn)去就能夠?qū)崿F(xiàn)音樂(lè)的播放，可以設(shè)置循環(huán)播放;如果音樂(lè)太少可以使用Audio Clip編輯音頻添加多音樂(lè)進(jìn)去。也可以通過(guò)添加UI來(lái)調(diào)整聲音的大小，添加一個(gè)Slider，然后設(shè)置腳本綁定Audio Source組件的音量，就能實(shí)現(xiàn)聲音大小調(diào)整的功能了。

2.7? 打包發(fā)布

設(shè)計(jì)完成，調(diào)試通過(guò)，最后就要進(jìn)行打包發(fā)布。在選項(xiàng)File中找到Build Setting，然后設(shè)置發(fā)布，選擇PC端打包發(fā)布，把做好的場(chǎng)景拖進(jìn)去，然后點(diǎn)擊Build就能打包發(fā)布了。要注意場(chǎng)景順序不要打亂，否則發(fā)布之后會(huì)導(dǎo)致場(chǎng)景混亂和bug的出現(xiàn)。

3? 結(jié)? 論

三維校園漫游系統(tǒng)的開(kāi)發(fā)，是技術(shù)和藝術(shù)綜合知識(shí)能力的應(yīng)用，要有整體規(guī)劃，要掌握拍攝技術(shù)、建模技術(shù)，要懂美工和編程等等，作為VR技術(shù)開(kāi)發(fā)人員，必須要技藝兩全，有開(kāi)拓創(chuàng)新精神和團(tuán)隊(duì)合作意識(shí)，綜合素質(zhì)要高。

盡管整個(gè)三維校園漫游系統(tǒng)的開(kāi)發(fā)已經(jīng)完成，功能內(nèi)容已經(jīng)實(shí)現(xiàn)，具有一定的使用價(jià)值，但是由于時(shí)間關(guān)系和開(kāi)發(fā)經(jīng)驗(yàn)不足，在這個(gè)系統(tǒng)中仍有值得去改進(jìn)的地方，比如所代碼的簡(jiǎn)化完善、場(chǎng)景優(yōu)化等等。

參考文獻(xiàn)：

[1] 趙佳蕊.2019年Q1中國(guó)VR頭顯出貨量同比增長(zhǎng)15.1%，增量來(lái)自桌面頭顯 [EB/OL].智東西.（2019-07-10）.http：//www. sohu.com/a/326214839_115978，2019-07-10.

[2] VR小哥.深度解析BAT在VR領(lǐng)域的布局和投資 [EB/OL].（2018-03-07）.http：//www.sohu.com/a/225049842_ 100085695.

[3] 盧雁明.國(guó)外VR虛擬現(xiàn)實(shí)技術(shù)的發(fā)展及應(yīng)用現(xiàn)狀 [EB/OL].（2016-11-09）.http：//www.yuloo.com/mbgx/1611/ 1475372.shtml.

[4] Karli Watson，Christian Nagel，等著.C#入門經(jīng)典：第5版 [M].齊立波，譯.北京：清華大學(xué)出版社，2010.

[5] 程杰.大話設(shè)計(jì)模式 [M].北京：清華大學(xué)出版社，2007.

[6] 銳萌瑞.SteamVR插件使用 [EB/OL].（2018-01-29）.https：//blog.csdn.net/qq_34552886/article/details/79200302.

作者簡(jiǎn)介：李滿（1966.12-），女，漢族，河南南陽(yáng)人，副教授，本科，碩士，研究方向：計(jì)算機(jī)應(yīng)用;陳展鵬（1997.10-），男，漢族，廣東廣州人，本科，學(xué)士學(xué)位，研究方向：數(shù)字媒體技術(shù)。