この記事ではSTYLYでのVR空間内で特定の位置に一瞬でワープするアセットの作り方を紹介します。
ワープ移動完成イメージ
ワープする元の位置とワープ先をSTYLY Studio内で自由に決めることができるようにします。
VRのコントローラで特定のボタンに触れている時にトリガーを押すと指定した場所にワープする仕組みを作っていきます。
有料アセットのPlayMakerを使用していきます。
PlayMakerのインストールはこちらから
サンプル
STYLY GALLERYからサンプル空間を体験できます。
右コントローラーがボタンに触れているときにトリガーを押すとワープします。
記事で紹介しているUnityプロジェクトのダウンロードはこちらからできます。
WarpSystem_Sample
ボタンのモデリング
最初にボタンになる部分のモデリングをします。
形状はシンプルなキューブです。
見せる用のキューブと当たり判定用のキューブを2つ作ります。
Mayaでのモデリング
コライダー用のキューブは上のフェースを1枚削除したものです。
当たり判定はコントローラから出ているレーザーポインタを使用します。
VIVEコントローラのレーザーポインタを使う
レーザーポインタはメニューが非表示ときには非表示になりますがRayは出ているので判定は取ることができます。
触るとワープするボタンを作る
Unityでボタンを作る
2種類のキューブをUnityでインポートしてヒエラルキーに配置します。
Unityでインポート
コライダー用のキューブ(WarpBoxCol)を親にして同じ位置に重ねます。
Mesh Colliderを追加してメッシュと同じ形状のColliderを作ります。
Rigidbodyも追加し、RigidbodyのIs Kinematicにはチェックを入れておきます。
ColliderとRigitbodyの設定
ボタンの台を作る
ボタンの台になる部分を作ります。
UnityのCubeを作成してボタンの台になるように幅や長さを調整します。
それを子要素に入れます。
Cubeの追加
CubeについているBox Colliderは削除しておきます。
BoxColliderの削除
この状態で一度プレハブ化しておきます。
プレハブにする
PlayMakerの実装
プレハブを選択した状態でAdd FSMを選びます。
FSMの追加
State1をwaitに名前を変更します。
State1をWaitにする
新しくStateを追加します。
Stateを追加
新しくEventを追加します。
ボタンを入力して、インタラクションを実装します。
ボタン入力に関しては、以下の記事を参照します。
最初に、Eventsタブから、Global_TriggerPressDown_Rと入力し、イベントを追加しましょう。
Eventの追加
名前を”Global_TriggerPressDown_R”とします。
これで右コントローラのトリガーボタンが押されたことを取得できます。
State1のGlobal TransitionにTRIGGER ENTERを追加します。
TRIGGER ENTERを利用したTRIGGER EVENTに関しては、以下の記事を参照します。
Global Transitionの設定
Add TransitionのCustom EventからGlobal_TriggerPressDown_Rにします。
Transitionの設定
新たにStateを作成してState1からつないでいきます。
新しくStateを追加する
ワープ元とワープ先のアセットを作る
Cubeを作って名前をそれぞれWarpposition_A・Warpposition_Bとします。
Warpposition_Aをワープできる場所として使用し、Warpposition_Bの位置にワープするようにします。
これらもプレハブ化します。
Warppositionの作成
Box Colliderを削除しておきます。
Colliderの削除
Check Cameraの設定
カメラ情報を取得します。
カメラ情報を取得するには、以下の記事を参照します。
以下のようにStateを設定します。
Stateを作成し、名前をCheckVIVEに。
FINISHEDのイベントを付け加えて、waitのStateにつなげます。
アセットのObject Nameを取得する
WarppopsitionA,BのプレハブをSTYLYにアップロードします。
UnityからSTYLYにアセットをアップロードする方法は以下の記事をご参照ください。
STYLYへアップロード
アップロードが出来たらMy Modelsを開きます。
画像を上で右クリックを押して”画像のアドレスをコピー”をします。
.pngの前の文字列がObject Nameになります。 それをコピーします。
アセットのアドレスを取得
Find game ObjectでWarppositionを取得する
waitのStateにFind game objectのActionを追加します。
Object Nameにコピーした文字列を貼りつけます。
Object Nameに貼りつける
それぞれWarpA・WarpBに格納します。
Get Positionで位置を取得する
取得したVectorをWarpAposition・WarpBpositionに格納します。
Get Positoin で位置を取得
Vector3 Subtractで2点間の位置を比較する
BからAのVectorを引いて2点間の距離を取得します。
カメラを移動させる
waitにTRIGGER EXITをGlobal Transitionとして追加します。
TRIGGER EXIT追加
State2に移動するためのアクションを追加します。
Global_TriggerPressDown_Rで右コントローラのトリガーが押されるとState2に遷移します。
Translateを追加してGame ObjectにはチェックカメラのStateで取得したcameraを VectorにはSubtractしたあとのWarpBpositionを指定します。
Translateの追加
STYLY Studioで配置する
配置するときはWarpposition_AとWarpButtonを同じ場所にします。
ボタンに触れているときに右コントローラのトリガーを押すとWarpposition_Bの位置に瞬間移動します。
STYLY Studioで配置
UnityからSTYLYにアセットをアップロードする方法は、以下の記事を参考にしてください。
この記事ではUnityのPlayMakerを使ってVRカメラを瞬間移動する方法を紹介しました。
わざわざアップロードしたアセットの名前を取得したりして面倒くさい感じになっていますが、 STYLY Studio上でワープ先を自由にレイアウトできるようにしたかったのでこのような仕様になりました。
↓続きの記事↓
