【超初心者向け_Javaスクリプト講座】ツクールMV/Part②X座標Y座標&画面サイズ編

※本記事はヨ空がツクールMVの制作などで得たJava(Javaスクリプト)
Javaを Javaスクリプト未経験でもわかりやすく解説する…という内容の記事です
(慣れている方や中級者/上級者の方には物足りない内容かと思います)

■こんな方向けです(Part②)

当方もスクリプトを追求中ですが
前回に続きまして、Part②は、こんな方向けです
・「ウインドウの位置とか表示する場所って、どうやって変えるの？」
・「ウインドウのサイズって変えれるの？」
・「自分流のかっこいいゲーム画面/もしくはシステム実装したいぜ！」(後々)
(X座標やY座標、画面サイズ関連についての話になります…！)
おそらく、同じJavaなのでツクールMZにも応用可能？かもしれません…

■URLリンク用

【超初心者向け_Javaスクリプト講座】
Part③→URLは後日更新…予定
(プラグインの作り方、プラグイン作成のコツ等を解説予定)

Part①(前回) (javaスクリプト初見、プラグイン初見の方向けの解説)
【超初心者向け_Javaスクリプト講座】ツクールMV/Part①コアスクリプト&クラス編
(本命の制作作業が疎かにならない程度に更新させていただきます…！)

■まずX座標とY座標について

前回、コアスクリプト とクラス についてお話したと思います

例えばの話ですが、例えば
ゲームのUI(見た目や配置)等を改変したいとします

その場合は主にウインドウ(rpg_windows) やシーン(rpg_scenes) を
元に改変するんですが

皆様はX座標、Y座標…XやY をご存じでしょうか？
座標(ざひょう:読み) なんですが、X座標、Y座標…XY

どこぞのバージョン違いとか、どこぞの特殊進化とかは関係無いです…
染色体系の話では無いんですが…
とどのつまり、座標(位置とか場所、縦横)の話なんですが

位置情報で戦うSLGのゲームとかをしていた人は、わかりやすいかと思います
3D系のモデリングツール とかを触ってた人も、わかり味が深いと思います

縦横の話 になるんですが、横→縦 の順に話させていただきまして

X座標が横の座標
Y座標が縦の座標
という感じでして、色は特に関係無いんですが
(XとYは別物で横と縦…！という認識でOKです)
こんなイメージです

具体的な例なんですが
後々、画面サイズについて説明しますが
ゲーム画面には元々のサイズ があるじゃないですか
さっきのコレをイメージしてください

■画面サイズについて

画面サイズについて説明したいと思います
据え置き機、家庭機やPC等 のテレビ画面やモニター画面 に表示される
画面の最大のサイズ なんですが
(カメラ用語で画角(がかく) とも言うらしいです)
このテレビ画面やモニター画面のゲーム画面の最大サイズ…
正式名称はCanvas(キャンバス)サイズ
キャンバスサイズ という名称らしいです
(ゲーム画面側の方のサイズ でも伝われば良いんじゃないんでしょうかね…)
キャンバスって油絵の絵画とかの紙の代わりの布なんですけど
ストレッチャー(絵画用の四角いの枠とか下敷きの板)とか
イーゼルスタンド(絵画用の固定台)をキャンバスって思ってる人も多そうな…

話戻って、画面の最大サイズもそうなんですが
プラグインを作る上でも覚えておいて欲しいんですが
ゲーム側のウインドウ、コマンドウインドウやステータスウインドウ

このゲーム側のウインドウ
コマンドウインドウやステータスウインドウの横幅のサイズと縦幅のサイズ
(※コマンドウインドウとステータスウインドウの見本イメージです)

横幅もあれば縦幅もありまして
Height(ハイト) です！一応、ヘイト(Hate:嫌悪)ではないです
Heightはウインドウの高さ、縦幅のサイズを表すコードです

■画面サイズのコードなど

※例のコードですが

Window_MenuCommand.prototype.windowWidth = function() {
	return 240;
};

メニューコマンドウインドウの横幅サイズが240…になる！ という内容なんですけど
コアスクリプト(rpg_windows) のコードなんですが
メニューコマンドのWidth、横幅は上記のコードでサイズが240 になっているのに
縦幅…、Heightの方は見当たらない…(はずです)
ウインドウである以上、Heightも必ず設定する必要があるんですが
どうやって決めているの…？と言いますと

実はこれ、MenuCommandのクラスで作ってはおらず…
ベースのCommandの方のクラスを流用してHeightを作ってるんですよ

MenuCommand側では

Window_MenuCommand.prototype.numVisibleRows = function() {
	return this.maxItems();
};

WindowHeightとかは書かれておらず…
numVisibleRows と書かれていますね
(ナムビジブルロウズ)と読みます
・num(ナム、ヌムとも) はnumber(ナンバー)の略で
　プログラム界で多々使われている略語の様な物と思ってもらってOKです
・Visible(ビジブル) は見えているという意味合いです
　透明とか見えない意味で使われるInvisible(インビジブル)を知ってると
　多分わかりみが深いと思います
・Rows(ロウズ、ロウスとも) は縦列の意味合いで
　プログラム界で使われている用語みたいな認識でOKです

とどのつまり、numVisibleRows は見えている縦列の数 …という意味でして
メニューコマンドのコマンドの数…を使うという感じで書かれています
this.maxItems(); はアイテムの最大数…
コマンドの最大数…を使うよ！という意味で
max(マックス) は最大、Item(アイテム) は
ざっくり説明ですが、小道具とかの意味合いで
アイテムだと知っていると理解しやすいと思います

■これの、引用しているCommand側のコードなんですが

Window_Command.prototype.windowHeight = function() {
	return this.fittingHeight(this.numVisibleRows());
};

コマンド(Command)側のWindowHeight なんですが
this.fittingHeight(this.numVisibleRows()); と書かれてますね
this.numVisibleRows() は先ほどの物と同じと考えてください

fitting はフィッティング(調整する)という意味合いなんですが
調整というよりは、ピッタリ合う！ピッタリ合わせる！
という意味合いで使われてる気がしますこれ

たぶんフィット(fit)の(サイズが合う、適合する)意味合いの方が近いかも

■これはメニューコマンド側のコードなんですが

Window_MenuCommand.prototype.initialize = function(x, y) {
	Window_Command.prototype.initialize.call(this, x, y);
	this.selectLast();
};

rpg_windows(コアスクリプト)の先ほどのMenuCommandのコードです
rpg_windowsのクラスのコードはこのinitialize のコードから書かれてまして…
initialize(イニシャライズ) は初期化という意味合いらしく
rpg_windows でかなり使われてます
(ここがウィンドウの表示の核みたいな物という認識でOKです)

Window_Command.prototype.initialize.call(this, x, y); の表記で
thisは省略してこのウインドウという表記で…
x, yという表記 にお気づきになられましたか？　
割愛しますが、先ほどの説明通りのX座標とY座標の表記で
xとｙが0の表記で、この場合は一番右で一番上…
つまり右上にメニューコマンドのウインドウが来る ように書かれてます

上記のこれ、Commandのイニシャライズの設定をcall(コール)して
呼び出す形で引用しているんですよ…　
改変、改造しようとしているウインドウが、どのウインドウをベースにしているか…？
とかもプラグイン制作で役立つ場合が多々ありますので知っておくと便利です

this.selectLast(); は
最後に選択した列のコマンドにカーソルを合わせるコードです
(this.selectLast();は今回は重要ではないので、話のついで程度と思ってください)

このinitializeを使ってMenuCommandはCommandを引用していて
コマンド側 は、見えている縦列の数にピッタリ合わせる
メニューコマンド側 は、コマンドの全部の数 を指定
メニューコマンド側のWindowHeightは
コマンドの全部の数にピッタリ合わせた縦幅…という高さの縦幅サイズに
なりますよ…！という話でした

■メニュー画面用の簡易プラグイン

これでメニューコマンドのウインドウの座標(X,Y) と
主なウインドウの画面サイズ(Width、Height) は教えられたと思います

ついでにメニュー画面を改造できるプラグインです

内容はこんな感じで

このプラグインはメニュー画面の　
メニューコマンド
メニューステータス
所持金ウインドウ
のX座標、Y座標 とウインドウの横サイズと縦サイズ を
変更する事ができます！
※使用例

//以下の数値やコードを変更してください
//メニューコマンド
var menuCommandX = (BoxWidth - 240);
var menuCommandY = 0;
var menuCommandWidth = 240; // デフォルト幅
var menuCommandHeight = Window_Base.prototype.fittingHeight(8);
//Window_Base.prototype.fittingHeight(行数);//

//メニューステータス
var menuStatusX = 0;
var menuStatusY = 0;
var menuStatusWidth = (BoxWidth - menuCommandWidth); 
var menuStatusHeight = BoxHeight; // デフォルト高さ(全体分の高さ)
// 初期位置の場合は、menuStatusX に menuCommandWidth を使ってください
// var menuStatusX = menuCommandWidth;

//メニューゴールド/所持金
var goldWindowX = (BoxWidth - menuCommandWidth);
var goldWindowY = (BoxHeight - 72);
var goldWindowWidth = 240; // デフォルト幅
var goldWindowHeight = 72; // デフォルト高さ
//コマンドウインドウのすぐ下の場合 goldWindowY を
// var goldWindowY = menuCommandHeight;
//初期位置の場合は goldWindowX を
// var goldWindowX = 0;
すでに他所様のプラグインを使用されている方ならわかると思うんですが…

すでに他所様のプラグインを使用されている方ならわかると思うんですが…
このヨ空が作ったプラグインより
バストアップ系の全身立ち絵を使いたい場合等では
別途改造が必須になってきます、正直AltMenuScreen系のプラグインを
使った方が良いかもしれません…

■閲覧していただきありがとうございました！

■お疲れさまでした！
長々と語らせていただきましたが　
X座標 やY座標 に…、Width やHeight などの画面サイズがある…
これらの座標やサイズを使う感じのコードがある…
という事を知っていただけたでしょうか？

コードの解説は、大まかに説明させていただきまして
以上となります(他のプラグイン等は後々…)

X座標やY座標 に…、WidthやHeightについて理解を深まりましたか…？
プラグインも大体わかっていただけたでしょうか？
Javaへの理解が深まった…、わかりみが深まると
ヨ空も記事を書いた甲斐があります！
(ツクール等のjavaでお困りの方のお役に立てば幸いです！
自分もゲーム制作をがんばろうと思います)

次回はプラグインの作り方、プラグイン作成のコツ等について、当講座の続きを投稿しようと思います

もうjavaを始められている方はそのままファイトです！
それ以外の方、次回をご希望の方は次回更新をお待ちください…！
それでは、良い制作ライフをー！