RPGツクールMVでピクチャをボタン化するプラグインPictureCallCommon.jsの使い方

この記事では、ツクールMVでピクチャをボタン化して「クリックしたとき」「マウスオーバーしたとき」 のようなイベントを呼び出せるようにするPictureCallCommon.jsの使い方を紹介する。

1.プラグインのダウンロード

プロジェクトのjs/pluginsディレクトリに移動して以下のコマンドを実行する。

curl.exe -O https://raw.githubusercontent.com/triacontane/RPGMakerMV/mz_master/PictureCallCommon.js

2.基本的な使い方

まずはイベント編集で、ピクチャを表示して、その後にプラグインコマンドのP_CALL_CEを書いていく。

例えば、以下のように書いていく。

◆ピクチャの表示：#1, game_play, 左上 (400,300), (100%,100%), 255, 通常
◆プラグインコマンド：P_CALL_CE 1 5 4

上記の例ではP_CALL_CE 1 5 4と書いているが、 引数は以下の役割がある。

• 1 ピクチャ番号
• 5 呼び出すコモンイベント。コモンイベント5を実行する
• 4 Triggerとなるイベント。ここではマウスオーバーした時に実行される

Triggerは様々な種類が用意されており、以下のものがある。 (よく使うのは、 1 4 5 あたりかな？)

1  : クリックした場合
2  : 右クリックした場合
3  : 長押しした場合
4  : マウスをピクチャに重ねた場合
5  : マウスをピクチャから放した場合
6  : クリックを解放（リリース）した場合
7  : クリックした場合（かつ長押しの際の繰り返しを考慮）
8  : クリックしている間ずっと
9  : ホイールクリックした場合（PCの場合のみ有効）
10 : ダブルクリックした場合
11 : マウスをピクチャ内で移動した場合
12 : マウスを押しつつピクチャ内で移動した場合

2.実践例：マウスオーバーした時に画像を切り替える

実践例として、マウスオーバー（ピクチャにカーソルを合わせた時）した時にボタンの色を変える という処理を実装していく。

ここでは、game_play.pngとgame_play_focus.pngの２種類の画像を用意したとする。

まずは適当なマップにイベントを作成する。 このイベントの1ページ目を「自動実行」にしたうえでイベントを以下のように記述する。

◆ピクチャの表示：#2, game_play_focus, 左上 (0,0), (100%,100%), 0, 通常
◆ピクチャの表示：#1, game_play, 左上 (400,300), (100%,100%), 255, 通常
◆セルフスイッチの操作：A = ON

２ページ目を作成し、セルフスイッチ Aを条件に設定し、「並列処理」に設定する。 イベントを以下のように記述する

◆プラグインコマンド：P_CALL_CE 1 2 4
◆プラグインコマンド：P_CALL_CE 2 3 5

そしてコモンイベント２を設定する

◆ピクチャの移動：#1, 左上 (0,0), (100%,100%), 0, 通常, 1フレーム
◆ピクチャの移動：#2, 左上 (400,300), (100%,100%), 255, 通常, 1フレーム

コモンイベント３を以下のように設定する

◆ピクチャの移動：#1, 左上 (400,300), (100%,100%), 255, 通常, 1フレーム
◆ピクチャの移動：#2, 左上 (400,300), (100%,100%), 0, 通常, 1フレーム

これにより、マウスのカーソルを画像に合わせたときに画像が切り替わり、カーソルを外した時に 元の画像に戻るという処理ができる。