Ameba Ownd

アプリで簡単、無料ホームページ作成

道具を出し入れする備忘録のお話

2022.02.17 12:02

たまにはこういうのもと思いまして、需要があるかどうかは置いときますけどね!

今回はVRChatでの道具の出し入れ、定期的に悩んでる方を観測してるのでちょっとくらいお力になれればと思いまして!参考になりましたら幸いでございます!!


おしながき


以上3点を軽く説明いたします、説明にあたって最低限のベースを記事書き始める前に作っており、説明に必要な道具を作り足しながら書き進めました!作ったものは下のリンクからドライブに飛んでダウンロードできるはずです、よければ使ってくださいね!


以下はすべて説明です、とても長いのでぜんぶ暗記する必要はないですよ~!

それでは今回使わせていただくアバターをご紹介します!

…シリンダーくんです!

ちなみにちゃんとした設定をしているのでこのままアバターとしてアップロードできるみたいです!しないけど!!


道具を『出す⇔消す』

まずはこちらから、題名の通り(ぜんぶそうなんですけど)特定のアイテムを出し入れする方法!とりあえずヒエラルキーから!

〇1.avatar_dummy(シリンダーくん)

┗2.物の出し入れ_オンとオフ

 ┗3.出し入れしたいものをここに格納(今回これをアニメーションで切り替え)

  ┗4.出し入れするもの例(キューブにします)

こんな感じになります、実際に使うときには出し入れするもの例(キューブにします)を出し入れしたいものに差し替えるだけ!2番目3番目は空のオブジェクト(Create Emptyで作れるやつ)だよ!

次にアニメーション、ひとつのものを出し入れするだけなら一番簡単なのでぜひ覚えてほしいところ!

2つ作ったものがこちら!今回使うアニメーションは、出し入れするものの親になるものをつけたり消したりするだけのもの!

上のonは『出し入れしたいものをここに格納』を見えるようにして、offはその逆で見えなくしてるわけですね!

そしてこれが上のふたつのアニメーションをそれぞれ割り当てたアニメーターになります!たったこれだけで出し入れできちゃう!!

アニメーションはそれぞれ『on』を物を出す、『off』を物をしまうの中に入れてあります!四角をつないでる矢印は四角を右クリックして「Make Transition(メニューの一番上に出るはず)」を押すと出せるよ!

これは矢印をクリックしたときに出る設定、ほとんどデフォルトでいいのですが、必要なとこだけどう変わるか説明しておきますね!

Has Exit Time:チェックを入れると特定のタイミングでのみアニメーションが変わります!今回はメニューを押した瞬間変わってほしいので付けてない!

Transition Duration (s):アニメーションが変わるときに時間をどれだけかけたいか!なめらかな動きをさせたいときには必要ですが、今回はただ一瞬で出し入れするだけなので0!

Conditions:この条件を満たしたときに矢印の先のアニメーションへ移動します!今回の条件は『on_offというパラメータがtrueになったとき』ということですね!

余談ですがConditionsに入れる条件は枠の右下にある+記号を押すと複数設定できるようになります、複雑なものを作る場合はぜひどうぞ!

だいたい上の3つを覚えていればだいじょうぶ、動かしてパラメータをいじってみると…

上の画像みたいにキューブが出たり消えたりします、赤いキューブが出し入れされてる道具だと思ってください!

説明なのでUnity上でいじってますが、本来はVRChat上のメニューで操作する形になります、たぶん操作方法はわかると思うのでここではUnity上でそのメニューに出す方法だけ書いておきますね!

簡単にまとめますと、

  1. Animatorでパラメータを追加する
  2. Expression Parametersでパラメータを追加する(1.で作ったパラメータと同じ名前で!)
  3. Expression Menuで名前と挙動を設定する(このとき2.でパラメータを設定していないとリストに出ない)

という感じ、順番に説明していきますね!

1.Animatorでパラメータを追加する

先ほど四角と矢印をいじっていたのは画像左上のLayersってやつ、いま見ているのはその右のParametersというタブになります!

パラメータを追加するのは検索ボックス右の+マークからパラメータの種類を選択してから名前を入力するだけでできます!

種類をざっと説明すると『boolはオンとオフ、Intは整数、floatは小数点以下まで入れられる』といった感じ、いま見たらtriggerとかいうのがありましたけどわたしわかんないので使いたい方は各自で調べてください!

2.Expression Parametersでパラメータを追加する(1.で作ったパラメータと同じ名前で!)

左上のAddからパラメータを追加できて、『名前とタイプはAnimatorで設定したものと一緒』というのだけは覚えておいてくださいね!

右ふたつの説明!Defaultはパラメータの初期の値で、boolだとチェックをつけておくと最初から道具が出てる状態がデフォルトにできたりしますね!Savedはその値をずっと保持するかどうか、チェックを入れると一旦他のアバターにしたりログアウトしたりしても前回の状態が引き継がれますよ!

3.Expression Menuで名前と挙動を設定する(このとき2.でパラメータを設定していないとリストに出ない)

名前とアイコンは名称通りで、重要なのはタイプのところ!

主に(わたしが)使ってるのはだいたい4つ、Buttonはパラメータを指定した数値に一時的に変更するもので、主にエモートなどの「一回始まったらしばらく押さないよ~」みたいなもので使える!

Toggleはメニューで押すたびに指定した値とデフォルトの値を交互に切り替える、今回は主にこのToggleを使って切り替えをしていく形になりますね!

Sub Menuはその名の通りサブメニューへのリンクが作れます、メニューがひとつで足りないときに使うのでたくさん改変するときはお世話になるかもしれませんね!

Radial Puppetはパラメータを0~1の範囲で自由にいじれる一番便利なもの!最後に紹介する『複数から特定のアイテムを出す』ときに使うので、気になる方はそちらまで!


以上の設定が終わったらアバターを一旦アップロードしてチェックしてメニューを確認してみるのがいいですね!うまく設定できていれば出したり消したりがうまくいくと思いますよ!


基本である道具を単に出し入れするだけならここで終了です、他2つも今から説明しますよ~!


道具Aと道具Bの『どちらかを出す』

次に説明するのは2つの道具のどちらかを出す方法!

常にどちらか片方が出るので、入れるものによっては2着の衣装の切り替えなんかも実装できる優れものですよ!しっかり身につければ、今後の改変の幅が広がったりするかも?

〇1.avatar_dummy(シリンダーくん)

┗2.物の出し入れ_2アイテムの切り替え

 ┗3.出し入れしたいものをここに格納_1

 ┃┗4.出し入れするもの例A

 ┗3.出し入れしたいものをここに格納_2

  ┗4.出し入れするもの例B


2つの道具を出すときのヒエラルキーはこうなります、先ほどのひとつだけ出し入れするときと同様に3番目の出し入れしたいもの以下略をアニメーションで操作することになります!

今回も先ほどと状況を似せるために出し入れするものの例はどちらもキューブになりますが、Aが赤色、Bは青色のキューブでやっていきますよ!

ここで使うのは上の2つのアニメーション!

さっき説明したのは道具が1個だったのでそれをオンとオフにするだけでしたが、今度は道具が2個で道具Aが消えるときに道具Bをかわりに出すということですね!

さっき作った『A』をAを出す、『B』をBを出すに入れただけでアニメーターの見た目は変わってないです!

名前と入ってるアニメーション以外の設定はさっきと同じなのでそちらを参照してくださいね!

パラメータをカチカチすると上の画像のようになります、赤と青のキューブが交互に、どちらかだけ出る!

道具1つとあんまりやってることは変わらないのできっと理解すればすぐできると思いますよ!


複数の道具の『いずれかを出す』

これが最後でわたしが一番知ってほしいやつ!3つ以上の道具をひとつのアニメーションとパラメータで管理できちゃいます!(もしくは2つの道具+どちらも出さないパターンを作る)

文章で説明するより実際に見た方が早い方もいるかも、

〇1.avatar_dummy(シリンダーくん)

┗2.物の出し入れ_3アイテム以上の切り替え

 ┗3.出し入れしたいものをここに格納_1

 ┃┗4.出し入れするもの例A

 ┗3.出し入れしたいものをここに格納_2

 ┃┗4.出し入れするもの例B

~~~中略~~~

 ┗3.出し入れしたいものをここに格納_9

  ┗4.出し入れするもの例I

という感じでアイテムが入る枠が9個、9個というのはけっこう知ってる方もいらっしゃる『Radial Inventory System』の1ページ分よりも多い数です!

そちらと比較すると、今回やるものは利便性と容量を犠牲にしたらその気になればいくらでも出せる道具を増やせるのが強みになります!

使うのはこのアニメーション、キー(ひし形のやつ)が大量に並んでいますが、やってることはアニメーションが右に行くごとに出てくる道具が変わっていくだけのものです!ちなみに実際やる分にはチェックがついたり消えたりするとこだけキーを作ればだいじょうぶですよ!

今回はアニメーションを10個に分割してます、9個目より後はぜんぶ表示しないのも入ってます!

こっちはアニメーター、えっこれだけ?これだけ!!

ただしこのままだと入れたアイテムがひたすら順番に高速で出てくるだけなので、ここでいじるところがあります!

こちらがアニメーターの四角の中、普段は上のほうのモーションのところで動かしたいアニメーションを入れるだけなのですが、今回いじるのはMotion Timeというところ!

設定方法は『Motion Timeの右側にあるチェックボックスにチェックを入れる』、『出てきたメニューから設定したいパラメータを選択する(ここではpuppetというパラメータ)』という2つだけです!

せっかく使うのでこちらも説明しますね、Motion Timeはオンにすると対象のパラメータの数値でアニメーションの進行を管理する機能です!例えば『0.5』と入れるとアニメーションのちょうど中央の状態で止まる!


出力の結果は画像が多くなりすぎるので割愛、あとは操作方法ですね!

Unity上でやるときはアニメーターのパラメータに数字入れれば見れるのですが、VRChat上で動かすときはちょっと変なのが出てくる!

メニューで選択するまでは他のものと変わりませんが、選択したあと円形のゲージみたいなのが出てきますので、それをVRモードならスティック等を傾けることで0~100%でパラメータの数字を直接操作できます!設定したい数値にできたらトリガーを引いて決定すれば他の項目がまた選べるようになるといった感じですね!



こんな具合で説明は以上となります、なかなか長文でしたがちょっとでも理解していただけたら幸いです!

わからないところや詳しく知りたいところがあれば、何かしらで連絡していただければわかる範囲でお答えしたりいっしょに考えたりするので、お気軽にご相談くださいね!

読んでくださってありがとうございました、また何かしら機会があれば…!