RPGツクールMV – 自作プラグインでゲージを表示する方法

こんにちは、今日はRPGツクールMVの自作プラグインでゲージを表示する方法についてまとめていきます。

確認環境

RPGツクールMV Version 1.6.2

ゲージを表示する関数

ゲーム内でゲージを表示する際に使用する関数がWindow_Baseクラスに定義されており、自作プラグインでゲージを表示する際にも使用できます。
js/rpg_windows.jsの465行目に定義されている以下の関数です。
Window_Baseに定義されているため、他のウィンドウクラスでも使用可能です。

Window_Base.prototype.drawGauge = function(x, y, width, rate, color1, color2) {
    var fillW = Math.floor(width * rate);
    var gaugeY = y + this.lineHeight() - 8;
    this.contents.fillRect(x, gaugeY, width, 6, this.gaugeBackColor());
    this.contents.gradientFillRect(x, gaugeY, fillW, 6, color1, color2);
};

独自シーンにゲージを表示するサンプル

プラグインで独自のシーンにウィンドウを一つ表示し、その中にゲージを表示するサンプルです。
以下のコードを記述したプラグインを有効化し、プラグインコマンド「TestScene」を呼び出しで確認できます。

(function() {
    var _Game_Interpreter_pluginCommand = Game_Interpreter.prototype.pluginCommand;
    Game_Interpreter.prototype.pluginCommand = function(command, args) {
        _Game_Interpreter_pluginCommand.call(this, command, args);
        switch(command){
            case 'TestScene':
                SceneManager.push(Scene_Test);
            break;
        }
    };

    //----------------------------------------------------------------------------------------------------
    // Name : Scene_Test
    // Desc : テストシーンクラス
    //----------------------------------------------------------------------------------------------------
    function Scene_Test() {
        this.initialize.apply(this, arguments);
    }

    Scene_Test.prototype = Object.create(Scene_Base.prototype);
    Scene_Test.prototype.constructor = Scene_Test;

    Scene_Test.prototype.initialize = function() {
        Scene_Base.prototype.initialize.call(this);
    };

    Scene_Test.prototype.create = function() {
        Scene_Base.prototype.create.call(this);
        this.createBackground();
        this.createWindowLayer();

        this._testWindow = new Window_Test(0, 0, Graphics.boxWidth, Graphics.boxHeight);
        this.addWindow(this._testWindow);

        var color1 = this._testWindow.hpGaugeColor1();
        var color2 = this._testWindow.hpGaugeColor2();
        this._testWindow.drawGauge(0, 0, 100, 0.5, color1, color2);
        this._testWindow.drawGauge(0, 100, 100, 0.5, color1, color2);

        this._testWindow.setBackgroundType(2);
    };

    Scene_Test.prototype.update = function() {
        Scene_Base.prototype.update.call(this);

        if (Input.isRepeated('cancel')) {
            this.popScene();
        }
    };

    Scene_Test.prototype.createBackground = function() {
        this._backgroundSprite = new Sprite();
        this._backgroundSprite.bitmap = SceneManager.backgroundBitmap();
        this.addChild(this._backgroundSprite);
    };

    //----------------------------------------------------------------------------------------------------
    // Name : Window_Test
    // Desc : テストウィンドウクラス
    //----------------------------------------------------------------------------------------------------
    function Window_Test() {
        this.initialize.apply(this, arguments);
    }

    Window_Test.prototype = Object.create(Window_Base.prototype);
    Window_Test.prototype.constructor = Window_Test;

    Window_Test.prototype.initialize = function(x, y, width, height) {
        Window_Base.prototype.initialize.call(this, x, y, width, height);
    };

    Window_Test.prototype.drawGauge = function(x, y, width, rate, color1, color2) {
        var fillW = Math.floor(width * rate);
        var gaugeY = y + this.lineHeight() - 8;
        this.contents.fillRect(x, gaugeY, width, 20, this.gaugeBackColor());
        this.contents.gradientFillRect(x, gaugeY, fillW, 20, color1, color2);
    };

})();