Unity 3D + Vuforia制作AR人物互动

话说之前说过了咱与本地漫展商合作推出AR app,虽然他们之前也已经做过了但是只有Android版,后来因为某些问题于是准备是让咱来接手后续的开发。(其实本来只是打算说iOS可以咱来做…而已…
不过在还没开始谈的时候就已经通过某种渠道获得了人物模型和动画,花了差不多4天时间从零开始完成了AR识别到人物展示以及人物动作这几个过程,而经过一段时间的“放假”之后最近则是直接完成了人物的交互。可以说目前以及可以达到上架的地步了。
嘛其实整个流程做完之后回头看其实还是很简单的,于是打算做本教程,当然因为没征得同意所以人物模型什么的是没办法放出的,源代码也是。但是看完整个流程下来不需要源码也行啦~

OK废话不多说赶紧开始吧~
首先先确认需求,咱要做的是在某图片上展示个人物会跳舞,触摸之后会有不同的反应。

接着是确定开发平台,虽然Unity 3D支持Android,但是如果想要做到iOS上还必须有Mac才行,当然Unity3D这个甚至可以制作到各种游戏机上不过目前咱没这个需要。目前就以iOS和Android为主吧~

确认平台之后就是工具了,首先Unity 3D是必须的(下载地址),官方有30天试用版,至于破解什么的自己去找谷歌娘要吧~
接着是Vuforia SDK(下载地址),这个是高通的AR方案,支持Android、iOS以及Unity 3D,咱们目前只需要Unity3D的,所以直接下载就好了。
最后是对应平台的SDK,iOS的话需要Xcode(下载地址),当然还需要真机调试需要iOS付费开发者账户以及证书。嘛这些网上很多就不再重复说了。
如果是Android的话则需要Eclipse(下载地址)以及Android SDK(下载地址),配置方法网上也很多所以不再重复说了…
嘛作为手机app开发者连这些都没用过或者说不知道的话那真是失格呢(笑)。

还有素材别忘记准备了喔!
1.识别用图片。
2.人物模型/动画,贴图。

接下来先来创建识别用图片的“文件”吧~
将准备好的识别用图片到这里创建Database并添加Target提交图片。(注意提前注册好账号喔~
屏幕快照 2013-09-26 20.48.07
最后将生成好的文件下载下来,不过注意下载的时候要选择Unity Editor。
屏幕快照 2013-09-26 20.45.45

接着打开Unity 3D,首次打开会有个非常华丽的游戏演示….不过比较残念我们做的不是普通游戏所以新建一个Sence。
然后将前面下载好的Vuforia SDK(vuforia-unity-android-ios-2-6-7.unitypackage文件)打开,导入到Unity 3D里。
于是在Project栏里应该能看到一堆东西。
屏幕快照 2013-09-26 20.56.04
接着到Assets/Qualcomm Augmented Reality/Prefabs/里把ARCamera和ImageTarget拖到Hierarchy那栏里。

首先导入前面制作好的图片识别文件(AR.unitypackage),接着在ARCamera的Inspector面板里的Data Set Load Behaviour下能找到刚才导入的那些。勾选之后下面会出现Active,同样勾选了。
屏幕快照 2013-09-26 21.42.30
*PS:别忘记调整Camera下的Clipping Planes,将Far设置得尽量大一些。不然AR识别的距离限制得非常近。

然后到ImageTarget的Inspector面板,在Image Target Behaviour下的Data Set里选择要作为AR识别的图片包。下面的Image Target里选择要作为识别的图片。
屏幕快照 2013-09-26 21.42.30

接着导入制作好的3D模型(咱用的是Maya制作好的fbx文件,内置两段动画,另外有几张人物贴图也一并导入),然后将人物模型拖到ImageTarget里面作为子项目。
因为场景太暗于是咱还放了一盏灯…
屏幕快照 2013-09-26 21.04.16

然后调整导入的人物的大小,发现人物只有框架没有贴图,于是在人物模型的Inspector面板里面按Select键,勾选Import Materials,然后下面的Material Naming选择Model Name + Model’s Material这个选项,最后别忘了Apply。这样人物应该变彩色了。

目前可以识别图片人物也能显示了,但是人物还是不能动的,于是切换到Rig页面,Animation Type选择Legacy,然后Generation选择Store in Root(new),Apply。
接着切换到Animations页面,因为咱的fbx文件已经包含了动画所以直接勾选Import Animation,Clips里能看到2段动画。注意选择好对应的时间轴区间。
屏幕快照 2013-09-26 21.28.56
其中Default Take是咱需要循环播放的,而ArmatureAction则是触摸之后只播放一次的,播放完之后则继续循环播放Default Take。接着Default Take里的Wrap Mode设置是Loop,而ArmatureAction的Wrap Mode则是选择Once。
嗯别忘了Apply。

目前为止人物能识别并且可以跳舞了。但是我们需要交互,既触摸屏幕人物会做别的动作。
说白了动作就是切换Animation的Clips,于是开始代码上的工作了~
在人物模型(比如咱现在用的是XY_girl__animation)的Inspector面板里按最下面那个大大的Add Component按钮,选择New Script,取个名字(比如咱的Touch Script),Language….嗯咱比较喜欢CSharp就选它吧~(当然你会JAVA可以选它,或者Boo也可以…但是咱下面的代码都是C#就是了。

接下来应该应该会打开MonoDevelop-Unity编辑器了。粘贴以下代码,根据自己实际需要进行修改:

using UnityEngine;
using System.Collections;
public class TouchScript : MonoBehaviour {
Vector2 m_screenpos = new Vector2();
// Use this for initialization
void Start () {
Input.multiTouchEnabled = true;
}
void MobileInput() {
if (Input.touchCount <= 0) return; if (Input.touchCount == 1){ if (Input.touches[0].phase == TouchPhase.Began){ //手指按下了 m_screenpos = Input.touches[0].position; Debug.Log("TOUCHED"); //如果正在播放着Default Take就开始播放ArmatureAction if (animation.IsPlaying("Default Take")){ animation.Play("ArmatureAction"); }else{ animation.Play("Default Take"); } } } else if (Input.touches[0].phase == TouchPhase.Moved){ //手指移动了 Debug.Log("MOVED"); } if (Input.touches[0].phase == TouchPhase.Ended && Input.touches[0].phase != TouchPhase.Canceled){ Vector2 pos = Input.touches[0].position; Debug.Log("TOUCHOUTED"); //手指松开了 } } void DesktopInput(){ float mx = Input.GetAxis("Mouse X"); float my = Input.GetAxis("Mouse Y"); if ( mx!= 0 || my !=0 ){ if (Input.GetMouseButton(0)){ //鼠标按键按下了 Debug.Log("CLICKED"); //如果正在播放着Default Take就开始播放ArmatureAction if (animation.IsPlaying("Default Take")){ animation.Play("ArmatureAction"); }else{ animation.Play("Default Take"); } } } } // Update is called once per frame void Update() { #if !UNITY_EDITOR && ( UNITY_iOS || UNITY_ANDROID ) MobileInput(); #else DesktopInput(); #endif //当ArmatureAction播放完毕停下的时候开始循环播放Default Take if(!animation.isPlaying){ animation.Play("Default Take"); } } }

保存之后切换回Unity 3D,接着在菜单栏的File里选Build Settings...,根据实际情况选择Android或者iOS,然后选择Build And Run。
Android的话需要选择APK文件保存位置以及AndroidSDK所在路径。
iOS则是选择project保存的位置。
之后就能在手机上看到AR效果了~

Unity 3D也支持自带调试的,方法就是按顶上的播放按钮。
屏幕快照 2013-09-26 22.13.06

其他Q&A:
1.想多个人物/物体同时出现/识别。
在ARCamera的Inspector面板里面的QCARBehaviour下面的Max Simultaneous Image Target设置需要同时识别的数量,最高似乎只能5个。
另外图片太小或者细节相差不大的图片都不能同时显示,相同图片更加不行了。

2.如何添加声音。
这是之后需要制作的,不过音频这个比动画简单多了,而且可以像上面那样使用代码来触发音频播放。

3.动画除了fbx自带之外,可以直接在unity里创建么?
要知道这本身就是做游戏的引擎,所以当然可以!咱这里只是根据咱自己的实际情况来写,一般的话只需要制作好的人物模型然后直接在unity里编写出发以及动作什么的,代码上也可以直接控制,详细可以去看unity的AnimatorController相关

还有问题可以留言给出。
原代码还没有得到官方授权所以是不能发出来了,但是有问题咱还是能尽量帮忙的~

6 thoughts on “Unity 3D + Vuforia制作AR人物互动

发表评论

电子邮件地址不会被公开。 必填项已用*标注

*

:b1 :b2 :b3 :b4 :b5 :b6 more »

Note: Commenter is allowed to use '@User+blank' to automatically notify your reply to other commenter. e.g, if ABC is one of commenter of this post, then write '@ABC '(exclude ') will automatically send your comment to ABC. Using '@all ' to notify all previous commenters. Be sure that the value of User should exactly match with commenter's name (case sensitive).