【clusterVR】Animatorでマス目上を動く箱を作ろう【Unity】

今回は以前の記事でも紹介した、cluster上で作成した「十字キーボタンでマス目上を動く箱」の解説記事になります。

clusterで十字キーと、キーで操作できる箱作りました
ボードゲームまでは無理だけど、誰かが操作する箱から他の人が逃げる　みたいな遊びはできそうか#clusterVR #clusterSDK pic.twitter.com/3DL45mIO5F

— いかやろう＠ (@mizumoriyuua) November 7, 2019

タイトルではclutserに限定していますが、自作のスクリプトが使えないプラットフォームでどうにかしてプレイヤーの入力に合わせて動く物を作りたい。という場合に参考になるかもしれません。

十字キーボタンの作成

まずは箱を動かすための十字キーを作ります。

Animatorにパラメータを送るためのトリガーを用意しているのですが、こちらはclutserSDK独自の実装となります。

左のボタン押したら「@Left」のIdを送信

下のボタン押したら「@Down」のIdを送信　というように、上下左右の各ボタンに合わせたIdを送信しています

動く箱の作成（発想）

さて、次に十字キーの入力で動く箱を作りたいのですが、ちょっと考えてみます。

簡単に2×2の4マス上でスタートから右に動く場合、座標は以下のようになります。

次に上を入力して座標:11に移動する場合、「箱が現在座標:10にある」　という情報が必要になります。

Animationでキーフレームを設定して座標を変えるだけでは、「箱が移動した後の座標」を保存できません。

なので、今回は箱の移動にAnimationのキーフレームによる座標移動を使用しません。

Animatorは状態の変化、今回の場合だと「今どの座標にいるか」という情報が保存できます。これを利用して座標の移動を実現します。

（Unityの「Animation」「Animator」という単語は、字面が紛らわしい上に機能も難しいのでよく混乱します。よく分からないって方は一度「unity animator animation」あたりで検索して調べておくと良いかもしれません。この記事ではそれぞれの機能自体の説明は省いています）

動く箱の作成（Animationの作成）

上で書いた通りキーフレームによる座標移動は使いません。0:00時点の座標だけ設定します。（画像拡大して見てください。また、動きがわかりやすいように座標を2倍にしています）

動く箱の作成（Animatorの作成）

上で作成したAnimationからAnimatorを作成しましょう。

十字キーの入力「Up」～「Down」のパラメータも忘れずに追加します。

動く箱の作成（AnimatorTransitionBaseの設定）

それぞれの座標の遷移条件を設定します。

01→00（座標:01の時に下が押された）の場合

まず、Conditionsは「Down」に設定

そして、TransitionDurationを「0.5」に設定します

このTransitionDurationがキモで、このパラメータで「01から00の状態に0.5秒かけてゆっくり切り替わる」ようになります。

つまり、座標も(x,z):(0,2)から(x,z):(0,0)に0.5秒かけてゆっくり切り替わるので、箱が下にスライドしているように見せることができます。

（その他のパラメータは・・・正直よくわかりません。Has Exit Timeとかすごい重要そうな気がしますが、上記の通りにしたら思うように動いたのでとりあえず置いておきます）

あとはそれぞれのAnimationを隣り合うマスに遷移するようにそれぞれ条件を設定しましょう。

動く箱の作成（トリガー受信）

最後に、十字キーで送信したIdを受信するように設定します

受信したIdに合わせて、Animatorに「Up」～「Down」のパラメータを渡しています

おわりに

十字キーでマス目を動く箱の解説は以上になります

書いた本人もAnimatorを知ったばかりなので、間違った箇所もあると思います。そもそもAnimatorをこのように使用することが正解なのかよく分かっていません。しかし、スクリプトが使えない環境で、Animatorによってオブジェクトの座標を保存する。という発想は制限された環境だからこそ生まれたのかな　と思います。

本記事が似たような状況で悩んでいる人の助けになったり、発想の手掛かりになれば嬉しいです

おまけ

冒頭の動画のように3×3のマス目上で動かす場合、Animatorは以下のようになります。こりゃあボードゲームなんて作ろうとしたら大変だ