はじめに
最近ようやく前から興味のあったAR技術を触り始めました。
今回はUnity+VuforiaでサクッとAR（拡張現実）で動画ファイルを再生する方法を紹介します。
参考にしたのはこちらの動画。
Teaching UNITY to my GIRLFRIEND!
ちなみにUnityは2D・3Dゲームを作るのに使われるゲームエンジンで、VuforiaはUnityでよく使われるARライブラリらしいです。（詳しくは知らない。。）
(2018/10/18 11:05 追記)
VuforiaはUnity 2017.2 からUnityで公式サポートされており、Vuforia SDKはUnityに統合されたようです。
Unityでお手軽AR開発！vuforiaを使ってみる
前提条件
- Unityの基本操作
- VRとARの違いが分かる程度の知識
やりたい事
- ARマーカー（画像ファイル）がカメラに認識されたら動画ファイルが再生されるようにする
環境
- Mac 10.13.6 (High Sierra)
- エディタ：Visual Studio for Mac (Version 7.5.1)
- 開発言語：C#
- Unity (Version 2018.2.9fi Personal)
「Unity」をインストール (*インストールされていない場合)
「Unityを取得」から無料版をダウンロードしてきます。
https://unity3d.com/jp
【Unity】 AR Cameraを設置する
- 「Main Camera」は使わないので削除しておきます。
- 「メニューバー > GameObject > Vuforia > AR Camera」を選択し、「AR Camera」をSceneにインポートします。
- 「AR Camera」が設置されました。
- 次に 「メニューバー > File > Build Settings」を選択します。
- 「Player Settings」をクリックします。
- XR Settingsの「Vuforia Augmented Reality Supported」にチェックを入れます。
【Vuforia】 ARマーカーを用意する
-
以下のURLの「Register」から登録します。
https://developer.vuforia.com/ -
「Develop > License Manager」 で「Get Development Key」をクリック。
1. 「App Name」を入力し、規約同意のチェックボックスにチェックを入れて「Confirm」をクリックします。
1. 新しい「License Key」が作成されました。クリックして進んだページで「License Key」の内容が確認できるのでコピーしておきます。
1. 「Target Manager」タブに切り替えて「Add Database」を選択します。
1. 「Name」を適当に入力し、「Type」は「Device」を選んで「Create」をクリックします。
- 追加したデータベースをクリックするとこの様な画面が表示されるので、「Add Target」をクリックします。
1. ARマーカーとして使用したい画像をアップロードします。Widthは「5」に設定して「Add」をクリックします。（※WidthはUnity上でも変更できます。）
1. 「Target」（ARマーカー）が追加されたので「Download Database (All)」からデータベースをローカルにダウンロードします。
1. 「Unity Editor」を選択して「Download」をクリックすると.unitypackage拡張子のファイルがダウンロードされます。
【Unity】 ARマーカーをインポートする
- 「AR Camera」が選択された状態で「Inspector」の「Open Vuforia configuration」をクリックします。
1. コピーしておいたVuforiaのLicense Keyを「App License Key」の部分に貼り付けます。
1. Vuforiaのサイトでダウンロードした.unitypackage拡張子のファイルを「Assets」にドラッグ&ドロップします。
1. ついでに動画ファイルも「Assets」にドラッグ&ドロップしておきます。（スクショの都合上余計なものが混ざっちゃってますが気にしないで下さい）
1. 「メニューバー > Game Object > Vuforia > Image」を選択するとVuforiaのデータベースに登録したARマーカーがSceneに追加されます。
1. 「ImageTarge > 3D Object > Quad」を選んで、クワッドオブジェクトを追加します。クワッドオブジェクトは動画再生などで使われることが多いみたいです。
[ドキュメント（プリミティブオブジェクト）](https://docs.unity3d.com/ja/500/Manual/PrimitiveObjects.html)
- 追加したクワッドオブジェクトが選択された状態で「Inspector」の「Add Component」からビデオプレイヤーコンポーネントを追加します。
- ビデオプレイヤーコンポーネントの「Video Clip」が空なので、先ほどAssetsフォルダーに入れておいた動画ファイルをドラッグ&ドロップします。
- 「Play On Awake」と「Wait For First Frame」のチェックを外します。(最初から動画が再生されないようにします)
- 「Inspector」の「Transform」で動画が表示される座標を調整します。（お好みで）
- こんな感じに調整してみました。（かなり適当）
【Unity】 DeafultTrackableEventHandlerクラスを編集
- 「ImageTarget」を選択した状態で「Inspector > DefaultTrackableEventHandler(Script)」セクションの「Video Player」にクワッドオブジェクトをドラッグ&ドロップします。
- 「Script」の「DefaultTrackableEventHandler」部分をダブルクリックしてC#のファイルを「Visual Studio Code for Mac」で開きます。
- 以下のコードを追加します。
// 名前空間
using UnityEngine.Video;
// プロパティ
public VideoPlayer videoPlayer;
// OnTrackingEventFoundメソッドの先頭に追加
// ARマーカーが認識されたら動画が再生されるようにします
videoPlayer.frame = 0;
videI Player.play();
// OnTrackingEventLostメソッドの先頭に追加
// ついでにARマーカーの認識が外れたら停止するようにしておきます
videoPlayer.frame = 0;
videoPlayer.stop();
テストしてみる！
出来た！
無事登録したARマーカーをカメラが認識したら動画が再生されました！
※画像はXcodeでビルドしてiPhoneXに飛ばして試した時のものですが、実際はUnity上で「Play」を押してテストします。
感想
AR関連を今後もいじるかは不明ですが、とりあえずそれっぽいことができたのでお腹いっぱいです。