【解決】画面の最上段とバトルログの間の隙間を消す方法

Arkroyal
記事: 80
登録日時: 2021年1月06日(水) 10:41

【解決】画面の最上段とバトルログの間の隙間を消す方法

投稿記事by Arkroyal » 2021年3月03日(水) 15:55

皆さんこんにちは。毎度お世話になっております。

今回はUI弄り的な質問です。




Q.png


(この画像は https://fungamemake.com/archives/7373 にあるものです。)

画像のご覧の通り、バトルログとゲームウィンドウの最上段の間には隙間があります。

この空間の理由はわかりませんが、必要がないと思いますのでバトルログの位置を調整して隙間を埋めようと試してみました。




私が試したのはrpg_windows内にあるWindow_BattleLog.prototype.initialize関数の

「Window_Selectable.prototype.initialize.call(this, 0, 0, width, height);」(4741行)

のyの値を⁻10に変えてみましたが、

Q2.png


このようにバックグラウンドの陰影だけが上に移動してしまいました。

これは SRD_BattleLogUpgrade プラグインを使ったときも同じで、Y positionに数値を入れても隙間を埋めることはできませんでした。





私が逃しているのは何でしょうか?

皆様のご指導をお待ちさせていただきます。
最後に編集したユーザー Arkroyal on 2021年3月03日(水) 19:26 [ 編集 1 回目 ]

アバター
ムノクラ
記事: 2011
登録日時: 2018年2月23日(金) 11:41
連絡を取る:

Re: 画面の最上段とバトルログの間の隙間を消す方法

投稿記事by ムノクラ » 2021年3月03日(水) 17:07

Arkroyal さんが書きました:皆さんこんにちは。毎度お世話になっております。

今回はUI弄り的な質問です。




Q.png

(この画像は https://fungamemake.com/archives/7373 にあるものです。)

画像のご覧の通り、バトルログとゲームウィンドウの最上段の間には隙間があります。

この空間の理由はわかりませんが、必要がないと思いますのでバトルログの位置を調整して隙間を埋めようと試してみました。




私が試したのはrpg_windows内にあるWindow_BattleLog.prototype.initialize関数の

「Window_Selectable.prototype.initialize.call(this, 0, 0, width, height);」(4741行)

のyの値を⁻10に変えてみましたが、

Q2.png

このようにバックグラウンドの陰影だけが上に移動してしまいました。

これは SRD_BattleLogUpgrade プラグインを使ったときも同じで、Y positionに数値を入れても隙間を埋めることはできませんでした。





私が逃しているのは何でしょうか?

皆様のご指導をお待ちさせていただきます。


バトルログは枠が表示されないウィンドウでパディング(余白)分がマイナスされないと、そこが空白に見えることが原因だと推察します。

コード: 全て選択

Window_Base.prototype.standardPadding = function() {
    return 18;
};

下記のようにY座標をパディング分引いた座標にすれば、それで文字の位置は合うと思います。
下記のコードをプラグインとして保存して、使用してください。

※このプラグインの著作権は放棄します。

コード: 全て選択

(() => {
  "use strict";

  Window_BattleLog.prototype.initialize = function () {
    var width = this.windowWidth();
    var height = this.windowHeight();
    // Window_Selectable.prototype.initialize.call(this, 0, 0, width, height);
    Window_Selectable.prototype.initialize.call(this, 0, -18, width, height);
    this.opacity = 0;
    this._lines = [];
    this._methods = [];
    this._waitCount = 0;
    this._waitMode = '';
    this._baseLineStack = [];
    this._spriteset = null;
    this.createBackBitmap();
    this.createBackSprite();
    this.refresh();
  };

})();


コアスクリプトを直接書き換えずにプラグインにするようにしましょう。
https://fungamemake.com/archives/12254
---
JavaScriptの基本を学習せずにツクールのプラグインやスクリプトを使って横着してゲームを作ろうとしている人間です。
そのような者なので、適当な投稿をするかも知れません。
他の方の投稿を信用してください。
ecf5DTTzl6h6lJj02
記事: 455
登録日時: 2018年12月23日(日) 13:55

Re: 画面の最上段とバトルログの間の隙間を消す方法

投稿記事by ecf5DTTzl6h6lJj02 » 2021年3月03日(水) 18:45

こんばんは。
ムノクラ さんが書きました:

コード: 全て選択

(() => {
  "use strict";

  Window_BattleLog.prototype.initialize = function () {
    var width = this.windowWidth();
    var height = this.windowHeight();
    // Window_Selectable.prototype.initialize.call(this, 0, 0, width, height);
    Window_Selectable.prototype.initialize.call(this, 0, -18, width, height);
    this.opacity = 0;
    this._lines = [];
    this._methods = [];
    this._waitCount = 0;
    this._waitMode = '';
    this._baseLineStack = [];
    this._spriteset = null;
    this.createBackBitmap();
    this.createBackSprite();
    this.refresh();
  };

})();


これだけだと、背景に表示される矩形部分がずれて表示されてしまう(Arkroyal さんの2枚目の画像のような状態になる)ので、上記コードの initialize関数の後ろに次のコードを追加してください。

コード: 全て選択

    Window_BattleLog.prototype.backRect = function() {
        return {
            x: 0,
            y: this.padding * 2,
            width: this.width,
            height: this.numLines() * this.lineHeight()
        };
    };

(一応、こちらでは、きちんと表示されているように見えますが、
位置の調整が適当なので、ずれてしまってたらごめんなさい)
Arkroyal
記事: 80
登録日時: 2021年1月06日(水) 10:41

Re: 画面の最上段とバトルログの間の隙間を消す方法

投稿記事by Arkroyal » 2021年3月03日(水) 19:16

ムノクラ さんが書きました:バトルログは枠が表示されないウィンドウでパディング(余白)分がマイナスされないと、そこが空白に見えることが原因だと推察します。

コード: 全て選択

Window_Base.prototype.standardPadding = function() {
    return 18;
};

下記のようにY座標をパディング分引いた座標にすれば、それで文字の位置は合うと思います。
下記のコードをプラグインとして保存して、使用してください。

※このプラグインの著作権は放棄します。

コード: 全て選択

(() => {
  "use strict";

  Window_BattleLog.prototype.initialize = function () {
    var width = this.windowWidth();
    var height = this.windowHeight();
    // Window_Selectable.prototype.initialize.call(this, 0, 0, width, height);
    Window_Selectable.prototype.initialize.call(this, 0, -18, width, height);
    this.opacity = 0;
    this._lines = [];
    this._methods = [];
    this._waitCount = 0;
    this._waitMode = '';
    this._baseLineStack = [];
    this._spriteset = null;
    this.createBackBitmap();
    this.createBackSprite();
    this.refresh();
  };

})();


コアスクリプトを直接書き換えずにプラグインにするようにしましょう。
https://fungamemake.com/archives/12254





アドバイスありがとうございます!

もちろん直接ではなく、スクリプトのファイルを他に作りその内容を書き換えるようにしました。誤解をまねてしまい申し訳ありません。
Arkroyal
記事: 80
登録日時: 2021年1月06日(水) 10:41

Re: 画面の最上段とバトルログの間の隙間を消す方法

投稿記事by Arkroyal » 2021年3月03日(水) 19:20

ecf5DTTzl6h6lJj02 さんが書きました:こんばんは。
ムノクラ さんが書きました:

コード: 全て選択

(() => {
  "use strict";

  Window_BattleLog.prototype.initialize = function () {
    var width = this.windowWidth();
    var height = this.windowHeight();
    // Window_Selectable.prototype.initialize.call(this, 0, 0, width, height);
    Window_Selectable.prototype.initialize.call(this, 0, -18, width, height);
    this.opacity = 0;
    this._lines = [];
    this._methods = [];
    this._waitCount = 0;
    this._waitMode = '';
    this._baseLineStack = [];
    this._spriteset = null;
    this.createBackBitmap();
    this.createBackSprite();
    this.refresh();
  };

})();


これだけだと、背景に表示される矩形部分がずれて表示されてしまう(Arkroyal さんの2枚目の画像のような状態になる)ので、上記コードの initialize関数の後ろに次のコードを追加してください。

コード: 全て選択

    Window_BattleLog.prototype.backRect = function() {
        return {
            x: 0,
            y: this.padding * 2,
            width: this.width,
            height: this.numLines() * this.lineHeight()
        };
    };

(一応、こちらでは、きちんと表示されているように見えますが、
位置の調整が適当なので、ずれてしまってたらごめんなさい)






アドバイスありがとうございます!

q3.png


教えてくださったようにbackRectのy値をいじってみましたが、

空白は埋められず、バックグラウンドの陰影とログの差が増えました。
Arkroyal
記事: 80
登録日時: 2021年1月06日(水) 10:41

Re: 画面の最上段とバトルログの間の隙間を消す方法

投稿記事by Arkroyal » 2021年3月03日(水) 19:26

ecf5DTTzl6h6lJj02 さんが書きました:こんばんは。
ムノクラ さんが書きました:

コード: 全て選択

(() => {
  "use strict";

  Window_BattleLog.prototype.initialize = function () {
    var width = this.windowWidth();
    var height = this.windowHeight();
    // Window_Selectable.prototype.initialize.call(this, 0, 0, width, height);
    Window_Selectable.prototype.initialize.call(this, 0, -18, width, height);
    this.opacity = 0;
    this._lines = [];
    this._methods = [];
    this._waitCount = 0;
    this._waitMode = '';
    this._baseLineStack = [];
    this._spriteset = null;
    this.createBackBitmap();
    this.createBackSprite();
    this.refresh();
  };

})();


これだけだと、背景に表示される矩形部分がずれて表示されてしまう(Arkroyal さんの2枚目の画像のような状態になる)ので、上記コードの initialize関数の後ろに次のコードを追加してください。

コード: 全て選択

    Window_BattleLog.prototype.backRect = function() {
        return {
            x: 0,
            y: this.padding * 2,
            width: this.width,
            height: this.numLines() * this.lineHeight()
        };
    };

(一応、こちらでは、きちんと表示されているように見えますが、
位置の調整が適当なので、ずれてしまってたらごめんなさい)






新しいプロゼクトでは正常に出力されました。どこかで競合が発生しているようですね。

この原因は自分で探してみます。ありがとうございます…!

“MV:質問” へ戻る