アイストマトバズーカのゲーム制作日記

いろいろ超初心者がゲーム制作に挑戦。現在RPGツクールMZでフリーゲーム制作中。フリー素材も作って置いてます。

知識ゼロの初心者がプラグイン開発やってみる(`・д・´)ノ【RPGツクールMZ】

こんにちは。ITBです。

 

RPGツクールMZが発売されて半年経ち、プラグインも次々とすごいものが開発されています。RPGツクールシリーズの最新作であるが故にプラグインの少なさがMZの弱点であったわけですが、徐々にそのデメリットもなくなってきており、前作のMVに並ぶ程充実するのもそう遠くないでしょうね。開発者さんはホントにすごいです(o´▽`)

 

プラグイン開発者さんたちのおかげでJavaScriptの知識が無くても皆が思い通りのゲームを簡単に作れるようになるわけですが、作ってみたいという人も多いんじゃないかと思います。ちょっとしたものなら開発を待つより自分で作ってしまったほうが早いですからね(たぶん)。

 

でも初心者には敷居が高いんですよね(;´・Д・) 私にとっては”神の領域”的なイメージですw

公式の初心者講座にプラグイン開発の項目があるので読んでみたのですがまぁやっぱり難解です(私が頭悪いだけかもしれませんがw)。

 

難しい話はナシでとりあえずの作り方だけ知りたいって人いませんか?

 

私と同じですm9(^Д^)

 

甘い考えですか? でもやっちゃいましょう( *´艸`)

但し紹介するのはJavaScript完全無知の超初心者がテキトーにやってみた方法ですのでいろいろ間違ってたりする可能性が高いです。参考にする場合は自己責任でお願いしますね。「っぽい」とか「たぶん」とか「思う」を多用しますので予めご了承ください。

 

作るのはタイマーの表示位置を変えるプラグイン。RPGツクールMZのタイマーは通常設定では開始時の時間とON/OFFしか操作できず、表示位置は画面中央上で固定です。これを座標指定して任意の場所に表示できるようにします。

ちなみにそういう(というかもっとすごい)プラグインは既に開発されており、検索したら出てきます。

 

では行ってみましょう(`・д・´)ノ

 

まずはプロジェクトフォルダのjsフォルダ内.jsファイルからタイマーに関する場所を探します。

初心者にはこの”探す”という作業が一番大変かも(;^_^A

もっといい方法があるのかなぁ。とりあえず進めますね。

公式のスクリプトリファレンスでタイマー関連の関数を見てみます。

f:id:icedtomatobazooka:20210227114228j:plain

”ゲームデータ”にありますね。これらが使われている場所をjsフォルダにある.jsファイルから(テキストエディタで開いて)探すのです。

f:id:icedtomatobazooka:20210227114922j:plain

それぞれのファイルの役割を理解していないのでしらみ潰しですw

rmmz_sprites.jsファイルの中にそれっぽい場所がありました。

 

f:id:icedtomatobazooka:20210227142038j:plain

Sprite_Timer.prototype.updatePosition というのがタイマー位置を指定しているコードっぽいですよね。

これをみると時間が表示される場所のX座標を"x”、Y座標を"y” という変数に格納していることが読み取れます。たぶんX座標は画面中央、Y座標は100で固定ってことでしょうね。

 

ここを再定義してやればいいわけです。

 

作っていきます。

まず先にファイルだけ作成して追加プラグイン用フォルダに保存しちゃいます。もともとある.jsファイルをコピーして中身を空白にするなり、テキストファイルを作成して拡張子を.jsに変えるなりして何も書いていない.jsファイルを作成し、プロジェクトフォルダ→js→pluginsフォルダへ保存。名前を"timerposition"とでもしておきます。

 

プラグインを有効化し、プロジェクトをテストプレーしてゲーム画面を開き、F8キーでデベロッパツールを立ち上げます。

f:id:icedtomatobazooka:20210227143112j:plain


”Sorces”から当該ファイルを選択します。

画面真ん中にテキスト欄が出るのでここに記述していきます。

 

公式の初心者講座にあるとおり、下の記述をコピペします。

f:id:icedtomatobazooka:20210227111616j:plain

こう↓

 

/*:
* @target MZ
* ....
*/

(() => {
'use strict';
// do something })();

 

プラグイン作成はとりあえずこれをコピペしてから始めると思っておきます。

作成するプラグインはパラメータにX座標とY座標を入力してその位置に時間を表示させる、というものにしたいのでパラメータ部分を書きます。

....”のところです。

/*:
* @target MZ
* @param paraX
* @text x座標
* @type number
* @desc タイマーを表示するx座標
* @param paraY
* @text y座標
* @type number
* @desc タイマーを表示するy座標
*/

(() => {
'use strict';
// do something })();

 

このへんは既存のプラグインを参考にしました。

@param の後が任意の変数名

@text の後はパラメータ名(プラグイン設定画面に表示させるもの)

@type の後は入力形式

@desc パラメータの説明(プラグイン設定画面に表示させるもの)

 だと思います。

 

次に"//do something"の位置に再定義の部分を書きます。

/*:
* @target MZ
* @param paraX
* @text x座標
* @type number
* @desc タイマーを表示するx座標
* @param paraY
* @text y座標
* @type number
* @desc タイマーを表示するx座標
*/
(() => {
'use strict';
const pluginName = document.currentScript.src.split("/").pop().replace(/\.js$/, "");
const parameters = PluginManager.parameters(pluginName);
const newX = parameters['paraX'];
const newY = parameters['paraY'];
Sprite_Timer.prototype.updatePosition = function () {
this.x = newX;
this.y = newY;
};

})();

こうなります。const~ の部分は変数の宣言。このワードを変数として使いますよとあらかじめ決めておくものです。で、= 以降の記述で初期値を入れている形です。

最初の2行、pluginName と parameters の2つはパラメータを使うプラグインに必須となる(と思う)ので形式的に入れてしまって良いです。名前変えてもいいけど調べた感じだと皆これでやってるんじゃないでしょうか。

続くnewXとnewYの宣言はパラメータの座標を格納してます。

Sprite_Timer~の部分で再定義。最初に探したrmmz_sprites.jsファイル内の記述と同じになります。

この中でxに newX(パラメータのX座標)を、yに newY(パラメータのY座標)を格納します。

 

右クリック→Save as… で上書き保存したら完成です。

 

プラグイン設定画面を開いてみます。

 

f:id:icedtomatobazooka:20210227143955j:plain

こんな感じになってますでしょうか。適当にパラメータに100ずつ入れてみます。

 

タイマーを作動させるイベントを作ってテストプレーで実行してみる。

f:id:icedtomatobazooka:20210227144922j:plain

できてるっぽいですね。やった(´∀`)ノ

 

今回なぜタイマー位置の変更をやってみたかといいますと、制作中ゲームで必要になったからです。

 

まぁでも、

他の開発者さんのプラグイン使います。

信頼度が違う。

 

 

 

f:id:icedtomatobazooka:20210227152410j:plain

 

 

 

ランキング参加中です。下のバナーをクリックして頂けるとやる気値が増幅します!!

f:id:icedtomatobazooka:20201229184218j:plainにほんブログ村 ゲームブログ ゲーム制作へ