Full Games List
Featured Games
New Games
Reviews
Media
Images
Blogs
Game Updates
Images Feedback Summary
Game Design Highlights
Tutorials
Articles
Scripts
Utilities / Plugins
Resources
Engines
Engine Bulletins
What is Makerscore?
Past Events
Achievements
Misaos
Forums
Post History
Chat
New to RMN?
Full Store List
RMN Music Pack (free)
VISUAL NOVEL MAKER BASIC-INTERMEDIATE NON-STACKING INVENTORY SYSTEM
How to make a Basic-Intermediate Inventory system in Visual Novel maker.
Delsin7- 09/01/2018 05:14 AM
- 4429 views
Visual Novel Maker Basic-Intermediate Non-stacking Inventory System
by Delsin7
What's New aka Update-
Finally added a short janky demoreel. Added a Remove Item By Index event. Updated left and right box page selection to deselect items to prevent unwanted item use. New things will have a tag.
Table of Contents-
Overview
Setting the Variables
Setting the Scene
Creating the Scene in Sequence
Common Events as Functions
Other Inventory Functions
Testing
Conclusion
Overview-
Why you may or may not need an inventory system, does your game have items the player will collect? Will it clutter the main game UI if you have them displayed there? Do you want there to be extra functionality besides being a visual indicator of the items? If so then building an inventory system will be beneficial for your game.
Why a Basic-Intermediate Inventory System, do you want to be able to have multiple of each item? Do you want to have the inventory area show exactly what is in the player inventory list? Does your game contain a large variety of items?
I consider this a Basic-Intermediate or Intermediate level system, because it does not make use of script files for setting up a scene or json data objects for your items. Information on the items is thus scene or common event specific.
Basic-Intermediate Non-stacking Inventory System-
This is the main system of the tutorial. Future updates may include showing how to stack items that have a numerical indicator showing how many of them the player holds.
Images You Need-
You will need a grid box image to act as the backdrop for where your items are placed. Grids are helpful since you can more easily tell if you need to adjust images position or size to better fit. It also looks more professional.
Pictures of your items. These should be the same size as each other to prevent positioning issues, if the item is smaller, add transparent space and center it. Thus a pencil and present box item will look different sizes, but their actual size will be the same.
Item Highlight Effect image, these are the size of the individual item boxes so it doesn’t overlap the grid, a different color image than the item box, you can use shapes too to show that that item is highlighted. This is optional, but can really help the player know what they clicked on.
Basic icons or color boxes to show functionality options for the items. If you want the player to be able to inspect, use, discard, or manipulate an item they will all need their own icons or boxes marked clearly for the player.
If you have multiple pages of items, you will need icons, usually directional arrows or +/-, to indicate to the player where to click to change the page.
Setting up the Variables-
While not necessary, it may help to set up the variable names before adding them into the commands. You will need-
Text Variables;
Item to Add/Remove to Inventory
Temp Item
Find Item
Item Box # ---You will need 1 of these for each of the item boxes on screen.
Number Variables;
Inventory Box Highlighted
Item Page Current
Item Page Max
Inventory Temp
Item Box Modifier
List Length
List Index
Item Box # ---You will need 1 of these for each of the item boxes on screen.
Inventory Box # ---You will need 1 of these for each of the item boxes on screen, this is not duplicating the Item Box variables.
Number of Boxes Per Page
Lists;
Inventory --- Only need this one list.
Setting the Scene-
To create and inventory screen you will need to create a new scene or a common event that works like a scene.
If your inventory screen is full page then use the change background image. If the screen is an overlay visible during another scene, assign the inventory grid image to a number higher than those you are using in your other scenes so there is no overlap. This also pertains to hotspots, image maps, and other event commands with priority.
Determine how many items you want to be able to display on screen at once. This should match the boxes in your grid background unless they are used for other things.
For each item box you will need a picture and hotspot associated with it and placed directly on it, matching its dimensions. For easier reading we will set these in blocks with a wait or comment above them so we can find them easier at a glance.
Unless specified I am using Global Variables as you can call them outside the inventory scene, unlike Local Variables.
Now we will set up the scene in a specific sequence.
Creating the Scene in Sequence-
If you are using multiple pages we will do this first, if not then jump to Show Image Map.
Length of List. Put the list that will hold your inventory and then Store In ‘List Length’ number variable.
Number Variable. Inventory Page Current set to value 1.
Number Variable. Inventory Temp set to List Length variable.
Number Variable. Inventory Page Max set to List Length.
Number Variable. Inventory Page Max divide by 25. (OR number of item boxes in your grid box.)
Number Variable. Inventory temp mod by 25. (OR number of item boxes in your grid box.)
(Make sure to check your indentation on the next two steps. In order for a command to be part of a condition it must be indented one space. Do this by selecting the command and pressing the right arrow key once.)
Condition. Number, Inventory Temp, greater than 0.
Number Variable. Inventory Temp set to 1.
Condition. Number, Inventory Page Max, equals 0.
Number Variable. Inventory Page Max set to 1.
Number Variable. Inventory Page Max add Inventory Temp.
(The reason for all this math is so that if you have 0-25 items it will always display 1/1 pages. And if you have 26 items it will display 1/2 pages. Of course, you can always change the item numbers to fit your grid box, but remember to change them in all locations in the scene and common events or the math will be wrong.)
Show Image Map. Set this to as low a Z Order as you need so it doesn’t overlap other images.
If not using a page system then skip to the Call Common Event ‘Update Item Box List’.
Text Settings. Put a unique number here. This is where you adjust the font and size of the text.
Show Text. The Number needs to match the previoous Text Settings. Set this to the area where you want the current and maximum item page numbers. Set to Continue. For text use
{GN:x}/{GN:y}
where global number variable x is the variable number of your Inventory Page Current variable and y is the variable number of your Inventory Page Max variable.
Add Hotspots. Add two hotspots, one for page left and one for page right. Set them to different Jump to Labels. When clicked they will increase or decrease the current page of items.
If you do not have the page left and right arrows on your image map you will need to Show Picture for each of them or add them to your Hotspots Base Image.
Call Common Event ‘Update Item Box List’. Don’t worry about this yet, we will come back to it later. It, like the other common events used here, significantly reduce the size of the scene.
Show Picture. For each item box you have you will need a separate show picture command. Set each of them to a unique Text Variable by clicking the ‘...’ next to the File option in the command. Good naming conventions will save you headaches in the future so name the variable something you will remember what it does. Make sure the Z Order is higher than your background. Set it to Continue.
Wait 2ms.
Add Hotspot. For each item box you will need a separate Add Hotspot command. Set each of them to give a different Bind Value number to the SAME Number Variable. For sanity, make the value the same number as the box name’s number minus 1. Inventory Box 1 should bind value 0. Why minus 1? Because we are using lists and lists start at Index 0, which means your first item will be 0. (This goes way back in computer programming and is a source of easily missed bugs, so pay careful attention when you set this up.) We have the command also jump us to ‘inventory’
label, which we will get to in a minute. NOTE- if you are using a highlighted image effect you must set the hotspot’s selected image to the highlighted image. Set the Action ‘On Deselect’ to jump to label ‘deselect’ or another unique label name.
Idle. This prevents the scene from processing further information until the player clicks on a hotspot or enters information. The player can now click on an item and the scene will continue.
Label ‘inventory. Add a label named inventory, or whatever you choose as long as it matches the item box hotspot jump to label. (This inventory section block sets the data for the item you have clicked on. This data can then be used in other functions.)
Change Hotspot State. Set the Number Variable Inventory Box Highlighted to Selected: No, Enabled: Yes.
Number Variable. Set a Number Variable that will hold which Inventory Box is Highlighted. Set the Value to 100. (You can use any number really, but remember that you are dealing with Indexes, so the last digit should be a 0 for ease of use.)
Number Variable. Add the Item Box number to the Inventory Box Highlighted number variable.
Common Event ‘Enable Hotspots’. This activates all hotspots in the scene. The reason we use this is that even though the hotspots are already enabled, this event sets them to not being selected, which resets the Highlighted 'selected’ version of our box.
Change Hotspot State. Set the Number Variable Inventory Box Highlighted to Selected: Yes, Enabled: Yes.
Get From List. Set the List to the one that will hold the names of items in your inventory. Set the index to the Inventory Box # number variable. Set the value to text. Store it in the Temp Item text variable. If you call this variable it will give you the name of the item you have selected.
Wait 25ms. Could possibly use a smaller number. It is here to let the program catch up with the events. Note:! After the most recent update it seems like this might not be necessary. In my test I did not need it at all anymore. Woo.
If you are not going to have multiple pages then skip this next section to the Get From List command. This next part is for modifying the where in the inventory list we draw from based upon the page number.
Number Variable. Set the Item Box (or Subbox) Modifier to the number of boxes on screen at one time.
Number Variable. Multiply the Item Box Modifier variable by the Inventory Page Current variable.
Number Variable. Subtract the number of boxes on screen at one time from the Item Box Modifier variable.
Number Variable. Add the Item Box Modifier to the Item Box # variable.
Get From List. From the Inventory List at Index Inventory Box # variable get the Text Value and Store in the Temp Item text variable.
Idle. Prevents the scene from continuing after you have selected an item.
Label ‘deselect’. This is the section that runs when you deselect an inventory box hotspot.
Change Hotspot State. Set the Inventory Box Highlighted number variable to Selected: No, Enabled: No.
Call Common Event ‘Disable Hotspots’.
Reset Variables. Global, Text, Range, #,#. # should be the Temp Item number variable -1, because it is calling the Index of the variable and not its number. (Remember -1.)
Call Common Event ‘Enable Hotspots’.
Idle.
Item Page Buttons, if you are not using this system skip to the next section.
Page Left-
Label ‘page left’.
Call Common Event ‘Disable Hotspots’.
Number Variable. Inventory Page Current sub 1.
Condition. Number, Inventory Page Current equals 0.
Number Variable. Inventory Page Current set to Inventory Page Max.
Reset Variables. Global, Text, Range, #,#. # should be the Temp Item number variable -1, because it is calling the Index of the variable and not its number. (Remember -1.)
Change Hotspot State. Inventory Box Highlighted variable, Selected: No, Enabled: No.
Call Common Event ‘Update Item Box List’.
Refresh Text. The number corresponding to the item page number text.
Call Common Event ‘Enable Hotspots’.
Wait 15ms.
Idle.
Label ‘page right’.
Call Common Event ‘Disable Hotspots’.
Number Variable. Inventory Page Current add 1.
Condition. Number, Inventory Page Current greater than Inventory Page Max.
Number Variable. Inventory Page Current set to 1.
Reset Variables. Global, Text, Range, #,#. # should be the Temp Item number variable -1, because it is calling the Index of the variable and not its number. (Remember -1.)
Change Hotspot State. Inventory Box Highlighted variable, Selected: No, Enabled: No.
Call Common Event ‘Update Item Box List’.
Refresh Text. The number corresponding to the item page number text.
Call Common Event ‘Enable Hotspots’.
Wait 15ms.
Idle.
This sets up the basics of what we need for the inventory screen. We can now click on a box and if there is an item there (by searching through the list at the appropriate index) it will store that item’s name in a variable. And if we click on the same box again it will deselect it.
There is still a lot to do however, we need common events, page switching events if you are going to use them, a button players can press to exit the scene or hide it, and buttons or events for when the player clicks on an item or wants to manipulate it in some way.
Easy Exit Button- Create a Hotspot command near the top of the scene script before the first Idle command. Make it Jump to Label ‘leave’ or ‘exit’ or whatever a unique label name will be. Add text or an image to that area if your image map does not already indicate that it is the place to click to leave the inventory screen.
Easy Exit Event-
Label. Set to ‘leave’ or ‘exit’ or whatever as long as it matches your exit button label.
Erase Image Map. Set this to the number that your grid box is.
Common Event ‘Erase Image Hotspots’.
Reset Variables. Global, Text, Range, x,x. Where x is the number of your Temp Item variable -1. Remember it’s calling for an Index.
Erase additional pictures if needed.
Clear text if needed.
Wait 550ms. Could make this lower, but depending on the size and complexity of your inventory scene the program may need more time to fully clear images.
Previous Scene. Go back to the previous scene.
Common Events as Functions-
In order to severely reduce the amount of commands in our scene we will use Common Events in a manner as programming functions or methods. Things like enable/disable hotspots, update item boxes, clear hotspots and images, and more are important. You could also add other common events such as ones containing info about the items.
Enable Hotspots-
For each Hotspot in the scene at one time we add the Change Hotspot State to Selected: No, Enabled: Yes.
Then we add a Wait 2ms command.
Disable Hotspots-
For each Hotspot in the scene at one time we add the Change Hotspot State to Selected: No, Enabled: No.
Then we add a Wait 2ms command.
Erase Inventory Hotspots-
For each Hotspot in the scene we add an Erase Hotspot command.
Adding or Removing Items-
:You might need to add or remove a lot of items to your inventory during a standard playthrough in your game. So making modifying your inventory as easy and fast as possible is very important. To do you we will create an Add Item and a Remove Item common event.
As you can see they are similar. Both make use of the same Text Variable in the Parameters box near the top of the screen.
Add Item-
Add to List. List is your Inventory List variable, value is text, and the third variable is your Add/Remove Item text variable that is referenced in the Parameters above.
Remove Item by Name-
Find in List. List is your Inventory List variable, value is text, value is text, Item to Add/Remove variable, Store Index in Item Index number variable.
Remove from List. List is your Inventory List variable, Index is your Item Index number variable.
Remove Item by Index-
Item to Add/Remove variable, Store Index in Item Index number variable.
Remove from List. List is your Inventory List variable, Index is your Item Index number variable.
You can Add bulk items to a list or even Overwrite the list if needed.
Bulk Item Add-
Text Variable. Target Text, Text Variable is the Item to Add/Remove Variable, set to a
group of names. Separate them with commas , but do NOT put spaces. Spaces are added to the name and will mess it up.
Text to List. Tex Variable is your Item to Add/Remove, Store in Inventory List, Seperator is comma , .
You can now clear the Item to Add/Remove variable, but it shouldn’t be necessary.
Overwrite List-
Script.
var lk = [,,,]
GameManager.variableStore.setListObjectTo({ index: x, scope: 1 }, lk)
This uses the Index, so change it from x to the number of your Inventory List -1, scope 1 is your global variables. When using this method you must use “” around each name in the list or it treats it like a variable. In addition each item must be surrounded by brackets with a set of brackets surrounding the whole list. var lk is just a temporary variable name, you could use var Mythos or var Bucket if you wanted to.
Be careful with the Overwrite method as once it occurs you cannot get your list back.
Erase Itembox Images and Image Map-
This isn’t needed very often. It IS however needed if you make the scene into a parallel common event concurrent scene.
Erase Image Map. Erase the Item Grid box.
Erase Text. Erase the Item Page Text.
Erase Picture. For each inventory item add an Erase Picture command.
Update Item Box List-
This is the big common event that will update the image, hotspots, variables, and more for the inventory scene.
If you are not using the page system then skip to Reset Variables.
Length of List. List Inventory Store in List Length variable.
Number Variable. Inventory Page Current set to value 1.
Number Variable. Inventory Temp set to List Length variable.
Number Variable. Inventory Page Max set to List Length.
Number Variable. Inventory Page Max divide by 25. (OR number of item boxes in your grid box.)
Number Variable. Inventory temp mod by 25. (OR number of item boxes in your grid box.)
(Make sure to check your indentation on the next two steps.)
Condition. Number, Inventory Temp, greater than 0.
Number Variable. Inventory Temp set to 1.
Condition. Number, List Length, lesser than 26. (max box per page + 1)
Number Variable. Inventory Temp set to 0.
Condition. Number, Inventory Page Max, equals 0.
Number Variable. Inventory Page Max set to 1.
Number Variable. Inventory Page Max add Inventory Temp.
(If you recall from earlier this is the same steps as setting it up in the inventory scene.)
Refresh Text. Same number as your page number text.
Reset Global Variables. Range from x to y. Make this your text Item Box #s -1 since it uses Index.
There are now several ways to get the item name from the Inventory List and display it in it’s appropriate box. The below version allows for both multiple page inventory and single page inventory.
Number Variable. Number of Boxes Per page set to x, where x is the maximum number of boxes/items displayed on screen at one time.
Number Variable. Item Box Page Index set to Item Page Current variable.
Number Variable. Item Box Page Index sub 1.
Number Variable. Item Box Number Modifier set to Item Box Page Index variable.
Number Variable. Item Box Number Modifier multiply by Number of Boxes Per Page variable.
Number Variable. For Item Box #s set their values incrementally starting from 0 since we’ll be using this as an index. Ie, Item Box 1 set to 0, Item Box 2 set to 1, etc for each of your Item boxes.
Number Variable. For Item Box #s add the Item Box Number Modifier variable. This will increase the index number from where we grab in the list based upon what page number we are on.
Get From List. For each Item Box # get the text data and Store in Inventory Box of the same number. Ie Item Box 1 should go in Inventory Box 1.
Set Object Data. Picture, #, Resource Name, Inventory Box #. For each item box picture on the grid add the appropriate Inventory Box #, usually this means the top left is Inventory Box 1. Make sure the picture numbers match up with the picture numbers in your Inventory Scene.
Wait 15ms.
Other Inventory Functions-
What do you want your items to do when you click on them, or do you want them to simply be a visual indicator of what items you have as it is right now. Note that this may change while you work on your game. Be flexible.
Info Button-
After clicking on an item the player can click on an Info or Inspect button to get a message popup with dialogue about the item. This is also an example of interactive functionality, ie something the player can do to get more out of the game. Interactive functionality can be very important to help your players feel like they are exploring the world you create. This is a simple example, but by seeing how it is done you can create other buttons or events to increase interactivity.
Add Hotspot. Create this before the first Idle in the initialization part of the scene. Set it to Jump to Label ‘Info’ or something unique.
Label ‘Info’. Put this down below other event blocks or where it will not interfere with other blocks of events.
Common Event ‘Disable Hotspots’. This is very important as it prevents the player from clicking the Info button and triggering the Info events while it is already in progress.
Wait 2ms.
Now here is where you add conditional checks for the item selected. You could create a common event that contains this info and call it once or put the entire event here. For each item the player can acquire it will require a unique conditional check. So if there are 30 unique items in your game you will need 30 of the following conditional checks.
Condition. Text, Temp Item variable, equal to ‘x’.
Show Message. Wait. “It goes x.”
If the item is deselected or the player tries to select an empty box, then nothing will happen. Also make sure that the Text you are checking is spelled exactly the same as the item you add to the inventory. Feel free to add more commands that occur if the player looks at an item. Maybe it will trigger a switch so that further along in the story one of the player characters recognizes a strange artifact belonging to the strange cult by the docks.
Clear Message
Common Event ‘Enable Hotspots’.
Wait 2ms.
Idle.
Testing-
Now you need to test your scene. Chances are something will break on your first attempt, but don’t panic. Most errors are due to the wrong index number, the wrong indentation for event commands, or having things in the wrong order. After checking for those issues, look through this tutorial again after a short break. If you are still having issues feel free to send me a message and I’ll try to get back to you soon.
Conclusion-
With this tutorial I hope I’ve shown you how to build a fun system for both the player and the game maker. It was quite a lot of work creating it, I think it took like a bit over a week of many hours a day getting it to work. It’s also the first (well sorta second) VNM system I’ve built and I’m pretty proud with the result, even if it can be a bit convoluted or not as crazy awesome as what some professional programmers can magic up. Thank you for reading and keep on the game make!
If you find any errors or feel like a section could use more clarity please let me know and I’ll attempt to fix it.
Made by Delsin7 for RPGMaker.net’s articles. Please don’t repost on other websites without contacting me first.
by Delsin7
What's New aka Update-
Finally added a short janky demoreel. Added a Remove Item By Index event. Updated left and right box page selection to deselect items to prevent unwanted item use. New things will have a tag.
Table of Contents-
Overview
Setting the Variables
Setting the Scene
Creating the Scene in Sequence
Common Events as Functions
Other Inventory Functions
Testing
Conclusion
Overview-
Why you may or may not need an inventory system, does your game have items the player will collect? Will it clutter the main game UI if you have them displayed there? Do you want there to be extra functionality besides being a visual indicator of the items? If so then building an inventory system will be beneficial for your game.
Why a Basic-Intermediate Inventory System, do you want to be able to have multiple of each item? Do you want to have the inventory area show exactly what is in the player inventory list? Does your game contain a large variety of items?
I consider this a Basic-Intermediate or Intermediate level system, because it does not make use of script files for setting up a scene or json data objects for your items. Information on the items is thus scene or common event specific.
Basic-Intermediate Non-stacking Inventory System-
This is the main system of the tutorial. Future updates may include showing how to stack items that have a numerical indicator showing how many of them the player holds.
Images You Need-
You will need a grid box image to act as the backdrop for where your items are placed. Grids are helpful since you can more easily tell if you need to adjust images position or size to better fit. It also looks more professional.
Pictures of your items. These should be the same size as each other to prevent positioning issues, if the item is smaller, add transparent space and center it. Thus a pencil and present box item will look different sizes, but their actual size will be the same.
Item Highlight Effect image, these are the size of the individual item boxes so it doesn’t overlap the grid, a different color image than the item box, you can use shapes too to show that that item is highlighted. This is optional, but can really help the player know what they clicked on.
Basic icons or color boxes to show functionality options for the items. If you want the player to be able to inspect, use, discard, or manipulate an item they will all need their own icons or boxes marked clearly for the player.
If you have multiple pages of items, you will need icons, usually directional arrows or +/-, to indicate to the player where to click to change the page.
Setting up the Variables-
While not necessary, it may help to set up the variable names before adding them into the commands. You will need-
Text Variables;
Item to Add/Remove to Inventory
Temp Item
Find Item
Item Box # ---You will need 1 of these for each of the item boxes on screen.
Number Variables;
Inventory Box Highlighted
Item Page Current
Item Page Max
Inventory Temp
Item Box Modifier
List Length
List Index
Item Box # ---You will need 1 of these for each of the item boxes on screen.
Inventory Box # ---You will need 1 of these for each of the item boxes on screen, this is not duplicating the Item Box variables.
Number of Boxes Per Page
Lists;
Inventory --- Only need this one list.
Setting the Scene-
To create and inventory screen you will need to create a new scene or a common event that works like a scene.
If your inventory screen is full page then use the change background image. If the screen is an overlay visible during another scene, assign the inventory grid image to a number higher than those you are using in your other scenes so there is no overlap. This also pertains to hotspots, image maps, and other event commands with priority.
Determine how many items you want to be able to display on screen at once. This should match the boxes in your grid background unless they are used for other things.
For each item box you will need a picture and hotspot associated with it and placed directly on it, matching its dimensions. For easier reading we will set these in blocks with a wait or comment above them so we can find them easier at a glance.
Unless specified I am using Global Variables as you can call them outside the inventory scene, unlike Local Variables.
Now we will set up the scene in a specific sequence.
Creating the Scene in Sequence-
If you are using multiple pages we will do this first, if not then jump to Show Image Map.
Length of List. Put the list that will hold your inventory and then Store In ‘List Length’ number variable.
Number Variable. Inventory Page Current set to value 1.
Number Variable. Inventory Temp set to List Length variable.
Number Variable. Inventory Page Max set to List Length.
Number Variable. Inventory Page Max divide by 25. (OR number of item boxes in your grid box.)
Number Variable. Inventory temp mod by 25. (OR number of item boxes in your grid box.)
(Make sure to check your indentation on the next two steps. In order for a command to be part of a condition it must be indented one space. Do this by selecting the command and pressing the right arrow key once.)
Condition. Number, Inventory Temp, greater than 0.
Number Variable. Inventory Temp set to 1.
Condition. Number, Inventory Page Max, equals 0.
Number Variable. Inventory Page Max set to 1.
Number Variable. Inventory Page Max add Inventory Temp.
(The reason for all this math is so that if you have 0-25 items it will always display 1/1 pages. And if you have 26 items it will display 1/2 pages. Of course, you can always change the item numbers to fit your grid box, but remember to change them in all locations in the scene and common events or the math will be wrong.)
Show Image Map. Set this to as low a Z Order as you need so it doesn’t overlap other images.
If not using a page system then skip to the Call Common Event ‘Update Item Box List’.
Text Settings. Put a unique number here. This is where you adjust the font and size of the text.
Show Text. The Number needs to match the previoous Text Settings. Set this to the area where you want the current and maximum item page numbers. Set to Continue. For text use
{GN:x}/{GN:y}
where global number variable x is the variable number of your Inventory Page Current variable and y is the variable number of your Inventory Page Max variable.
Add Hotspots. Add two hotspots, one for page left and one for page right. Set them to different Jump to Labels. When clicked they will increase or decrease the current page of items.
If you do not have the page left and right arrows on your image map you will need to Show Picture for each of them or add them to your Hotspots Base Image.
Call Common Event ‘Update Item Box List’. Don’t worry about this yet, we will come back to it later. It, like the other common events used here, significantly reduce the size of the scene.
Show Picture. For each item box you have you will need a separate show picture command. Set each of them to a unique Text Variable by clicking the ‘...’ next to the File option in the command. Good naming conventions will save you headaches in the future so name the variable something you will remember what it does. Make sure the Z Order is higher than your background. Set it to Continue.
Wait 2ms.
Add Hotspot. For each item box you will need a separate Add Hotspot command. Set each of them to give a different Bind Value number to the SAME Number Variable. For sanity, make the value the same number as the box name’s number minus 1. Inventory Box 1 should bind value 0. Why minus 1? Because we are using lists and lists start at Index 0, which means your first item will be 0. (This goes way back in computer programming and is a source of easily missed bugs, so pay careful attention when you set this up.) We have the command also jump us to ‘inventory’
label, which we will get to in a minute. NOTE- if you are using a highlighted image effect you must set the hotspot’s selected image to the highlighted image. Set the Action ‘On Deselect’ to jump to label ‘deselect’ or another unique label name.
Idle. This prevents the scene from processing further information until the player clicks on a hotspot or enters information. The player can now click on an item and the scene will continue.
Label ‘inventory. Add a label named inventory, or whatever you choose as long as it matches the item box hotspot jump to label. (This inventory section block sets the data for the item you have clicked on. This data can then be used in other functions.)
Change Hotspot State. Set the Number Variable Inventory Box Highlighted to Selected: No, Enabled: Yes.
Number Variable. Set a Number Variable that will hold which Inventory Box is Highlighted. Set the Value to 100. (You can use any number really, but remember that you are dealing with Indexes, so the last digit should be a 0 for ease of use.)
Number Variable. Add the Item Box number to the Inventory Box Highlighted number variable.
Common Event ‘Enable Hotspots’. This activates all hotspots in the scene. The reason we use this is that even though the hotspots are already enabled, this event sets them to not being selected, which resets the Highlighted 'selected’ version of our box.
Change Hotspot State. Set the Number Variable Inventory Box Highlighted to Selected: Yes, Enabled: Yes.
Get From List. Set the List to the one that will hold the names of items in your inventory. Set the index to the Inventory Box # number variable. Set the value to text. Store it in the Temp Item text variable. If you call this variable it will give you the name of the item you have selected.
Wait 25ms. Could possibly use a smaller number. It is here to let the program catch up with the events. Note:! After the most recent update it seems like this might not be necessary. In my test I did not need it at all anymore. Woo.
If you are not going to have multiple pages then skip this next section to the Get From List command. This next part is for modifying the where in the inventory list we draw from based upon the page number.
Number Variable. Set the Item Box (or Subbox) Modifier to the number of boxes on screen at one time.
Number Variable. Multiply the Item Box Modifier variable by the Inventory Page Current variable.
Number Variable. Subtract the number of boxes on screen at one time from the Item Box Modifier variable.
Number Variable. Add the Item Box Modifier to the Item Box # variable.
Get From List. From the Inventory List at Index Inventory Box # variable get the Text Value and Store in the Temp Item text variable.
Idle. Prevents the scene from continuing after you have selected an item.
Label ‘deselect’. This is the section that runs when you deselect an inventory box hotspot.
Change Hotspot State. Set the Inventory Box Highlighted number variable to Selected: No, Enabled: No.
Call Common Event ‘Disable Hotspots’.
Reset Variables. Global, Text, Range, #,#. # should be the Temp Item number variable -1, because it is calling the Index of the variable and not its number. (Remember -1.)
Call Common Event ‘Enable Hotspots’.
Idle.
Item Page Buttons, if you are not using this system skip to the next section.
Page Left-
Label ‘page left’.
Call Common Event ‘Disable Hotspots’.
Number Variable. Inventory Page Current sub 1.
Condition. Number, Inventory Page Current equals 0.
Number Variable. Inventory Page Current set to Inventory Page Max.
Reset Variables. Global, Text, Range, #,#. # should be the Temp Item number variable -1, because it is calling the Index of the variable and not its number. (Remember -1.)
Change Hotspot State. Inventory Box Highlighted variable, Selected: No, Enabled: No.
Call Common Event ‘Update Item Box List’.
Refresh Text. The number corresponding to the item page number text.
Call Common Event ‘Enable Hotspots’.
Wait 15ms.
Idle.
Label ‘page right’.
Call Common Event ‘Disable Hotspots’.
Number Variable. Inventory Page Current add 1.
Condition. Number, Inventory Page Current greater than Inventory Page Max.
Number Variable. Inventory Page Current set to 1.
Reset Variables. Global, Text, Range, #,#. # should be the Temp Item number variable -1, because it is calling the Index of the variable and not its number. (Remember -1.)
Change Hotspot State. Inventory Box Highlighted variable, Selected: No, Enabled: No.
Call Common Event ‘Update Item Box List’.
Refresh Text. The number corresponding to the item page number text.
Call Common Event ‘Enable Hotspots’.
Wait 15ms.
Idle.
This sets up the basics of what we need for the inventory screen. We can now click on a box and if there is an item there (by searching through the list at the appropriate index) it will store that item’s name in a variable. And if we click on the same box again it will deselect it.
There is still a lot to do however, we need common events, page switching events if you are going to use them, a button players can press to exit the scene or hide it, and buttons or events for when the player clicks on an item or wants to manipulate it in some way.
Easy Exit Button- Create a Hotspot command near the top of the scene script before the first Idle command. Make it Jump to Label ‘leave’ or ‘exit’ or whatever a unique label name will be. Add text or an image to that area if your image map does not already indicate that it is the place to click to leave the inventory screen.
Easy Exit Event-
Label. Set to ‘leave’ or ‘exit’ or whatever as long as it matches your exit button label.
Erase Image Map. Set this to the number that your grid box is.
Common Event ‘Erase Image Hotspots’.
Reset Variables. Global, Text, Range, x,x. Where x is the number of your Temp Item variable -1. Remember it’s calling for an Index.
Erase additional pictures if needed.
Clear text if needed.
Wait 550ms. Could make this lower, but depending on the size and complexity of your inventory scene the program may need more time to fully clear images.
Previous Scene. Go back to the previous scene.
Common Events as Functions-
In order to severely reduce the amount of commands in our scene we will use Common Events in a manner as programming functions or methods. Things like enable/disable hotspots, update item boxes, clear hotspots and images, and more are important. You could also add other common events such as ones containing info about the items.
Enable Hotspots-
For each Hotspot in the scene at one time we add the Change Hotspot State to Selected: No, Enabled: Yes.
Then we add a Wait 2ms command.
Disable Hotspots-
For each Hotspot in the scene at one time we add the Change Hotspot State to Selected: No, Enabled: No.
Then we add a Wait 2ms command.
Erase Inventory Hotspots-
For each Hotspot in the scene we add an Erase Hotspot command.
Adding or Removing Items-
:You might need to add or remove a lot of items to your inventory during a standard playthrough in your game. So making modifying your inventory as easy and fast as possible is very important. To do you we will create an Add Item and a Remove Item common event.
As you can see they are similar. Both make use of the same Text Variable in the Parameters box near the top of the screen.
Add Item-
Add to List. List is your Inventory List variable, value is text, and the third variable is your Add/Remove Item text variable that is referenced in the Parameters above.
Remove Item by Name-
Find in List. List is your Inventory List variable, value is text, value is text, Item to Add/Remove variable, Store Index in Item Index number variable.
Remove from List. List is your Inventory List variable, Index is your Item Index number variable.
Remove Item by Index-
Item to Add/Remove variable, Store Index in Item Index number variable.
Remove from List. List is your Inventory List variable, Index is your Item Index number variable.
You can Add bulk items to a list or even Overwrite the list if needed.
Bulk Item Add-
Text Variable. Target Text, Text Variable is the Item to Add/Remove Variable, set to a
group of names. Separate them with commas , but do NOT put spaces. Spaces are added to the name and will mess it up.
Text to List. Tex Variable is your Item to Add/Remove, Store in Inventory List, Seperator is comma , .
You can now clear the Item to Add/Remove variable, but it shouldn’t be necessary.
Overwrite List-
Script.
var lk = [,,,]
GameManager.variableStore.setListObjectTo({ index: x, scope: 1 }, lk)
This uses the Index, so change it from x to the number of your Inventory List -1, scope 1 is your global variables. When using this method you must use “” around each name in the list or it treats it like a variable. In addition each item must be surrounded by brackets with a set of brackets surrounding the whole list. var lk is just a temporary variable name, you could use var Mythos or var Bucket if you wanted to.
Be careful with the Overwrite method as once it occurs you cannot get your list back.
Erase Itembox Images and Image Map-
This isn’t needed very often. It IS however needed if you make the scene into a parallel common event concurrent scene.
Erase Image Map. Erase the Item Grid box.
Erase Text. Erase the Item Page Text.
Erase Picture. For each inventory item add an Erase Picture command.
Update Item Box List-
This is the big common event that will update the image, hotspots, variables, and more for the inventory scene.
If you are not using the page system then skip to Reset Variables.
Length of List. List Inventory Store in List Length variable.
Number Variable. Inventory Page Current set to value 1.
Number Variable. Inventory Temp set to List Length variable.
Number Variable. Inventory Page Max set to List Length.
Number Variable. Inventory Page Max divide by 25. (OR number of item boxes in your grid box.)
Number Variable. Inventory temp mod by 25. (OR number of item boxes in your grid box.)
(Make sure to check your indentation on the next two steps.)
Condition. Number, Inventory Temp, greater than 0.
Number Variable. Inventory Temp set to 1.
Condition. Number, List Length, lesser than 26. (max box per page + 1)
Number Variable. Inventory Temp set to 0.
Condition. Number, Inventory Page Max, equals 0.
Number Variable. Inventory Page Max set to 1.
Number Variable. Inventory Page Max add Inventory Temp.
(If you recall from earlier this is the same steps as setting it up in the inventory scene.)
Refresh Text. Same number as your page number text.
Reset Global Variables. Range from x to y. Make this your text Item Box #s -1 since it uses Index.
There are now several ways to get the item name from the Inventory List and display it in it’s appropriate box. The below version allows for both multiple page inventory and single page inventory.
Number Variable. Number of Boxes Per page set to x, where x is the maximum number of boxes/items displayed on screen at one time.
Number Variable. Item Box Page Index set to Item Page Current variable.
Number Variable. Item Box Page Index sub 1.
Number Variable. Item Box Number Modifier set to Item Box Page Index variable.
Number Variable. Item Box Number Modifier multiply by Number of Boxes Per Page variable.
Number Variable. For Item Box #s set their values incrementally starting from 0 since we’ll be using this as an index. Ie, Item Box 1 set to 0, Item Box 2 set to 1, etc for each of your Item boxes.
Number Variable. For Item Box #s add the Item Box Number Modifier variable. This will increase the index number from where we grab in the list based upon what page number we are on.
Get From List. For each Item Box # get the text data and Store in Inventory Box of the same number. Ie Item Box 1 should go in Inventory Box 1.
Set Object Data. Picture, #, Resource Name, Inventory Box #. For each item box picture on the grid add the appropriate Inventory Box #, usually this means the top left is Inventory Box 1. Make sure the picture numbers match up with the picture numbers in your Inventory Scene.
Wait 15ms.
Other Inventory Functions-
What do you want your items to do when you click on them, or do you want them to simply be a visual indicator of what items you have as it is right now. Note that this may change while you work on your game. Be flexible.
Info Button-
After clicking on an item the player can click on an Info or Inspect button to get a message popup with dialogue about the item. This is also an example of interactive functionality, ie something the player can do to get more out of the game. Interactive functionality can be very important to help your players feel like they are exploring the world you create. This is a simple example, but by seeing how it is done you can create other buttons or events to increase interactivity.
Add Hotspot. Create this before the first Idle in the initialization part of the scene. Set it to Jump to Label ‘Info’ or something unique.
Label ‘Info’. Put this down below other event blocks or where it will not interfere with other blocks of events.
Common Event ‘Disable Hotspots’. This is very important as it prevents the player from clicking the Info button and triggering the Info events while it is already in progress.
Wait 2ms.
Now here is where you add conditional checks for the item selected. You could create a common event that contains this info and call it once or put the entire event here. For each item the player can acquire it will require a unique conditional check. So if there are 30 unique items in your game you will need 30 of the following conditional checks.
Condition. Text, Temp Item variable, equal to ‘x’.
Show Message. Wait. “It goes x.”
If the item is deselected or the player tries to select an empty box, then nothing will happen. Also make sure that the Text you are checking is spelled exactly the same as the item you add to the inventory. Feel free to add more commands that occur if the player looks at an item. Maybe it will trigger a switch so that further along in the story one of the player characters recognizes a strange artifact belonging to the strange cult by the docks.
Clear Message
Common Event ‘Enable Hotspots’.
Wait 2ms.
Idle.
Testing-
Now you need to test your scene. Chances are something will break on your first attempt, but don’t panic. Most errors are due to the wrong index number, the wrong indentation for event commands, or having things in the wrong order. After checking for those issues, look through this tutorial again after a short break. If you are still having issues feel free to send me a message and I’ll try to get back to you soon.
Conclusion-
With this tutorial I hope I’ve shown you how to build a fun system for both the player and the game maker. It was quite a lot of work creating it, I think it took like a bit over a week of many hours a day getting it to work. It’s also the first (well sorta second) VNM system I’ve built and I’m pretty proud with the result, even if it can be a bit convoluted or not as crazy awesome as what some professional programmers can magic up. Thank you for reading and keep on the game make!
If you find any errors or feel like a section could use more clarity please let me know and I’ll attempt to fix it.
Made by Delsin7 for RPGMaker.net’s articles. Please don’t repost on other websites without contacting me first.
