Skip to main content
 首页 » 资源教程

Unity3d Vive开发教程:Vive前置摄像头支线——利用Vive做《口袋妖怪》啦

2016年08月28日 00:33:3230070

这几天口袋妖怪火的不行,突然想到Vive不是自带前置摄像头吗,赶紧用起来啊!于是找了些资源,试了试,就做出了下面这个。

感谢Unity酱和自己的友情出演!!

 Unity3d Vive开发教程:Vive前置摄像头支线——利用Vive做《口袋妖怪》啦 资源教程 第1张

 Unity3d Vive开发教程:Vive前置摄像头支线——利用Vive做《口袋妖怪》啦 资源教程 第2张

 Unity3d Vive开发教程:Vive前置摄像头支线——利用Vive做《口袋妖怪》啦 资源教程 第3张

Ok 废话不多说直接切入主题,程序员们想想把萌妹子捧在手心的感觉,嘿嘿嘿。。。

准备工作:

1. ARToolkit下载。下载链接http://artoolkit.org/download-artoolkit-sdk。用Vive自然是要PC平台的啦,选Unity那个Package。这个是个开源的AR库,知乎有网友推荐书还不错,拿来用改了改就用在Vive上了,确实算好用了。

2. Unity5.0这个不说了,自己下,做VR开发的这个都知道吧。另外在商店下载Unity-chan妹子,你要喜欢其他模型也行啦。

3.打印途中的那种图片,即Maker。直接给一张我用的,标准的Hiro,这个要和程序里的参数对应的。

 Unity3d Vive开发教程:Vive前置摄像头支线——利用Vive做《口袋妖怪》啦 资源教程 第4张

Ok 准备完毕,下面说具体过程:

1.打开Unity,导入下载的Package包。你会发现里面有很多example scenes, 这里直接打开最简单的SimpleScene。

2.连接好Vive,打开SteamVR并在设置中打开摄像头(这个之前的文章都有写设置)。ARToolkit会自动识别摄像头并获取视频流,赞! 然后运行!然后将Vive摄像头对准Maker,然后就可以在Game窗口看到AR效果了!一个红色的Cube,会随着Maker的移动而动!然后此文就完结了!?别太天真了,青年

 Unity3d Vive开发教程:Vive前置摄像头支线——利用Vive做《口袋妖怪》啦 资源教程 第5张

。导入steamVR插件,在场景里拖入Vive开发必备的CameraRig Prefab,带上Vive看下效果,和Game窗口的不一样啊。继续往下看吧。

3.在场景Hierarchy中找到那个cube,删除!然后换成我们可爱的Unity酱,设置transform

 Unity3d Vive开发教程:Vive前置摄像头支线——利用Vive做《口袋妖怪》啦 资源教程 第6张

,一定要小巧可爱,对吧!另外记得将其Layer设置为AR background,作为相机单独成像的层。

4.接下来处理3中说的Vive中看不到想要效果的问题。毕竟ARToolkit不是为Vive开发专设的,Game里的画面是场景中两个相机画面的叠加,一个是Scene root下的Camera,负责拍摄Unity酱(AR场景),另一个是运行时加载的Video background,orthographic类型的相机,用来显示从Vive摄像头获取的视频流。相机的移动会导致拍到的Maker不一样,通过XXX运算即可得到相机的矩阵,然后对场景中的Camera做类似运动,从而拍摄到不同角度的Unity酱,从而Unity酱会随着Maker一起移动,旋转。对AR感兴趣的,请自行深究原理哈。扯得有点远了,我们再来看Vive 中的视角,就只能看到Video source 0的图像。Unity酱在场景中就是一个不会动的模型- -。所以怎么做呢? 似乎把GameView的图像放到Video source 0上面不就可以了吗。嗯,理论可行,接着做。

5. 按照4的分析,现在就要把Camera拍摄的图像“合成”到Video source 0 上,达到和GameView一样的效果。

在此之前先解决Video source0 不随Vive一起动的问题。很简单,将其作为Camera(eye)的子物体,由于Video source0是运行时生成的,在代码里找到其生成的代码,在ARController中的CreateVideoBackgroundMesh()函数中。

做两件事,一是将其设为Camera(eye)的子物体,另一个是设置其transform值,让其覆盖所见区域。功能一还费了一阵子,只怪自己学艺不精啊。一开始直接在ARController脚本下添加public 的变量试图引用Camera(eye),但怎么都看不见inspector中出现。最后发现原来是在ARControllerEditor脚本下作了额外的限制,在其中添加一行:,拖入CameraRig下的Camera(eye)。

arcontroller.eyeCam = EditorGUILayout.ObjectField(arcontroller.eyeCam, typeof(GameObject), true) as GameObject;

功能二在ARController添加几行代码

                pubic Gameobject eyeCam;

        vbmgo.transform.parent = eyeCam.transform;

        vbmgo.transform.position = new Vector3(0.0f, 0.0f, 1.5f);

        vbmgo.transform.rotation = new Quaternion(0.0f, 0.0f, 0.0f, 1.0f);

        vbmgo.transform.localScale = new Vector3(2.5f, 2.5f, 2.5f);

做好之后,在Video source 0的前面再加一层,同样作为Camera(eye)的子集,大小、位置和其一样,像这样(距离有点远了,记得拉到一起)。

 Unity3d Vive开发教程:Vive前置摄像头支线——利用Vive做《口袋妖怪》啦 资源教程 第7张

哎,码字好累啊。。。之后为该层添加材质和贴图,材质用和Video source 0一样的shader(VideoPlaneNoLight),贴图当然用RenderTexture(新建)啦,并将该RenderTexture指定给Sceneroot下的Camera。对这个Camera还需要做个改变,改变其clearflag类型,在ARCamera脚本->SetupCamera(),修改c.clearFlags = CameraClearFlags.Skybox;(或其他两个,原来是nothing,会导致Unity酱出现后不消失);

最后一步,设置该Camera的Viewport Rect为(0,0,1,1),我的做法是在ARCamera脚本->LateUpdate()中添加

private Rect initRect = new Rect(0,0,1,1);

this.GetComponent<Camera>().rect = initRect;

这只是我的临时做法,没有细究rect值改变的地方,有兴趣的童鞋找到方法后一定要告诉我啊!

6.至此,带上Vive查看效果吧,对准Maker之后,萌萌的妹子就出现啦!感觉再多的辛苦都值得了啊!

附上自己的工程网盘链接:http://pan.baidu.com/s/1slxiBTj。

 PS: 奉献出这篇Vive AR 前置摄像头教程,让口袋妖怪离中国也能更近点,更希望中国自己的AR游戏早点出来啊!!赶紧一起加入到Vive的开发者社区中吧,利用Vive开发出更多,更好玩的应用!有问题欢迎交流!


评论列表暂无评论
发表评论