カスタムメニュープラグイン講座（第６回）「簡単なメニューを作成してみる」

RPGツクールMZ向けのトリアコンタン氏のプラグイン「カスタムメニュープラグイン（SceneCustomMenu.js）」の使い方講座です。

リンク：
・カスタムメニュー作成プラグインを調べてみた（とんびさん）

前回まではプラグイン自体の機能や設定、パラメータの説明を中心に進めてきました。
プラグインを触ったことがある方は少し退屈に感じたかもしれませんが、今回は実際に簡単なメニューを作成したいと思います。

今回は「簡単なサウンドテストをするメニュー」を作成したいと思います。

【１】オリジナルメニュー作成の手順

さて、オリジナルメニューを作成する手順についてです。順番は筆者なりの考えです。
いくつかのメニューを作成した経験から、以下の手順ですすめるとスムーズに作成出来ると思います。

（１）オリジナルメニューで何をするかを考える（扱うデータの種類の選定、ウィンドウの数など）
　↓
（２）ウィンドウのレイアウトを決める（ウィンドウの幅、高さ、座標など）
　↓
（３）ウィンドウごとのパラメータの設定（データスクリプト、イベント、項目表示など）
　↓
（４）テスト、動作を確認

（１）に関しては、オリジナルメニューで具体的に何をしてどういう振る舞いにするかを考えるということです。その際に扱うウィンドウをピックアップし、どのような内容にするか（データスクリプト）を決めるということです。
経験上、この最初の作業を怠ったり後回しにすると、一気に後の作業が大変になります。

（２）に関しては、（１）でピックアップしたウィンドウを作成・設定する作業です。
座標、幅、高さなどを決めて実際にゲームをプレイしたときにウィンドウだけを表示させます。
レイアウトは後からでも簡単に修正できるので、仮の配置でも問題ありません。
筆者はウィンドウごとの画像を使用しているので、（４）の作業が終わった時点でさらにウィンドウレイアウトを変更していたりします。

（３）はウィンドウごとに扱うデータの種類（データスクリプト）、決定・キャンセル・カーソルなどのイベント、データスクリプトから項目表示などを行います。
実際にこちらの作業がオリジナルメニュー作成における大きな作業です。時間がかかると思うので、根気よく頑張りましょう。

（４）はテストプレイして動作を確認します。パラメータ１つがミス入力していてもメニュー全体が動かなくなることもあるので、何度もテストをすることが大切です。

以上の順番を踏まえて作成していきたいと思います。

【２】サウンドメニューを考えて実際にウィンドウを表示させてみる

手順（１）、（２）を踏まえておおまかなレイアウトを考案します。

上のウィンドウがコマンドメニュー、真ん中が再生する曲リストとしました。
ウィンドウを設定しなければならないので、もう少し詳しく考えてみます。

なんとなくイメージが出来てきました。
では実際にパラメータを入力していきます。

新たにオリジナルメニューを作成します。

ウィンドウ識別子を設定します。

ウィンドウ一覧からウィンドウのパラメータを設定していきます。
こちらはSoundTest_Commandウィンドウのパラメータ設定中の様子です。

ウィンドウの座標・幅・高さ、行数、列数などを調整していき、テストしてみます。

ウィンドウを表示させることは出来ました。
では次に、SoundTest_MusicListウィンドウ（曲目のリスト）をどうやって作成するかを考えてみます。
今回は「あらかじめ決められているリストから再生させる」という前提にします。
任意の曲をリストに追加させる方法は次回に紹介します。

【３】サウンドのリストから曲を再生させるまでやってみる

あらかじめメニューの項目が決められているときは「コマンドリスト」を使います。
既に設定したSoundTest_Commandでもコマンドリストから「決定・停止・戻る」を入力しました。
SoundTest_MusicListのコマンドリストでも次のように入力します。

曲目は８個にしました。実際にプレイしてみます。

レイアウトはほぼイメージ通りになりました。
しかしイベント系を何も入力していないので、ボタンを押しても何も起こりません。

次にイベント系を設定していきます。

【重要！】
「コマンドリスト」をパラメータに設定したときに必要になってくるのは「インデックス番号」です。
今回の場合は「再生」「停止」「戻る」で、それぞれ振る舞いが違うので、ツクール的に表現するならば「ボタンを押したとき、条件分岐をさせる」という感じです。

メニューにはすべて項目の番号、つまり「インデックス」が存在します。カスタムメニュープラグインでは、「インデックス格納変数」というパラメータが存在します。これはゲーム用の変数にインデックス番号を代入してくれます。
ゲーム用の変数に数値を代入してくれるということは、コモンイベントを呼び出したときに条件分岐を使えるということです。これはイベント系の処理でコモンイベントを呼び出すときに重要になってきます。

具体的に説明します。

項目ごとのindexの数値を明記しました。注意しなければならないのは、項目の１番目のindexは1ではなく0だということです。これはスクリプト、というよりはプログラム的な仕様です。

indexの番号については理解できたので、パラメータに変数のIDを設定します。

同じようにSoundTest_MusicListも別の変数IDを設定します。

これでコモンイベント上で変数による条件分岐が可能になりました。

次は決定イベントを設定します。
コモンイベントを次のようにします。

インデックス格納変数に入力した変数IDに格納されるindexから条件分岐をさせています。

カスタムメニュープラグインのヘルプにもありますが、ウィンドウをアクティブにさせる（別のウィンドウにカーソルを移動する）スクリプトコマンドは次の通りになります。

SceneManager.changeWindowFocus('window1');
（ウィンドウ識別子：window1　に移動します）

また、マップ画面に移動するときは次のスクリプトコマンドです。
SceneManager.goto(Scene_Map);

SoundTest_Commandの決定イベントにこのコモンイベントを設定します。

同じようにSoundTest_MusicListのコモンイベントを設定します。

【４】実際に動かしてみる（テスト）

パラメータやコモンイベントの設定が完了したので、実際にテストしてみましょう。
以下の動画のようになりました。

実際の挙動がおかしければここで修正します。
挙動が問題なければ最後のレイアウト修正をすれば完了です。

いかがでしたか？　実際にカスタムメニューを作成する手順を紹介しましたが、最も重要なのは「どんなメニューにするか」ということを明確にイメージしてから作業することです。

今回は簡単なメニュー作成でしたが、複雑になるにつれて変数やスイッチの管理が大変になります。手を付ける前にそれらをリストアップしておくのがスムーズに作業を進められるコツになると思います。

今回のサウンドテストメニューではあらかじめ決められた曲目の場合に適用される内容でした。次回は曲目を自由に増やしたり減らしたり出来る仕様を考えたいと思います。