【MV講座】画像をスクロールさせてみる

前回分でようやく、デフォルトと同じような感じで画像が表示できるようになりましたね。
今回はこれをスクロールさせてみたいと思います。

TilingSpriteクラスの本領発揮、前準備

TilingSpriteクラスを使って画像を表示させたのはいいけど、これってSpriteクラスより色々と面倒になっただけじゃないの?
と思った方もいるかもしれません。
たしかに、ただ画像を表示させるだけならTilingSpriteクラスを使わず、Spriteクラスを用いたほうがいいと思います(TilingSpriteクラスの方が若干重いと思いますし)。
ですが、ことスクロールという観点で言えば、Spriteクラスでどうこうするよりも、TilingSpriteクラスを用いた方が絶対にラクチンなのです!
では早速スクロールさせてみましょう。

まずは以下のコードをテンプレートの中に追加してください。

var _Scene_Title_update = Scene_Title.prototype.update;
Scene_Title.prototype.update = function() {
_Scene_Title_update.call(this);
this._backSprite1.origin.x += 1;
this._backSprite1.origin.y += 1;
};

一行ずつ解説します。

var _Scene_Title_update = Scene_Title.prototype.update;

これは、Scene_Titleクラスのupdateメソッドの内容を保存するための変数を宣言しています。
このupdateメソッドの内容を保存したものをScene_Titleクラスのupdateメソッドで呼ぶ(3行目)ことによって、それまでupdateメソッド内でやっていた処理がそのまま実行されるのですね。

なんやらよくわからんという場合は、「このコードがなければ、もともとあったupdateの内容が実行されず、ゲームが正常に実行されなくなる」といった程度に思っていただければ当たらずといえども遠からずです。

createBackground()にちょっと戻って考えてみる

あれ? でもcreateBackground()では元の内容を実行させるなんてことしてなくね?」と思った方、鋭いです。
createBackground()は直接上書きしてしまっているので、もしも他のプラグインがcreateBackground()に何か追加していた場合でかつ、現在制作中のプラグインがそのプラグインよりも後ろに(プラグインリストの下の方)に追加されていた場合、他のプラグインが追加したcreateBackground()の機能は全て消されてしまいます
これがいわゆる「競合」と呼ばれている現象の一つです。
プラグインで意図した動作が消されてしまっているので、そのプラグインがうまく動かなくなってしまうのですね。
ですので、なるべく上書きしないようプログラムを組む方がよいです。

注*上書きしなかった場合でも、競合が発生する場合はもちろんあります。

今回は簡略化のために、このまま行きましょう。

originを利用する

さて4行目です。

this._backSprite1.origin.x += 1;

これがまさにスクロールさせているコードとなります。
5行目の

this._backSprite1.origin.y += 1;

もそうです。

「originって何やねん」ということですが、これはも百聞は一見にしかずでしょう。
動作確認してみてください。
画像がスクロールしているのがわかると思います。
その後、この1という数値を-1やら10やらに変えて動作を確認してください。
何を意味するのかわかると思います。
また、originを除けて

this._backSprite1.x += 1;

などというコードもついでに試して見ください。
これがSpriteでの座標の移動に相当します。
違いを確認しておきましょう。
一回目のときに言っていた、「画面が黒くなってブサイク」ということの意味がわかると思います。
このoriginは通常のSpriteクラスにはないため、通常のSpriteクラスでスクロールさせるなら、この画面が黒くなる部分をなんとかする処理を自分で組み込まなければなりません
そんなの面倒ですよね。
だからスクロールさせるならTilingSpriteクラスを使ったほうがラクチンなのです。
難しい処理を考えずとも、ぜーんぶツクール側が肩代わりしてくれるのです。
これは素晴らしい!

スクロールは完成。しかし……

はい、スクロール機能が完成しましたね。
this._backSprite2も同じようにすれば、目的のプログラムが完成します(パーティクルはまだですけど)。
数字の1の部分を好みの設定に変えれば、スクロール速度も変えられます。
自分で使うだけならこれで十分です。
ですが……。
なんか、プラグインっぽくないですよね。
配布されているプラグインって、もっとプラグインコマンドとか使ってますよね。

次回はコードの改善およびプラグインっぽくする方法について解説します。

フォローする