I'm attempting to build a non-rpg style menu in XP

LilyFrog · 2018-09-01T07:07:10+0900

I'm really sorry in advance if I've posted this in the wrong place. Please move it if so. So for the past few days I've basically been driving myself crazy trying to learn how windows function, and what they can and cannot do. I'm starting to understand some really basic stuff, but overall I have no idea what I'm doing. I have a number of questions, and after several days of research and trying to backwards engineer existing code I can't find answers that work for me. This may be my fault, but I figured this would be a better way to approach this. I will try to be as concise as I can; I do tend to ramble. I made a mockup of the kind of functions I want this menu to have. Please forgive how hideous it is, I just wanted to get something visual made so that I could hopefully figure this out. Spoiler: Mockup Parts of it are actually a screenshot, because I've been trying to put this together in the code, but the buttons were all edited on to the screenshot afterwards. Here is basically how I have it put together. I probably did it entirely wrong. (I'm also aware that the indents are probably all wrong. I'm so sorry.) Spoiler: Code Code: #============================================================================== # **WindowTest #============================================================================== class WindowTest < Window_Base #---------------------------------------------------------------------- # * Object Initialization #---------------------------------------------------------------------- def initialize super(0, 0, 640, 480) self.contents = Bitmap.new(width - 32, height - 32) self.back_opacity = 0 #Display background @mback1 = RPG::Cache.picture("backgroundtest") self.contents.blt(0, 0, @mback1, Rect.new(9, 50, @mback1.width, @mback1.height), 255) #Character graphic @han1 = RPG::Cache.picture("hannahmenu1") self.contents.blt(380, 30, @han1, Rect.new(0, 0, @han1.width, @han1.height), 255) #Item grid graphic @itemgrid = RPG::Cache.picture("grid") self.contents.blt(5, 5, @itemgrid, Rect.new(0, 0, @itemgrid.width, @itemgrid.height), 255) #Name display graphic @charname = RPG::Cache.picture("testname1") self.contents.blt(260, 5, @charname, Rect.new(0, 0, @charname.width, @charname.height), 255) end end Firstly: I can't figure out how to get rid of the black border around the inside edge of the window. I legitimately have no idea what's causing it to be there and/or what I'm doing wrong. Secondly: I want the ugly pink and red grid box to display items that are in the inventory. I intend to use it more as a reference for the player, and for item descriptions to maybe be shown somewhere at the bottom of the grid via a help box. I don't really need the items to be usable, just to be able to highlight them, if this is even possible. My first problem with this is that I legitimately have no idea if it's possible to have a selectable item window on the main menu screen, or where I'd even have to start to make that function properly. Particularly considering the also selectable save, load, etc type buttons (which is a whole 'nother can of worms, but I'll attempt to deal with putting those together later). Is this even a thing that can be done on this engine? My second problem with this is that I can't figure out how to make the item icons display within the grid. I can't even make heads or tails of the Draw Item section of the base Window_Item script. Every time I try to edit it I end up with icons not showing where they're supposed to, or at all. This is mainly from messing around with the self.contents area towards the bottom, because I don't know how to read it so I've just been changing options to see what happens. Thirdly and hopefully finally: Within the game I want there to be different graphics for the menu background and the character graphic that can be changed depending on a variable, and for those graphics to change depending on what that variable's amount is. So for example if variable == 1 then the graphic would be the example graphic, but if the variable is == 2 the graphic would be different, and/or the background image would also change. I would prefer to do this via pictures and not something that is attached to actor data or anything like that. Any advice or help, or anything that anyone can give me on this I'd be super grateful for. If something I explained sounds weird, or I explained it badly please let me know. I'd be happy to try to rephrase it.

● ARCHIVED · READ-ONLY

Started by LilyFrog Aug 31, 2018, 10:07 PM 7 posts View original ↗

LilyFrog

#1 Aug 31, 2018, 10:07 PM Source
I'm really sorry in advance if I've posted this in the wrong place. Please move it if so.

So for the past few days I've basically been driving myself crazy trying to learn how windows function, and what they can and cannot do. I'm starting to understand some really basic stuff, but overall I have no idea what I'm doing. I have a number of questions, and after several days of research and trying to backwards engineer existing code I can't find answers that work for me. This may be my fault, but I figured this would be a better way to approach this. I will try to be as concise as I can; I do tend to ramble.

I made a mockup of the kind of functions I want this menu to have. Please forgive how hideous it is, I just wanted to get something visual made so that I could hopefully figure this out.

Mockup

Parts of it are actually a screenshot, because I've been trying to put this together in the code, but the buttons were all edited on to the screenshot afterwards.
Here is basically how I have it put together. I probably did it entirely wrong. (I'm also aware that the indents are probably all wrong. I'm so sorry.)
Code

Code:
#============================================================================== # **WindowTest #============================================================================== class WindowTest < Window_Base #---------------------------------------------------------------------- # * Object Initialization #---------------------------------------------------------------------- def initialize super(0, 0, 640, 480) self.contents = Bitmap.new(width - 32, height - 32) self.back_opacity = 0 #Display background @mback1 = RPG::Cache.picture("backgroundtest") self.contents.blt(0, 0, @mback1, Rect.new(9, 50, @mback1.width, @mback1.height), 255) #Character graphic @han1 = RPG::Cache.picture("hannahmenu1") self.contents.blt(380, 30, @han1, Rect.new(0, 0, @han1.width, @han1.height), 255) #Item grid graphic @itemgrid = RPG::Cache.picture("grid") self.contents.blt(5, 5, @itemgrid, Rect.new(0, 0, @itemgrid.width, @itemgrid.height), 255) #Name display graphic @charname = RPG::Cache.picture("testname1") self.contents.blt(260, 5, @charname, Rect.new(0, 0, @charname.width, @charname.height), 255) end end
Firstly: I can't figure out how to get rid of the black border around the inside edge of the window. I legitimately have no idea what's causing it to be there and/or what I'm doing wrong.

Secondly: I want the ugly pink and red grid box to display items that are in the inventory. I intend to use it more as a reference for the player, and for item descriptions to maybe be shown somewhere at the bottom of the grid via a help box. I don't really need the items to be usable, just to be able to highlight them, if this is even possible.

My first problem with this is that I legitimately have no idea if it's possible to have a selectable item window on the main menu screen, or where I'd even have to start to make that function properly. Particularly considering the also selectable save, load, etc type buttons (which is a whole 'nother can of worms, but I'll attempt to deal with putting those together later). Is this even a thing that can be done on this engine?

My second problem with this is that I can't figure out how to make the item icons display within the grid. I can't even make heads or tails of the Draw Item section of the base Window_Item script. Every time I try to edit it I end up with icons not showing where they're supposed to, or at all. This is mainly from messing around with the self.contents area towards the bottom, because I don't know how to read it so I've just been changing options to see what happens.

Thirdly and hopefully finally: Within the game I want there to be different graphics for the menu background and the character graphic that can be changed depending on a variable, and for those graphics to change depending on what that variable's amount is.
So for example if variable == 1 then the graphic would be the example graphic, but if the variable is == 2 the graphic would be different, and/or the background image would also change. I would prefer to do this via pictures and not something that is attached to actor data or anything like that.

Any advice or help, or anything that anyone can give me on this I'd be super grateful for.
If something I explained sounds weird, or I explained it badly please let me know. I'd be happy to try to rephrase it.
slimmmeiske2

#2 Aug 31, 2018, 10:30 PM Source

For your first question: I believe changing the line
self.back_opacity = 0
to
self.opacity = 0
would help with that.
LilyFrog

#3 Aug 31, 2018, 10:54 PM Source

Huh, interesting. It got rid of the white border, but the black part is still there.

Image
That being said, that's still useful to know. Thank you.
slimmmeiske2

#4 Aug 31, 2018, 10:55 PM Source

Is it possible your background image isn't big enough?
MushroomCake28

#5 Aug 31, 2018, 11:03 PM Source
First question: As the post before me said, simply set the opacity to 0.

Second question: You should try and break your scene in many windows. For your inventory window, you're better off creating it inheriting from Window_Selectable. Set the cursor's dimension to your red boxes, column to 4, max_item to the number of items in inventory. All that's left is to draw each item's icon in the center (box_x + box_width / 2 - icon_width / 2, box_y + box_height / 2 - icon_height).

Third question: Create a new sprite class (instead of creating an sprite object based on Sprite_Base in the scene) and make it load the bitmap depending on a variable:
Code:
class Sprite_Test < Sprite_Base def initialize super # other default stuff that I forgot because it's been a long time since I coded in ruby load_bitmap() end def load_bitmap if $game_variables[1] == 0 self.bitmap = Image1 else if $game_variables[1] == 1 self.bitmap = Image2 end end end
Okay, it's been a long time since I've coded in ruby (moved to RPG Maker MV, so javascript), but you get the idea. You just create an object based on your sprite class. The sprite will determinate the image to load by itself depending on the value of a game variable.
gstv87

#6 Aug 31, 2018, 11:56 PM Source

been there.
did this.
https://forums.rpgmakerweb.com/index.php?threads/window-window_base-and-windowskin-calls.96865/

read the progress thread, and download the WOR.
you can totally adapt it to XP if you want, it should be plain Ruby.

I believe your problem resides in how the background is drawn separate from the border, which is intrinsic to how the window is put together.
as for the icons problem, you'll need a main menu scene, which would call a window which would be an item list class, which itself will be a window class. (*it* being drawn to your specifications)
LilyFrog

#7 Sep 4, 2018, 12:39 AM Source

I had to step away for a few days and figure out what I'm doing wrong, but I finally have the variable controlled image thing figured out. One problem down.

Thank you, MushroomCake28. I ended up doing it a little differently than you laid out (and probably in a less efficient manner), but that helped me to make sense of it.

I also resolved the background issue by using Sprite.new instead of Bitmap.new. Just putting that there in case someone stumbles upon this that also doesn't comprehend code very easily. I think MushroomCake28 was also trying to say this, and I just grasp these things very slowly.

So now I'm attempting to set up the item grid, and I'm sort of figuring it out (though I ended up trying to compare the original code to the icon items script by Polraudio to figure out which numbers do what) but I'm having this issue where no matter what I do the icons and the selection box-thing don't line up, and it lines up differently depending on which column it is.

Example
I'm really bad at math, and comprehending math, so I'm sure it's my fault, but I'd really appreciate if someone could explain how get the icons to line up in extremely simple terms.
(Additionally but not as big of a deal: is it possible to either have the items horizontally closer together or vertically further apart?)

To gstv87: I appreciate it, however I'm at such a low level of understanding right now that trying to comprehend how everything works didn't work out so well. I also wouldn't know where to start in adapting much of anything from one version to another. But thank you anyway.