【プラグイン】ゲージ改変プラグイン

どうもビービーです。

最近はマップチップ作りに飽きてきたのでシステムをいじってみています。

色々やっていたらなんかできたので置いておきます。

”ゲージ改変プラグイン”です。

こんな感じでゲージに枠を描画します。

そしてゲージとゲージの枠の色をパラメータで指定できます。

戦闘画面などゲージが表示される画面すべてに適応されます。（たぶん）

ゲージなどの色の指定は\C[n]のnの数値で指定します。

つまりこの色見本の数値です。

このプラグインは自由に改変していただくことでより自分好みのゲージを描画できると思います。

私は改変して3分割にしてみました。

色はパラメータで変更してグラデーションなしにしただけです。

改変したのはこの部分を

var _Window_Base_prototype_drawGauge = Window_Base.prototype.drawGauge;

Window_Base.prototype.drawGauge = function(x, y, width, rate, color1, color2) {

    var fillW = Math.floor(width * rate);

    var gaugeY = y + this.lineHeight() - 8;

    var gaugeBB = y + this.lineHeight() - 9;

    this.contents.fillRect(x - 1, gaugeBB - 1, width + 2, 8, this.textColor(BB_GFC));

    this.contents.fillRect(x, gaugeY - 1, width, 6, this.gaugeBackColor());

    this.contents.gradientFillRect(x, gaugeY - 1, fillW, 6, color1, color2);

};

下記のように書き換えました。

var _Window_Base_prototype_drawGauge = Window_Base.prototype.drawGauge;

Window_Base.prototype.drawGauge = function(x, y, width, rate, color1, color2) {

    var fillW = Math.floor(width * rate);

    var gaugeY = y + this.lineHeight() - 8;

    var gaugeBB = y + this.lineHeight() - 9;

    var gaugeBB3 = width / 3;

    this.contents.fillRect(x - 1, gaugeBB - 1, width + 2, 8, this.textColor(BB_GFC));

    this.contents.fillRect(x, gaugeY - 1, width, 6, this.gaugeBackColor());

    this.contents.gradientFillRect(x, gaugeY - 1, fillW, 6, color1, color2);

    this.contents.fillRect(x + gaugeBB3, gaugeY - 1, 1, 6, this.textColor(BB_GFC));

    this.contents.fillRect(x + gaugeBB3 * 2, gaugeY - 1, 1, 6, this.textColor(BB_GFC));

};

簡単に説明すると

    var gaugeBB3 = width / 3;

ここで横幅の三分の一の数値を指定しています。

そして

    this.contents.fillRect(x + gaugeBB3, gaugeY - 1, 1, 6, this.textColor(BB_GFC));

    this.contents.fillRect(x + gaugeBB3 * 2, gaugeY - 1, 1, 6, this.textColor(BB_GFC));

ここで三分の一の場所と三分の一の二倍（三分の二）の場所に縦6ピクセル横1ピクセルの四角を描画しています。

わかりにくいですかね・・・？

私もよくわかっていないのですがfillRectという物は四角を描画できるようです。

this.contents.fillRect(横位置, 縦位置, 横幅, 高さ, 色);

と指定することで、指定した大きさの四角を描画してくれます。

つまり

this.contents.fillRect(5, 20, 70, 100, this.textColor(8));

と指定すると、画面の位置ｘ＝5、ｙ＝20の場所に横70ピクセル×縦100ピクセルの四角が描画されるということです。

これがわかれば色々できます。

枠が太くなっているのがわかりますか？

もし枠を太くしたい場合は以下の部分を消し

    var gaugeBB = y + this.lineHeight() - 9;

    this.contents.fillRect(x - 1, gaugeBB - 1, width + 2, 8, this.textColor(BB_GFC));

    this.contents.fillRect(x, gaugeY - 1, width, 6, this.gaugeBackColor());

    this.contents.gradientFillRect(x, gaugeY - 1, fillW, 6, color1, color2);

以下のようにすることで倍の太さに変える事ができます。

    var gaugeBB = y + this.lineHeight() - 10;

    this.contents.fillRect(x - 2, gaugeBB - 2, width + 4, 10, this.textColor(BB_GFC));

    this.contents.fillRect(x, gaugeY - 2, width, 6, this.gaugeBackColor());

    this.contents.gradientFillRect(x, gaugeY - 2, fillW, 6, color1, color2);

このときゲージの位置を上げてあげないとTPの枠の下部分が一部画面で表示されません。

もし3倍の太さや上下で違う色にしたいなどありましたら、ゲージの描画位置を上げてあげるのを忘れないようにしてください。

fillRectについては私も勉強中なので間違った情報を書いている可能性もあります。

詳しく知りたい方はご自分で調べてみてください。

プラグインはツクマテに投稿したのでそちらからダウンロードしてください。

http://tm.lucky-duet.com/viewtopic.php?f=5&t=2301