自動装飾プラグインでのマップオブジェクトの操作
クラファン駆動で開発中の「マップ自動装飾プラグイン」の解説記事です。
本記事の内容を実行するには、「マップ自動装飾プラグイン」に加えて拡張用の「マップオブジェクトプラグイン」が必要です。
また、まだスタートアップ記事を読んでいない場合は先にそちらの内容に挑戦してみてください!
本記事内容は、テンプレートマップへのオブジェクト登録や自動装飾エディタの基本的な使い方については解説を省いております。
Ver1.14にてマップオブジェクトプラグインを使用したオブジェクト表示が以下のパラメータに対応しました。
(詳しい設定方法はTRP_MapObject.jsプラグインのヘルプを参照。イベントを使ったオブジェクトの表示設定はマップオブジェクトプラグインのみでも動作○)
- 角度の設定
- 不透明度の設定
- 反転(ミラー)表示設定
- ブレンドモードの設定
- ティント(色合い)の設定
それに合わせ、「マップ自動装飾プラグイン」のオブジェクトの手動配置モードにおいて、「マップオブジェクトプラグイン」を使用したオブジェクト表示の細かな調整ができるようになりました!
多岐にわたる機能が追加されたので、森マップに「木をドット単位で配置」し「影と光で装飾」していく作業を例に機能の解説をしていきます。
マップオブジェクト形式で木を配置
自動装飾プラグインのオブジェクト抽選モードでオブジェクトを配置すると、全てマス目単位で配置されます。
この時、テンプレートに「タイル形式」で登録したものはタイルとして配置され、「マップオブジェクト(以下、マップオブジェ)」形式で登録したものはマップオブジェとして配置されます。
(↓左がイベントを使った「マップオブジェ形式」、右が通常の「タイル形式」でのオブジェクト登録)
オブジェクトの手動配置
まずは従来機能の復習から!
オブジェクトはランダムな抽選配置のほかに手動で配置することもできます。
配置されたオブジェクト上で「Ctrl+左クリック」を押すと、そのオブジェクトのコピーを配置する「手動配置モード」に入ります。
適当な場所をクリックすることで、好きな場所に配置することができます!
さて、次に「Shiftキー」を押しながらマップ上をクリックしてみましょう。
今度はマップ上に「ドット単位」で配置されます。
このとき、「タイル形式」で登録されたオブジェクトも自動で「マップオブジェクト形式」に変換されます!
Shiftキーを押しながら木を好きなだけ配置してみましょう!
座標のドラッグ移動調整
Shiftキーを押しながら左クリックでオブジェクトを配置できますが、このときマウス左ボタンを押しっぱなしにすることでドラッグしながら配置位置を調整できます。
さらに一度配置したオブジェクトの位置を調整したい場合には、オブジェクト上でShiftキーではなくCtrlキーを押しながら左ボタンでドラッグすることで移動させることができます!
オブジェクト選択のタッチ判定
スポイト中のオブジェクトを消去するときもですが、対象のオブジェクトをうまく選択できないときは、オブジェクトのアンカー位置(デフォルトではX=0.5,Y=1でちょうど木の幹の根本の中心)に近い部分をクリック・ドラッグしましょう。
パラメータの調整
Shiftキーを押しながらマップオブジェクト形式で配置した直後に、キーを追加入力することで角度・拡大率・不透明度などの各種パラメータの設定が可能です。
いろいろと試してみましょう。
- Shift+左右キー:回転
- Shift+上下キー:拡大
- Alt(MacはOpt)+左右キー:X方向の拡大
- Alt(MacはOpt)+上下キー:Y方向の拡大
- Mキー:左右の反転(ミラー)
- Q/Wキー:不透明度の反転
また、不透明度は数字キーでも設定が可能です。
- 1:10%
- 2:20%
︙ - 9:90%
- 0:100%
……木を回転させたり半透明にする必要はないので、いったん元に戻しましょう。
「Rキー」でパラメータをリセットできます。
ティント(色合い)の調整
さて、ここでは「Tキー」を押してティント(色合い)を調整してみます。
Tキーを押すと、左上にカラーパレットが表示されるので、好きな色を選べばOK。
注意点として、ここでのティントは「デフォルトの状態がRGB=255,255,255の最も明るい状態(=白)」でここから赤・緑・青の色を抜くことで色合いの変更が可能です。
たとえば、赤を選んだときはRGB=255,0,0となり、緑と青の色味が抜かれて赤くなると同時に暗くなります。
ティントのランダム設定
ティントを細かく設定するのが面倒なときは、「0~9の数字キー」を使用してランダムに設定することができます。
デフォルトの状態(RGB=255,255,255)を基準として、「1キー」を押すと10%の範囲でランダムに変化(各数値は255 x 90%~100%の間で変化)し、「2キー」を押すと20%…と変化幅が大きくなります。(「0キー」は5%で最小の変化幅)
さらに、「Shiftキー+0~9キー」を押すことで、配置している同種のオブジェクトすべてのティントをランダム抽選することができます。
木などの自然物の色味を微妙にずらしたい場合に便利なのでご活用ください!
影・太陽光の配置
続いて、装飾として影・太陽光のキャラ画像を配置してみましょう!
プリセット画像として「MapObjects/materials/img/characters」フォルダ内に画像を用意しているのでお試しにご利用ください。
(※毎度ながらのなんちゃってクオリティなので、ちゃんとした素材サイトのものや自作推奨です…!)
さて、テンプレートにマップオブジェ形式で登録したいところですが、これらの画像はランダム配置でなく1つ1つ調整しつつ配置したいところです。
オブジェクトパレットに登録して、パレットから画像を選択して手動配置してみましょう!
オブジェクトパレットの登録
テンプレートマップ上でイベント画像「オブジェパレット設定」を配置すると、そのすぐ右が1マスサイズのオブジェクト、1マスあけて2マス以上のサイズのオブジェクトの登録スペースとなります。
影画像(leaf1_PIC.png)は
- メモ欄に<anchorY:0.5>として変形の中心を画像中心にセット
- プライオリティは「通常キャラの下」
太陽光画像(lightRay1_PIC.png)は
- メモ欄に<blend:4>としてブレンド(合成)モードをオーバーレイ
- プライオリティは「通常キャラの上」
に設定しています。
ブレンドモードについては後述します。先にパレット機能を使ってみましょう。
1枚絵形式のキャラ画像
画像名の最後に「_PIC」 をつけると、マップオブジェ表示時にパターン・方向を持たない1枚絵形式で表示されます。
不要な余白を減らして使用メモリを節約しましょう。
オブジェクトパレットの呼び出し
オブジェクト抽選モード、またはオブジェクトの手動配置モードで「Ctrl+右クリック」で登録したパレットを呼び出せます。
(※ブザー音がなりパレットが表示されない場合は、パレット登録が失敗していると思われます。上の項を参考に、テンプレートマップへのオブジェクト登録が正しい箇所で行われているか、また、マップオブジェクトプラグインがちゃんとONになってるかご確認ください)
パレットには登録されたオブジェクトが順に並んでいるので、左クリックで選んでからマップ上をクリックして配置しましょう。
共有パレットの登録
先ほどテンプレートマップ内でパレットを登録しましたが、共有パレットに登録することも可能です。
共有パレットに登録したオブジェクトは、(森や洞窟などの)テンプレートマップによらず呼び出すことが可能です。
適当なマップを作成してイベント画像「オブジェパレット設定」を配置し、また同じように右側にオブジェクトを配置して登録します。
(↓のようにタイル画像をオブジェクトに登録してもマップのタイルセットによって表示が崩れるので、共有パレットはイベント画像用に使用してください。)
つぎに「TRP_MapDecorator_Template.js」プラグインのプラグイン設定を開き、「共有パレットマップID」の項目にいま作成したマップのIDを登録すればOKです。
影の配置
「Ctrl+右クリック」でパレットを呼び出して「影画像」を選び配置していきます。
……特に解説することは無いので、今まで紹介した機能を試してみましょう!
- Shift+上下で拡大
- Shift+左右で回転
大きさと角度を決めたら、「Ctrlキー」を押しながらドラッグして位置を微調整。
不透明度の設定
また、少し影が濃いので不透明度も調整すると良いでしょう。
Q/Wキーで+ーの調整が可能ですが、数字キーで設定するのが楽です。
ここでは「7キー」を押して70%に設定しています。
反転設定
この要領で影をいくつか配置してみましょう。
影画像はプリセットで3種用意してますが、同じ画像を配置する場合も「Mキー」で反転させてみてもバリエーションとして使えるでしょう。
太陽光の配置
続いて「Ctrl+右クリック」でパレットを呼び出し、太陽光を選んで配置してみましょう。
……ただし、このまま配置してもツクールMZでは綺麗に表示されません。
ブレンドモード「オーバーレイ(4)」が正しく表示されないためです。
ブレンドモード「オーバーレイ」の対応
※1/20追記:MZではブレンドモード:オーバーレイでの描画負荷がかなり高く、スマホ向けや低スペックPCではFPSを落とす原因となります。対応方法について記事にまとめましたのでご利用の方はご一読お願いします。
ブレンドモードの0~3(0:通常、1:加算、2:乗算、3:スクリーン)はデフォルトで表示可能ですが、オーバーレイ(4)には「pixi-picture.js」というPIXI.jsの拡張ライブラリが必要です。
RPGツクールMVはデフォルトで「pixi-picture.js」が導入されていますが、ツクールMZではそのままでは使えません。
ツクールMZでオーバーレイモードを使用するには
- コアスクリプトv1.6.0以降であり
- かつ、pixi-picture.jsの導入
が必要です。
(※コアスクリプトv1.6.0ではpixi.jsがv5.3.12にアップデートされており、pixi-picture.jsの導入にはpixi.jsのv5.3以降が必要となります。)
コアスクリプトをv1.6.0以降にアップデートした上で、プラグイン化したライブラリ「pixi-picture_for_MZ_160.js」が「MapObject/materials/plugins」フォルダ内にあるので、プロジェクトに導入しましょう。(プラグイン設定のなるべく上側に配置)
これでオーバーレイモードで表示されるはずです!
ただし、オーバーレイモードは他のブレンドモードと比べて負荷が高めです。
多用する際には想定動作スペックでのテストを行うと良いでしょう。
パラメータ調整
さて、太陽光を配置していきましょう。
パレットから筋1つのものを選んで配置します。
(後で移動させるのは若干面倒なので、ある程度完成像をイメージして配置しましょう)
Shift+左キーで角度を調整し、
Alt(MacはAlt)+左右キーで太さを調整し、
Alt(MacはAlt)+上キーで上方向の高さを調整しましょう。
「Cキー」を押すと現在の状態のオブジェクトをスポイトし、左クリックでそのまま配置することができます。
太さを変えたり、「0~9キー」で不透明度を変更していい感じに束ねましょう。
画像バリエーション
プリセット画像に、いくつか光を束ねた画像も用意しています。
1つずつ配置するのは手間なので、これらを使って時短してもよいでしょう。
ただし、角度をつけると下端も傾いてしまいます。
使用する角度のパターンが決まってる場合は、画像編集ソフトを使って束ねた画像を自分で用意するのも良いでしょう。(マップオブジェの数を減らせばオーバーレイの使用数も減って負荷も減る…はずです!)
以上が、自動装飾プラグインの「手動配置モード」で「マップオブジェクト」を細かく調整配置する方法となります。
操作がかなり細かいですが、ガイドにも操作方法を表示されているので徐々に慣れていってくださいませ!