基本のOn・OFFMAギミック

# TL;DR

服のON・OFFができるようになる


# 環境の用意
ON・OFFするために必要な環境や対象を用意する
1. 次を入れたプロジェクトを作る。多少違っても大丈夫
    1. Unity2022.3
    1. MA1.11.6
    1. Av3Emulator3.4.8
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2935918/658cd374-b07e-48c8-a530-d9bf29bf2d76.png)


1. 初期設定
    1. アバターをインポートしてHierarchyにいれる
    1. 服をインポートしてアバターに付ける
    1. MergeArmatureを適応
    1. ToolsからAv3EmulatorをEnable
    1. Playモードに入る
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2935918/1b43e8fb-87e8-4f2c-8f8f-c1c042ce4afe.png)

1. Projectに自分の名前/服の名前/resというフォルダを作る
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2935918/adbdae85-fcb5-485c-8036-80c06674f1d5.png)


# アニメーションの作成
ON・OFFの状況を記録したファイルを作成する

1. 右クリックメニューからAnimationを作成
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2935918/32365a66-2c16-4763-9a8d-65be76a40fa0.png)
1. 「対象のものをOFFにする」ような意味の名前を付ける
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2935918/ff916e58-9811-42f3-99d9-4907059d3764.png)
1. Ctrl+Dで必要なだけ増やす
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2935918/6f1feae8-05e4-4e36-823c-ba93505a1e59.png)
1. それぞれOFFにする感じの名前をつける
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2935918/79084eef-3e06-4804-9c4f-10cce02fa590.png)
1. 服のルートにドラッグ&ドロップ
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2935918/9f1aad48-c6b7-4e15-a5df-4483de1b267d.png)
1. こんな感じになる
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2935918/29e095f1-ab6c-42a3-bf7f-262c2bec0cee.png)
1. 作った三角形(Animation)をどれでもいいのでダブルクリックするとAnimationタブが開く
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2935918/1f13fdc8-03e0-404c-b218-36e79da7d0ec.png)
1. アバタールートをクリックすると録画ボタンが押せるようになるので押す
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2935918/ce2927bf-4747-4635-bf4b-ce7c402fda83.png)
1. 今はHatを編集しているので、
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2935918/3bce9f3b-352e-4518-935e-f9c99f6913f7.png)
1. HatのInspectorを開き、オフにする
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2935918/7df9c76f-e254-4fb8-8348-7f1001d61019.png)
1. Animationに戻って録画ボタンを押し、録画を終了
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2935918/775a5b4e-24e0-4c9b-b87b-23d1e97ebe83.png)
1. それぞれのアイテムについてオフのアニメーションを作る
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2935918/363f57af-ca59-4b1d-bd71-f10a2ad67fb7.png)
1. 全部できたら、アバタールートのInspectorを開く
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2935918/af09a48d-1143-4b61-82fe-0c31d25f58a1.png)
1. Animatorは要らないので、削除（ないと録画ができないので、録画が終わってから消すこと）
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2935918/af764c34-7b8f-4b89-81e9-9546096d90b7.png)
1. Projectから四角いやつを削除（活用する方法もありますが、一応。　※後付けでアニメを増やした場合は、どれが増えた四角なのかを識別して消すのはそれなりに大切、どんどん増えてしまうので。）
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2935918/5073cd1b-faf7-4e02-8947-f0c438e7d76c.png)
1. オフの記録された三角が３つある状態にする
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2935918/d93be5a6-817e-467d-8b9b-15535b86764d.png)
1. 全部選択(Ctrl+A)して増やす(Ctrl+D)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2935918/5ef948b0-c03f-496b-b22c-f28eeca4ce03.png)
1. ON的な雰囲気の名前にする
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2935918/62cc7f5f-5135-4613-b7bd-c3905b3b38c0.png)
1. ONの名称にしたやつをダブルクリックしてAnimationタブを開く
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2935918/235545a2-29bb-46c7-89ca-73815128e708.png)
1. 数字を0から1にする
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2935918/0baeb03e-d711-445d-ad41-8dec4cfd6fb6.png)
1. ダブルクリック、１にするという作業を全部やる　※ブレンドシェイプの場合は有効=100、無効0
1. 状態を定義したファイルの完成
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2935918/d76c9d39-cd93-4dfd-8eed-ad9a2b631368.png)

※保存を忘れずに！


# コントローラの作成
どういう条件でどの状態にするかという定義をする

1. 右クリックからAnimator Controllerを作成
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2935918/8b2c83d7-0b87-48ce-a259-5bc092805716.png)
1. 適当に名前を付ける（衣装名そのままとは違うほうが後々アニメを増やしたくなった時の自動生成と区別しやすくてよい）
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2935918/97b3bbff-a5e2-4eab-bbb7-1031f2b16fad.png)
1. ダブルクリックで開く
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2935918/ed09b437-4072-4eef-8281-053bba6767dd.png)
1. Parametersタブを開く
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2935918/cfb43ed0-531c-47ce-9ab4-d5126617562c.png)
1. +マークからfloatを作成
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2935918/66ae5503-6eee-42eb-96f6-8c4f9f5422a4.png)
1. 「1」を意味する変数名を付ける
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2935918/e7e1bd2a-d653-4ebd-87d5-e4c5480e12ca.png)
1. その変数の値を1にする（変数値の設定をするのはこれだけ）
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2935918/414a72cd-2c1d-404e-b08c-d265ed684cc7.png)
1. +マークから**floatを**作成し、先ほど作ったアニメに対応する名前を作る。「自分の名前/衣装名/」を先につけるのがおすすめ
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2935918/439e1b6f-6f68-41b2-b43d-0de8f8917dd8.png)
1. Layersに戻る
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2935918/6eb60c76-bb14-4ae6-9a4a-587637e7d23d.png)
1. +でレイヤを増やす
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2935918/b324cd21-d17f-4dac-bb34-4f69527b8b58.png)
1. 「自分の名前/衣装名」を命名
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2935918/ffff8a96-db10-4673-8d01-dc6eed5a0143.png)
1. 歯車マークを押してWeightを1にする
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2935918/9be0fdf3-0955-48ac-8f28-29c702a5a294.png)
1. Base Layerを削除
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2935918/2c47442b-199b-4f83-9c76-83ca8d939694.png)
1. こうなる
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2935918/9ee80d21-1b23-4218-bbed-fe759463a589.png)
1. 右側のグリッド上のところを右クリックして「CreateState→FromNewBlendTree」
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2935918/a185d414-4327-4f3d-ac92-af9c3dcc5644.png)
1. できたやつをダブルクリック
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2935918/a4bb750e-2668-4666-be08-b7a2de7007c0.png)
1. こうなる （正しくできていればこの時点で「1」を意味する変数名が書かれている）
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2935918/6a7ae185-fd6d-4f9d-b05f-3cad7ad5627b.png)
1. 四角をクリックしてInspectorを見る
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2935918/a2a374e7-9f03-4d5d-9260-f4ddfa2aa55d.png)
1. BlendTypeをDirectにする(Directにするのはここだけ)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2935918/af6dc7dd-c3a7-47a2-a15d-3fbfa3ccdf06.png)
1. +を押して「NewBlendTree」をパーツの数だけ（今回は3回）やる
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2935918/b68e58d9-3e5e-4a82-a5a8-0527b11c771f.png)
1. こうなる
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2935918/88befacf-263b-4dc9-928a-28d1335e6ebb.png)
1. 増やしたうち、一番上のものをクリックしてInspectorを見る
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2935918/4599ad78-e56c-4c63-9a42-8e83637e30db.png)
1. さっき定義したParameterを１つ設定
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2935918/98e686eb-94fc-4639-a3ca-12c4d09213a4.png)
1. +を押して「AddMotionField」を２回
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2935918/8fd518da-54de-4599-9de5-41ba04f29bb3.png)
1. こうなる
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2935918/5f0c642a-ecd7-4696-9724-4d4cc0606618.png)
1. Projectから「メニューを操作していない時になってほしい状態の三角」をドラッグ＆ドロップでThreshold0のほうに入れる。この場合はデフォルトでOFFで作る
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2935918/2e6197d6-00b9-4ef9-b7d8-a94933dd8148.png)
1. 入れてないほうを1にいれる
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2935918/6b3736b8-fc8b-4482-a197-3eca0c98332f.png)
1. 引きで見るとこうなる
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2935918/3ab4a932-6ec4-4f72-81ab-ec965c0ee1af.png)
1. 「Parameterを設定する、MotionFieldを増やす、アニメを入れる」を必要なだけ繰り返す
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2935918/e2617755-4131-4ccf-a2fe-9102fde9d6b5.png)

※保存を忘れずに！

# MAのセットアップ
作成したAnimatorControllerを衣装に紐づける
1. 衣装ルートのInspectorを開き、AddComponent
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2935918/05867404-3967-4464-97dd-5169557dbeef.png)
1. MA Menu Installerをつける
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2935918/ec934413-bf12-4e44-82a7-90732ff112ff.png)
1. MA Merge Animatorをつける
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2935918/0ee66d97-3f2f-46b4-b546-03858f05ac6a.png)
1. さっき作った四角を入れる
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2935918/1e358003-36c8-4a38-8fde-e7aab3d09e84.png)
1. MA Parametersをつける
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2935918/29cc7b07-5ba3-4c27-af72-37fd36dbd123.png)
1. 未登録パラメーターを押す
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2935918/64cdaacd-1bed-4303-8c8a-e71f405604ac.png)
1. 1を意味するもの**以外**を追加
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2935918/e274ed9d-b66e-4f18-bb90-eb5384c42a68.png)
1. つまり、こう
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2935918/96f65a56-e78f-4290-853f-eab81978884c.png)
1. **Bool**にする（さっきfloatだったのは気にしない）
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2935918/74354163-7348-401c-8a6a-639a5e9e13f5.png)
1. 全部同様
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2935918/a0403ca2-974c-4540-982c-971492a3babc.png)
1. MA Menu Groupを追加
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2935918/7339c0c2-8fab-429d-9b8a-646eb9aaf7c9.png)
1. 「メニューアイテムを追加」
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2935918/be126872-0aae-46e5-873b-d05dac37b301.png)
1. 次を設定
    1. 表示名に衣装の名前（VRCのメニューのフォルダ的なところにでる）
    1. タイプにSubMenu
    1. あればアイコン
1. メニュー内容を表示（追加ではない。間違えやすいので注意）
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2935918/85c980f1-ea42-412a-9223-08636be9e705.png)
1. 出てきた小さいほうの「メニューアイテムを追加」
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2935918/59e98250-90cf-4e81-9424-be1f78d320c2.png)
1. パーツの数だけ「メニューアイテムを追加」（小さいほう）
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2935918/3bb125c2-8a39-46d7-ab93-d90ff7041202.png)
1. それぞれメニューに表示する名前と、序盤に作成したパラメータ名を設定
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2935918/7866605c-636f-4834-a826-aa7ad794c2ee.png)

※保存を忘れずに！！（特にこの後の操作はUnityがクラッシュしがち)


# 動作確認
1. Playモードに入る
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2935918/8f81943a-04ab-4890-90d0-b724c3fc8902.png)
1. Hierarchyでアバターをクリックすると、Inspectorに先ほど作ったメニューがあるはず
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2935918/d46276e7-4edc-429d-ab78-044cbe0c6e90.png)
1. OnOffが動くことを確認する
    1. ちなみにこの説明はHat以外のアニメーションを録画してないのでHat以外が出ている
    1. デフォルトをOFFにする場合はこの作業の他にHierarchy上でOFFにしておいたほうがいい
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2935918/748a8344-a284-4244-bd13-983d5846d852.png)
1. 問題なければUploadしてVRCでも確認、問題なければ終わり


# 配布
1. セットアップしたものをHierarchyから「自分の名前/衣装名」フォルダに入れるとプレハブができる
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2935918/52091081-cad4-4d06-869d-b02e4d02a74b.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2935918/0a781a2b-212d-4327-b371-511e03465377.png)
1. 右クリックしてExportPackageでUnityPackageができる
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2935918/c5c470fe-db44-4a9a-8367-6b2aa6562e4a.png)

※UnityPackageを作った後に修正したくなったら、いろいろ方法はあるが、ProjectのPrefabを削除してもう一度Hierarchyから入れるのが多分もっとも楽

# 注意
- ここで触れていないMAコンポーネントのオプションはなるべく弄らないほうが良い
- 特にMA Merge Animatorはこのままで最適なのでけっして触らない