Looking for Window_MenuCommand with pictures!

[SeinePestilenz]

Hello everyone!

I'm messing around with some Scripts, trying to layout the Menu for my Game. The Layoutpart is no big deal. It takes time, but it works for the most parts. But what really bothers me, is that I can't find out how to use Sprites for the Menu Command in Scene_Menu. My workaround at this point is just a Background for this Scene with the Buttons for the MenuCommand on the entire Background. But the problem here is, that locked Features (such as Formation when you only have one Actor available) aren't greyed out.

I'm using a modified Version of https://galvs-scripts.com/category/rmmv-plugins/mv-scenessystems/#post-1453

Spoiler: Spoiler: This is the Backgroundimage:

Spoiler: This is how it looks ingame:

Is there any Tutorial on how to make this or a Plugin where I can look, how it's done? Or even someone who can help me directly with this problem?

Tried to figure it out with severeal Titel Picturechoice Plugins, but they don't really help me here.


Ps: When there's a way to modify the Iconsize & switch between to IconSets then I can probably build in an Iconbased Menucommand. But 32x32 are to small and 96x96 for the rest of the game is to big.

Thanks in Advance!

 

[CT_Bolt]

Hello everyone!

I'm messing around with some Scripts, trying to layout the Menu for my Game. The Layoutpart is no big deal. It takes time, but it works for the most parts. But what really bothers me, is that I can't find out how to use Sprites for the Menu Command in Scene_Menu. My workaround at this point is just a Background for this Scene with the Buttons for the MenuCommand on the entire Background. But the problem here is, that locked Features (such as Formation when you only have one Actor available) aren't greyed out.

I'm using a modified Version of https://galvs-scripts.com/category/rmmv-plugins/mv-scenessystems/#post-1453

Spoiler: Spoiler: This is the Backgroundimage:

View attachment 8144

Spoiler: This is how it looks ingame:

View attachment 8145

Is there any Tutorial on how to make this or a Plugin where I can look, how it's done? Or even someone who can help me directly with this problem?

Tried to figure it out with severeal Titel Picturechoice Plugins, but they don't really help me here.


Ps: When there's a way to modify the Iconsize & switch between to IconSets then I can probably build in an Iconbased Menucommand. But 32x32 are to small and 96x96 for the rest of the game is to big.

Thanks in Advance!

Ever tried using this plugin?

Graphics Menu - RPG Maker MV

IntroductionThis plugin allows you to indicate a desired graphics menu. Screenshots Usage Place 'RS_GraphicsMenu.js' file in your plugin folder and then setup it in the Plugin Manager. It will show up the plugin parameters in the right panel of plugin manager and you can display up the various...

biud436.tistory.com

Could help... not really sure if it matches your exact needs though or not.

 

[SeinePestilenz]

On the first look, yes! On the second look, not yet.
When I load the plugin into my Project, it overrides my other Menuplugin. So i need to figure out, how to combine these two. :)
Thanks a lot so far!

 

[CT_Bolt]

On the first look, yes! On the second look, not yet.
When I load the plugin into my Project, it overrides my other Menuplugin. So i need to figure out, how to combine these two. :)
Thanks a lot so far!

Sooooo guess what? I've decided to make a plugin for this.

It's still under development but I would like to see if it works for you like it does for me.

Check it out...
Parameters:

Spoiler

Demo "Command ImageSet" Image:

Spoiler

Screenshots:

Spoiler

Download:
https://rpgmakermv.co/attachments/ctb_windowcommand-js.8149/?hash=85e9824b6a458146082fd2098d0724e4

Details:
You can customize the command windows and give them an image, place the images in the "pictures" folder.
For now the command image layout is just index based...
...so according to which position the command is at will decide which "command image" to pick from the command imageset.
Setup each scene via the parameters. Use the Scene Names to set the command images for the specific scene desired.

Standard Default MV Scene Names:

Spoiler

• Scene_Battle
• Scene_Equip
• Scene_GameEnd
• Scene_Item
• Scene_Menu
• Scene_Options
• Scene_Skill
• Scene_Status
• Scene_Title

Please let me know how it goes.

 

[SeinePestilenz]

Woah. That was unexpected! :O
But I havea Question about the imagefile. How should I set these up?I've tried to put them all into one big Picture, because the Failed to Load-Error told me, that it couldn't find menu_commands.png. But it's just blank.

Spoiler: Screenshot & Imagefile

I'v also tried this one

Spoiler: Test

but it was stretched in a wierd way. I thought that it maybe change to the lower Text when the Cursor is on it.

The Fileimages are just dummies. So don't mind the cutoff texts ^^'

Anyway, it shows the picture :) Thanks so far! And I hope, it isn't to much work for you.

 

[CT_Bolt]

Oh yeah woops...


That's my default but you can set it up as needed and customize row/column amount via the parameters :)
Default is 4x4

 

[SeinePestilenz]

I think, I understand now how it works. :D
But there seems to be Problem with the Height of my Commandwindow?

I've loaded my Image, which is 1 row and 10 cols & set it up in the Plugin-Manager.


But it looked ike this.


v_v

Spoiler: My edited Galv_BustMenu

(function() {  



        Scene_ItemBase.prototype.showSubWindow = function(window) {
            window.x = 140;
            window.y = 101;
            window.height = 540;
            window.show();
            window.activate();
        };



    var _Scene_Menu_create = Scene_Menu.prototype.create;
        Scene_Menu.prototype.create = function() {
        Scene_MenuBase.prototype.create.call(this);
    //    this.createCommandWindow();
        _Scene_Menu_create.call(this);
        this._statusWindow.x = 140;
        this._statusWindow.y = 112;
        this._statusWindow.windowWidth = 1000;
        this._statusWindow.height = 540;
        this._commandWindow.x = 140;
        this._commandWindow.y = 4;
    //    this._commandWindow.width = 1000;
        this._commandWindow.height = 99;
        this._goldWindow.x = 141;
        this._goldWindow.y = 665;      
    };

    Window_MenuStatus.prototype.windowWidth = function(){
        return 1000;
    };

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

    Window_MenuCommand.prototype.maxCols = function() {
        return 10;
    };

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




Galv.BM.a = Number(PluginManager.parameters('Galv_BustMenu')["Menu Actors"]);
Galv.BM.ar = Number(PluginManager.parameters('Galv_BustMenu')["Menu Actor Rows"]);
Galv.BM.name = Number(PluginManager.parameters('Galv_BustMenu')["Name"] - 1);
Galv.BM.nickname = Number(PluginManager.parameters('Galv_BustMenu')["Nickname"] - 1);
Galv.BM.class = Number(PluginManager.parameters('Galv_BustMenu')["Class"] - 1);
Galv.BM.level = Number(PluginManager.parameters('Galv_BustMenu')["Level"] - 1);
Galv.BM.bars = Number(PluginManager.parameters('Galv_BustMenu')["Bars"] - 1);
Galv.BM.JP = Number(PluginManager.parameters('Galv_BustMenu')["JP"] - 1);
Galv.BM.SP = Number(PluginManager.parameters('Galv_BustMenu')["SP"] - 1);
Galv.BM.xp = Number(PluginManager.parameters('Galv_BustMenu')["Exp Bar"] - 1);
Galv.BM.xpBar = PluginManager.parameters('Galv_BustMenu')["Show Exp Bar"] == "true" ? true : false;
Galv.BM.xpText = PluginManager.parameters('Galv_BustMenu')["Show Exp Text"] == "true" ? true : false;
Galv.BM.xpLabel = PluginManager.parameters('Galv_BustMenu')["Exp Text"];
Galv.BM.xpHeight = PluginManager.parameters('Galv_BustMenu')["Exp Bar Height"];
Galv.BM.maxTxt = PluginManager.parameters('Galv_BustMenu')["Max Exp Text"];

Galv.BM.xpCol1 = Number(PluginManager.parameters('Galv_BustMenu')["Exp Bar Color 1"]);
Galv.BM.xpCol2 = Number(PluginManager.parameters('Galv_BustMenu')["Exp Bar Color 2"]);
Galv.BM.icons = Number(PluginManager.parameters('Galv_BustMenu')["States"] - 1);
Galv.BM.bust = Number(PluginManager.parameters('Galv_BustMenu')["Bust Y"]);
Galv.BM.bustHeight = Number(PluginManager.parameters('Galv_BustMenu')["Bust Height"]);
Galv.BM.offsets = function() {
    var array = PluginManager.parameters('Galv_BustMenu')["Bust Offsets"].split("|");
    var obj = {};
    for (i = 0; i < array.length; i++) {
        if (array[i]) {
            var data = array[i].split(",");
            obj[data[0]] = [Number(data[1]),Number(data[2])];
        };
    };
    return obj;
}();

//------------------------------------------------------------
// COMPATIBILITY WITH ROCKETMANCER'S PRETTIER GAUGES


if (PluginManager.parameters('PrettyGauges') && Object.keys(PluginManager.parameters('PrettyGauges')).length > 0) {
    Galv.BM.rmplugin = true;
};
//------------------------------------------------------------


var Galv_Game_Party_initialize = Game_Party.prototype.initialize;
Game_Party.prototype.initialize = function() {
    Galv_Game_Party_initialize.call(this);
    this._bustActorCount = Galv.BM.a;
};


// OVERWRITE
Window_MenuStatus.prototype.numVisibleRows = function() {return Galv.BM.ar};
Window_MenuStatus.prototype.maxCols = function() {return $gameParty._bustActorCount};
Window_Selectable.prototype.spacing = function() {return 0};

Window_MenuStatus.prototype.drawItemStatus = function(index) {
    var actor = $gameParty.members()[index];
    var rect = this.itemRect(index);
    var x = rect.x;
    var y = rect.y;
    var width = rect.width - x - this.textPadding();
    this.drawActorSimpleStatus(actor, x, y, width);
};


// OVERWRITE
Window_MenuStatus.prototype.drawActorSimpleStatus = function(actor, x, y, width) {
    var lineHeight = this.lineHeight();
    var width = this.bustWidth();
    var x = x + 5;
    var width2 = Math.max(100, width - this.textPadding()) - 5;
    if (Galv.BM.xp > -1) this.contents.fontSize = 10; this.drawActorEXP(actor, x+48, 16 + lineHeight * Galv.BM.xp,width2);
    if (Galv.BM.name > -1) this.drawActorName(actor, x, y + lineHeight * Galv.BM.name);
    if (Galv.BM.nickname > -1) this.drawActorNickname(actor, x, y + lineHeight * Galv.BM.nickname);
    if (Galv.BM.level > -1) this.contents.fontSize = 18; this.drawActorLevel(actor, x+135, y + lineHeight * Galv.BM.level);
    if (Galv.BM.icons > -1) this.drawActorIcons(actor, x, y + lineHeight * Galv.BM.icons);
    if (Galv.BM.class > -1) this.drawActorClass(actor, x, y + lineHeight * Galv.BM.class, width2);
    if (Galv.BM.bars > -1) {
        this.drawActorHp(actor, x, y + lineHeight * Galv.BM.bars, width2);
        this.drawActorMp(actor, x, y + lineHeight * (Galv.BM.bars + 1), width2);
        if (Imported.YEP_CoreEngine && eval(Yanfly.Param.MenuTpGauge)) {
            this.drawActorTp(actor, x, y + lineHeight * (Galv.BM.bars + 2), width2);
        }
    };
    if (Imported.YEP_JobPoints && eval(Yanfly.Param.JpShowMenu)) {
        var classId = actor.currentClass().id;
        if (Galv.BM.JP > -1) this.drawActorJp(actor, classId, x+40, y + lineHeight * Galv.BM.JP, width2, 'right');
    };
    if (Imported.YEP_StatAllocation && eval(Yanfly.Param.StatAlcAPMenu)) {
        if (Galv.BM.SP > -1) this.drawActorAp(actor, x+3, y + lineHeight * Galv.BM.SP, width2, 'left');
    };
};


Game_Actor.prototype.xpRate = function() {
    return 1 - (this.nextLevelExp() - this.currentExp()) / (this.nextLevelExp() - this.currentLevelExp());
};


Window_MenuStatus.prototype.drawActorEXP = function(actor, x, y, width) {
    if (Galv.BM.xpBar) {
        var color1 = this.xpGaugeColor1();
        var color2 = this.xpGaugeColor2();
        if (actor.isMaxLevel()) {
            var xprate = 100;
        } else {
            var xprate = actor.xpRate();

        };
        this.drawExpGauge(x-8, y-12, 152, xprate, color1, color2);


    };
    if (Galv.BM.xpText) {
        this.changeTextColor(this.systemColor());
        this.drawText(xprate < 100 ? Galv.BM.xpLabel : Galv.BM.maxTxt, x, y, 44);
        this.changeTextColor(this.normalColor());
        if (xprate < 100) this.drawText(actor.nextRequiredExp(), x, y, width,"left");
    };
};

if (Galv.BM.rmplugin) {
    // IF ROCKETMANCER'S PRETTIER GAUGES PLUGIN
   
    var parameters = PluginManager.parameters('PrettyGauges');
    var barTypeLeft = String(parameters['barType']).substring(0,1);
    var barTypeRight = String(parameters['barType']).substring(1,2)
    var outline = Number(parameters['outline'] || 0);
    var barHeight = Number(parameters['barHeight'] || 0);
    var outlineColor1 = String(parameters['outlineColor1']);
    var outlineColor2 = String(parameters['outlineColor2']);
    var backgroundColor1 = String(parameters['backgroundColor1']);
    var backgroundColor2 = String(parameters['backgroundColor2']);
    var hpColor1 = String(parameters['hpColor1']);
    var hpColor2 = String(parameters['hpColor2']);
    var mpColor1 = String(parameters['mpColor1']);
    var mpColor2 = String(parameters['mpColor2']);
    var tpColor1 = String(parameters['tpColor1']);
    var tpColor2 = String(parameters['tpColor2']);
   
   
    Window_Base.prototype.drawExpGauge = function(x, y, width, rate, color1, color2) {
        var fillW = Math.floor(rate * width);
        var gaugeY = y + this.lineHeight() - 2 - barHeight;
        this.contents.fillTrap(x, gaugeY, width, width, barHeight, this.gaugeBackColor1(),  this.gaugeBackColor2());
        this.contents.fillTrap(x, gaugeY, width, fillW, barHeight, color1, color2);
    };


   
} else {
    // IF GALV ONLY
    Window_Base.prototype.drawExpGauge = function(dx, dy, dw, rate, color1, color2) {
        var color3 = this.gaugeBackColor();
        var fillW = Math.floor(dw * rate).clamp(0, dw);
        var gaugeH = Galv.BM.xpHeight;
        var gaugeY = dy + this.lineHeight() - gaugeH - 2;
        var fillW = Math.floor(dw * rate);
        var gaugeY = dy + this.lineHeight() - gaugeH - 2;
        this.contents.fillRect(dx, gaugeY, dw, gaugeH, color3);
        this.contents.gradientFillRect(dx, gaugeY, dw - fillW, gaugeH, color1, color2);
    };
};



Window_Base.prototype.xpGaugeColor1 = function() {
    return this.textColor(Galv.BM.xpCol1);
};

Window_Base.prototype.xpGaugeColor2 = function() {
    return this.textColor(Galv.BM.xpCol2);
};


// Because blt didn't let you draw a bitmap if it was a tiny bit off
Bitmap.prototype.unlimitedBlt = function(source, sx, sy, sw, sh, dx, dy, dw, dh) {
    dw = dw || sw;
    dh = dh || sh;
        this._context.globalCompositeOperation = 'source-over';
        this._context.drawImage(source._canvas, sx, sy, sw, sh, dx, dy, dw, dh);
        this._setDirty();
};

Window_MenuStatus.prototype.drawFace = function(faceName, faceIndex, x, y, width, height) {
    var width = this.bustWidth();

    var bustName = faceName + "_" + (faceIndex + 1)
    var bitmap = ImageManager.loadPicture(bustName);
   
    var ox = 0;
    var oy = 0;
    if (Galv.BM.offsets[bustName]) {
        ox = Galv.BM.offsets[bustName][0] || 0;
        oy = Galv.BM.offsets[bustName][1] || 0;
    };

    var sw = width;
    var sh = Galv.BM.bustHeight;
    var dx = x - 1;
    var dy = y + Galv.BM.bust;
    var sx = bitmap.width / 2 - width / 2 - ox;
    var sy = oy;
    this.contents.unlimitedBlt(bitmap, sx, sy, sw, sh, dx, dy);
};

Window_MenuStatus.prototype.bustWidth = function() {
    return Math.floor((this.width - (this.standardPadding() * 2)) / this.maxCols());
};


Window_MenuStatus.prototype.cursorDown = function(wrap) {
    var index = this.index();
    var maxItems = this.maxItems();
    var maxCols = this.maxCols();
    if (index < maxItems - maxCols || (wrap && maxCols === 1)) {
        this.select((index + maxCols) % maxItems);
    } else {
        this.select(maxItems - 1);
    }
};


Window_MenuStatus.prototype.cursorUp = function(wrap) {
    var index = this.index();
    var maxItems = this.maxItems();
    var maxCols = this.maxCols();
    if (index >= maxCols || (wrap && maxCols === 1)) {
        this.select((index - maxCols + maxItems) % maxItems);
    } else {
        this.select(0);
    }
};



})();

Everything before the prarameter is from me, maybe it'll help.
And maybe I'll learn something, too. :D looking through your code


Edit: Changing the position of the PlugIn won't help either. But when I turn off Galv's Plugin, it's works with the default params.

 

[CT_Bolt]

I think, I understand now how it works. :D
But there seems to be Problem with the Height of my Commandwindow?

I've loaded my Image, which is 1 row and 10 cols & set it up in the Plugin-Manager.
View attachment 8154

But it looked ike this.
View attachment 8155

v_v

Updated the plugin a lot...

https://rpgmakermv.co/attachments/ctb_windowcommand-js.8158/

This one is made custom to only your needs.
Not really very too customization for most people yet, but I am interested to see how it works on you end.

Parameter Settings:

Spoiler

Screenshot:

Spoiler

Please test and let me know how it works.

For now to display a cursor over the image I used https://galvs-scripts.com/2016/04/02/mv-animated-menu-cursor/
...With the Command Indent Set to 0

 

[SeinePestilenz]

It looks way better now. But it's still a offset. I've tried to change some values into direct numbers (height & width) but it doesn't seem to change anything. But I don't really understand how it takes the right frame for the menu commands. My js-Skils are bad. :'D But it's enough for re-positioning of windows. For the most part.

 

[KaineOfElderon]

Wow I am impressed at the look of these. I am a bit odl fashion traditonalist who tends to like the old menus. if you are looking for menu base plugins I suggest going to sumrndm site he has a bunch of stuff on his site and it is really good.