之前我就已經(jīng)寫過這樣的東西,今天通過另一種方式實(shí)現(xiàn).

利用魚眼圖片制作VR全景漫游:
http://www.lxweimin.com/p/d2f31771a072

效果圖:

1.gif

1、VR場(chǎng)景漫游

關(guān)于使用工具切圖的方法不再講述,請(qǐng)看上面的鏈接文章,里面就有就有第一種方法,通過天空盒子制作.雖然是基于HTC,但是對(duì)于CardBoard同樣適用.

2、實(shí)現(xiàn)場(chǎng)景漫游

首先將圖片修改為CubeMap,其原理就是六張圖貼起來

Paste_Image.png

可以看到圖片轉(zhuǎn)換后還是很大的

Paste_Image.png

創(chuàng)建方塊體,修改內(nèi)部材質(zhì)為具有CubeMap貼圖的材質(zhì)球

Paste_Image.png

將攝像機(jī)導(dǎo)入

Paste_Image.png

最后打包,編譯成手機(jī)APK文件,運(yùn)行到手機(jī)上.效果還不錯(cuò).
注意:手機(jī)的橫豎屏要區(qū)分開,然后要通過手機(jī)盒子進(jìn)行.

3、全景相冊(cè)

實(shí)現(xiàn)原理

全景相冊(cè)-其實(shí)通過制作上面的功可以知道,我們只需要切換材質(zhì)球或者圖片

1-兩種方式:

(1)切換材質(zhì):
這樣就簡(jiǎn)單了,但是我們剛才看到材質(zhì)球轉(zhuǎn)換后大約是16MB,對(duì)于手機(jī)的應(yīng)用來說一個(gè)材質(zhì)16MB有點(diǎn)big,所以需要熱更新,緩存文件,再展示.類似于預(yù)加載.
(2)切換材質(zhì)的圖片:
設(shè)置圖片的類型為Cubemap,然后修改材質(zhì)球內(nèi)部"_MainText"就可以做到全景照片切換了.這個(gè)_MainText其實(shí)就是獲取材質(zhì)的圖片.

2-交互

具體查看我前面的博客

3D物體交互,
http://www.lxweimin.com/p/643890e4c57d
UI交互
http://www.lxweimin.com/p/3696bc837551

看完后,我們就具備了事件交互功能的制作,然后我們要通過一些特定操作進(jìn)行,例如2秒后進(jìn)入下一張圖片等
我們就在方塊上添加腳本,并根據(jù)攝像機(jī)的指向來響應(yīng)事件

OnClick就是點(diǎn)擊鼠標(biāo)后

通過事件觸發(fā)進(jìn)行操作

上面論述過全景相冊(cè)的原理,所以我們就根據(jù)事件的響應(yīng)方法來制作我們的相冊(cè),
(1)切換材質(zhì):
這個(gè)太簡(jiǎn)單,就不論述了.你可以加群: 134688909來獲取相關(guān)的資源.

群號(hào):134688909

(2)切換材質(zhì)的圖片:

當(dāng) 2s后，會(huì)動(dòng)態(tài)替換material的Texture來實(shí)現(xiàn)替換360°照片，代碼如下
public void OnClick() {   
 Renderer render1 = this.GetComponent<Renderer>();    
 Renderer render2 = pano.GetComponent<Renderer>();  
 Texture tex = render1.materials[0].GetTexture(“_MainTex”);   
 render2.materials[0].SetTexture(“_MainTex”, tex);
 }