![見出し画像](https://assets.st-note.com/production/uploads/images/74823326/rectangle_large_type_2_de5d8f7626e394b71fcb6b8896c393f5.png?width=1200)
Clusterワールドでドアの開閉状態を他ユーザと共有する方法
勝手に非公式Clusterワールド制作部をやっています。
どうも、なっとうまきです。
さて、ワールドを作っていると扉を付けたくなるのが人情というものです。しかし、ドアに付けるのは開閉するだけの「アニメーション」だけでいいのでしょうか。
アニメーション:正式には、アニメーションクリップとUnity上では呼ばれています。この記事内では、アニメーション、もしくはアニメーションクリップと呼びます。
ドア開閉アニメーションだけでよいのか
結論から言うと、駄目です。
他のユーザと同期をするための仕組みが必要です。
同期をしないとどうなるの?
ワールドの初期状態:扉が閉まっている(Close)
例えば、「なっとうまき」と「読者の方」が同じワールドに行くとします。
「読者の方」が先にワールドに入り、ドアを開けます
「なっとうまき」が後からワールドに入って、ドアを見ると閉まっています。
「読者の方」視点:自分でドアを閉めてから、閉まったドアを貫通して入ってくる「なっとうまき」が見える。
![画像1](https://assets.st-note.com/production/uploads/images/74822924/picture_pc_594dae037eed397d66ade303cc84f1c4.png?width=1200)
こんなイメージ。
せっかくドアが開いたり閉じたりする表現を付けているのに、もったいないですね。
そして、世の中のゲームはちゃんと扉の状態がユーザ間で同期されています。
Clusterの限界はこんなものではないはず!
どんな仕組みにすればいいか。
まぁ、とりあえずアニメーションを作りましょう。
Animation・Animatorを使ってワールドに動きを与える
このページでドアの開閉アニメーションを作ったら
ロジックやアニメーションの遷移の設定をします。
が、、全体像を見ずに手順だけ見ても理解しづらいので、ロジックの動きを見てみましょう!
オブジェクト同士のブロック図です。
ここで言うオブジェクトとは、「ドア」のオブジェクトも含みますし「Interact Item Trigger」や「Item Logic」といったロジックすらも含みます。さらに、「ユーザ」(自分や他の人)すら含む意味になります(!)
オブジェクトの相互影響を図解したブロック図
ある意味設計図ですね。
![設計図1](https://assets.st-note.com/production/uploads/images/74831441/picture_pc_a11c465b2ffe220acafdc47e3c6220f5.png?width=1200)
ここで大事なのは、ドアが開いているか(door_is_open)を示すフラグがtrueであればドアが開いているので、door_is_open=trueならば、ドアを閉じるアニメーションを動かします。
矢印の方向は、影響を与える向きです。
A→B なら、AがBに影響を与える というように読んでください。
つまり、ItemLogicはdoor_is_open変数に影響を与え、door_is_open変数もItemLogicに影響を与えます。さらに、door_is_open変数はSet Animator Value Gimmickに影響を与え、Animatorを動かし、Animatorに設定しているアニメータコントローラ(以降コントローラ)を動作させ、コントローラはdoor_is_open変数を読み取った上で状態を遷移させアニメーションを最終的に再生しています。
・・・・みたいな。
楽しくなってきましたね!!!!!
ロジックを作る
先程のブロック図の、この部分を作ります。
![設計図2](https://assets.st-note.com/production/uploads/images/74830858/picture_pc_1f9879fac956c97df14f3f7075f28f54.png?width=1200)
というわけでこんな雰囲気になりました。
![画像4](https://assets.st-note.com/production/uploads/images/74826963/picture_pc_018780ceb4c847913ad91f9256f91970.png?width=1200)
この画像内で、ItemLogicに設定している変数のタイプがRoomStateとなっています。
これは、今いるワールド全体の状態としてdoor_is_openを管理してますよ。ということを意味しています。
つまり、RoomStateはユーザ全員から参照され、変更可能な変数となります。
次、残りの部分を作っていきます
![設計図3](https://assets.st-note.com/production/uploads/images/74830864/picture_pc_fec23a28ac8bf776074bcc2677937ede.png?width=1200)
アニメーション自体の作り方は、「Animation・Animatorを使ってワールドに動きを与える」を参照してください。
このページで作ったアニメーションがドアの種類分だけザーッと揃うとこんな雰囲気になります。
(全てのドア分モーションを作るのはちょっと面倒なので、一つのドアで相対座標を計算させるモーションを一定の箇所だけ記録して横展開しています。)
この方法の詳細についてはまた別の記事を書こうと思います。
書けるかな?誰か書いてくれるかな?
アニメーションクリップとアニメータコントローラ
黄色い四角で囲った、三角形のアイコン(左)と、四角形が3個重なっているようなアイコン(右)があります。
これらはそれぞれ、左側の三角形を「アニメーションクリップ 」右側の四角形が3個重なっているようなものを「アニメータコントローラ」と呼びます。
![画像6](https://assets.st-note.com/production/uploads/images/74831226/picture_pc_f789881ccf85e46d4b60d76d322987fa.png?width=1200)
ここでは、アニメーションを作った上で、状態遷移をさせるロジックをコントローラに付けます。
その前に、アニメーションクリップに対して、最低限の準備をします。
アニメーションクリップに対する準備
もし、画像のようにチェックが入ってしまっていたら、チェックを外しましょう!アニメーションがループしてドアがパタパタ開いたり閉じたりします。
![画像8](https://assets.st-note.com/production/uploads/images/74831698/picture_pc_0158e62afd0e3e5aeaa62ff95edc3b89.png?width=1200)
チェックを外す!
![画像7](https://assets.st-note.com/production/uploads/images/74831679/picture_pc_9f656827e36fb670e1448a5f99080cbd.png?width=1200)
これが正しい状態です。
アニメータコントローラの設定
全体像を見るとこういうふうになっていればOKです。
ひとつひとつ見ていきましょう。
![画像9](https://assets.st-note.com/production/uploads/images/74831750/picture_pc_eae7a69c8c788bddd5f6f5eaaa10e7ca.png?width=1200)
ワールドで管理しているdoor_is_open変数を使うために、「パラメータ」一覧に「door_is_open」を追加します。
追加の方法は以下の手順です。
![画像10](https://assets.st-note.com/production/uploads/images/74832030/picture_pc_4aab76fa31db4893419859e66b7ed6e9.png)
New Boolという名前を、
![画像11](https://assets.st-note.com/production/uploads/images/74832043/picture_pc_c84106d0e7e26ab1765521e9f41d1f4e.png)
以下のように、door_is_openに変更します。
![画像12](https://assets.st-note.com/production/uploads/images/74832075/picture_pc_7040d11acf55d3459ebae8e00d43947b.png)
これで、「door_is_open」を使う準備はできました。
状態遷移の設定
アニメータコントローラには「デフォルトの状態」が存在します。
つまり、ユーザが何もしていない時の状態を持っています。
言い方を変えると、「ワールドに降り立った瞬間にどんなアニメーションするか」というステートです。
それが、Entryというステートから伸びているオレンジ色のステートです。
基本的にワールドに降り立った時、の挙動は「何もしない」状態が好ましいので、アニメーションは何も設定しない状態にしておきましょう。
「何もしない」という意味合いで、ここではIdleと命名しています。
![画像13](https://assets.st-note.com/production/uploads/images/74832140/picture_pc_c2a64db878e421a9ce5c4c39f327fdf0.png?width=1200)
そして、このIdleというオレンジ色の箱をクリックすると、右側のインスペクターにはMotionが設定されていると思います。
「何もしない」ので、Motionを「なし(モーション)」に設定します。
![画像14](https://assets.st-note.com/production/uploads/images/74832226/picture_pc_9fc7d5c1cfbe057a5230d49c8199a98d.png?width=1200)
これで、ワールドに入っても何も起こらない(扉が閉まったままなら閉まったまま)の状態遷移が出来ました!
扉を開け閉めする状態遷移を作る
このままでは、扉を開けることが出来ません。
そのため、状態遷移をいい感じに設定してあげます。
これから作るのは状態遷移図(ステートマシンダイアグラム)とも言います。とはいえ、まぁあまり細かいことを気にしてもワールドは作れないので作っていきましょう。
口で言うのはかんたんですが、設定するのもかんたんです。
とりあえずおもむろに、以下の三角形のアニメーションクリップを
![画像16](https://assets.st-note.com/production/uploads/images/74832599/picture_pc_668f916511805c3fb0da477b1b80c61b.png)
ステートマシン図を描く画面にドラッグ&ドロップします。
そうすると、以下のようにドラッグ&ドロップした場所に、灰色のブロック(ステート)が追加されるはずです。(2個追加していますが、それぞれ「開く」アニメーションクリップと「閉じる」アニメーションクリップをドラッグ&ドロップしました)
![画像16](https://assets.st-note.com/production/uploads/images/74832635/picture_pc_1833dbb625dc6fcd4759ba5beb599e2c.png?width=1200)
AnyStateを右クリックして、遷移を作成をクリックします。
![画像17](https://assets.st-note.com/production/uploads/images/74832691/picture_pc_f5eda0012dc54d1557fa73fca4e4fc77.png?width=1200)
すると矢印が出るので、こんな感じにぴょいっとつなげます。
![画像18](https://assets.st-note.com/production/uploads/images/74832725/picture_pc_baea217be53a78f5498adf66be1ed7cd.png?width=1200)
両方つなげるとこうなります。
![画像19](https://assets.st-note.com/production/uploads/images/74832735/picture_pc_391c4b5ac1100d9c95b049540b7f950f.png?width=1200)
遷移条件の設定 その1
はい、ではラストスパートです。
先程つないだ「矢印」をクリックします。(手順1)
(矢印のことをエッジともいいます。)
![画像20](https://assets.st-note.com/production/uploads/images/74832795/picture_pc_8d83a9a16d2a626e680b2eedf3650268.png?width=1200)
そして、インスペクタのSettingsをクリックします(手順2)
さらに、自身に遷移のチェックを外します
![画像21](https://assets.st-note.com/production/uploads/images/74832867/picture_pc_a63b7210ca79c615c4bc584b6805275f.png?width=1200)
こうなっていればOKです。
もう片方の矢印も同じように設定します。
これをしないと、自分自身に遷移してしまって、これまたドアがパタパタと開いたり閉じたりしてしまう原因になります。
状態遷移条件の設定 その2
上記の設定をしたら、更にインスペクタに注目します。
※もし以下の画像と同じようなインスペクタが表示されていなければ、開くアニメーションか、閉じるアニメーションにつながっている「矢印」をクリックしてみると開くことが出来ますよ。
![画像22](https://assets.st-note.com/production/uploads/images/74832930/picture_pc_8972dc589e73069aeb077b09d74b0ea0.png?width=1200)
黄色い四角で囲った部分が「遷移条件」になります(Condition:条件)
この部分の、+で囲った部分をクリックすると
![画像23](https://assets.st-note.com/production/uploads/images/74833137/picture_pc_b6ef416d1dc9b0792a56258f1c567125.png)
このように、door_is_openとtrue が出てきます(もしかするとfalseかも知れません)
![画像24](https://assets.st-note.com/production/uploads/images/74833152/picture_pc_6d4bd7978ade016de0109ffa78177005.png?width=1200)
これらが意味するところは、
「もし、door_is_openが、trueならば、この遷移を辿りなさい」
という意味合いですので、もっと日本語に意訳すると
「もし、ドアが開いていたならば、この遷移を辿りなさい」
となります。
door_is_openがtrueならば、ドアが開いているので、ドアを閉める遷移へ
door_is_openがfalseならば、ドアが閉じているので、ドアを開ける遷移へ
というようにそれぞれの矢印を設定します。
そして完成へ。。。
お疲れさまでした!動作を確認して正しく動くか見てみてください。
ぐおー疲れた。
今日はここまで。
この記事が気に入ったらサポートをしてみませんか?