【ウディタ】マップ上にアニメーションするオブジェクトを配置しよう！

ヘビトンボです～！
今回はウディタ(WOLF RPGエディター)のシステム周りに関する記事です✨

マップ上にピクチャとしてアニメーションを行うオブジェクトを配置する私なりの方法をまとめてみようと思い立ったので、記事としてご紹介させていただこうと思います！

マップオブジェクトの座標とピクチャ座標の結び付けについて解説いたしますよ(=ﾟωﾟ)ﾉシ

まずはマップ上に配置してみる

今回はこの私が描いた「風車の羽根」の画像をマップ上に表示してみようと思います～

まず最初に、マップ上にアニメーションを表示する用のイベントを配置します！
風車の羽根なので、下画像に写っている小屋の壁面にしましょう！

このイベントの中心位置を表示するアニメーションの中心位置とします。
X座標とY座標を取得しましょう！

イベントを開き【変数操作+】から、
【このイベントのSelf:0,=,このイベントの,X座標(標準)】を選択し適用します。

同様に【変数操作+】から、
【このイベントのSelf:1,=,このイベントの,Y座標(標準)】を選択し適用します。

そしてここでひとつ、
ピクチャの表示で使用する座標情報は、ピクセル単位で指定しなくてはなりません！！
しかしながら先ほどの「X(Y)座標(標準)」というコマンドは主人公の1移動分を1とした値で返ってくるのです。
ウディタの1マスは標準設定だと16ピクセルなので(16x16での設定を前提に説明させていただきます💦)、与えられた値を16倍してピクセル単位に合わせましょう！

そしてさらにもうひとつ！
先ほど申し上げました通り、このイベントの中心位置の座標が必要なので、1マスの値である16の半分の8の値だけズラして表示する必要があるのです。
よってSelf0,Self1共に8を加算しましょう。

アニメーションの表示

では、設定した座標にピクチャを表示しましょう✨
その前にマップチップやマップイベントとピクチャ番号の関係について軽くご説明いたしますね！

ウディタにおけるレイヤの階層分けは、

～
［ピクチャ 100000番以上］
［文章・ウィンドウ・選択肢］
［ピクチャ 0番～99999番］
［フォグ画像］
［マップチップ(常にキャラの上に表示)］
［マップイベント・キャラ等］
［ピクチャ -1番～-99999番］
［マップチップ１～３］
［ピクチャ -100000番以下］
［遠景画像］
～

の順に上から重ねて表示されます。
ご自身が表示したい階層に合わせて、ピクチャ番号を設定してください！

【ピクチャ】の項目から、今回はピクチャ番号-1番を指定し、車の羽根の画像を設定。
横を3、縦を1、
表示位置を【中心】とし、【スクロールとリンク】の項目にチェックを入れます。
そして、座標には先ほど設定したセルフ変数の呼び出し値である【X:1100000】、【Y:1100001】を設定しましょう！

次に実際に画像をアニメーションさせるコマンドを入力します！

【エフェクト】の項目から、【ピクチャ】を選択し、
させたいアニメーションを設定しましょう！
今回は自動パターン切替(ループ)を選択し、3枚のアニメーションなので、開始1、終了3、間隔10フレームを設定します。

アニメーションの起動イベントを作成

それでは早速動作を確認しましょう～！！
アニメーションを表示するイベントは一度だけ実行されればよいので、マップに別途アニメーションイベントを起動するためのイベントを作成します。

マップ処理終了用のフラグ用変数を1にするイベントを作り、
起動条件を【並列実行】、先ほどのマップ処理終了用のフラグが0のときのみ、更新するように設定します。
場所はマップの一番左上の端っこなどが好ましいですね！

同様に先ほど作成したアニメーション表示用のイベントの起動条件も同じように設定します。

これで確認できる状態になりました！✨

プレイヤーとの位置関係を反映させる

しかしながらこれでは問題があります！
現在設定した座標情報は、あくまでマップ全体から見たときの座標情報なのです！
つまり、マップの一番左上を基点とした情報というわけですね。

対して、ピクチャ表示コマンドによって指定する座標は、ゲームウィンドウの左上を基点とした情報なのです！！

(↓)X=20マスのところからマップに移動すると、

(↓)主人公がマップ左上からずれている分だけピクチャがずれてしまう！涙

これを解消するには、ピクチャを表示する座標を現在のウィンドウの左上を基点とするようにずらしてあげればよいです！

ではどうするかといいますと、
ウィンドウの左上の座標を直接取得することはできないので、主人公のマップ座標と同じくウィンドウ座標を利用しましょう！

イベントを開き【変数操作+】から、
【このイベントのSelf:2,=,主人公の,X座標(標準)】を選択します。

同様に【変数操作+】から、
【このイベントのSelf:3,=,主人公の,Y座標(標準)】を選択します。

そしてSelf:0からSelf:2,Self:1からSelf:3をそれぞれ減算しましょう！
あ、先ほど申し上げた通り「X(Y)座標(標準)」というコマンドは主人公の1移動分を1とした値で返ってくるので、一連のコマンドはSelf:0とSelf:1を16倍する前に入れてくださいね！
ここで上の図の黄色←の移動を行いました。

続いて青→だけ移動させるコマンドを入力します。

イベントを開き【変数操作+】から、
【このイベントのSelf:4,=,主人公の,画面X座標】を選択し適用します。

同様に【変数操作+】から、
【このイベントのSelf:5,=,主人公の,画面Y座標】を選択し適用します。

そしてSelf:0にSelf:4,Self:1にSelf:5をそれぞれ加算しましょう！
「画面X(Y)座標」は先ほどの「X(Y)座標(標準)」と異なり、ウィンドウ上のプレイヤーの座標がピクセル単位で渡されますよ！

ここまでできたらもう一息！！(記事を書いている私も苦笑)
Self0,Self1共に8を加算する処理を一旦消して、Self1にのみ8を減算する処理に書き換えます。

これはどうしてかといいますと、ウディタのウィンドウ上のマス辺りの横縦の比が20:15になっているためです。
キャラクターは中央に配置されるので、横に表示されるのが中央1マス+左右に9.5マスというふうに分かれているのです。
横だけ画面端のオブジェクトが見切れている状態ですね、なので自動的に8ピクセルずれた状態になっています。
一方縦は中央1マス+上下に7マスというふうにわかれているので8ピクセルずらす処理が必要、というわけですね！

これでようやく完成です！✨

複製して確認してみる

試しに複製してピクチャ番号のみを差し替えた状態で動作するか確認いたします✨

いかがだったでしょうか？
マップオブジェクトにアニメーションを取り入れれば、マップがより一層映えること間違いなしです( *´艸｀)♡

私のこういうシステム的な技術の紹介に需要があるのかは永遠の謎ですが、また気が向いたときに記事書いてみますね！
でわ～🐝