GameMaker Studio 2.3 - Beautiful Inventory Series (One Long Video)

greetings and welcome my name is aaron craig with let's learn this together stick around to the end of the video to hear about the details of my giveaway that i'm doing on every game maker video and what i want to talk about is just how this series or playlist for making a beautiful inventory in game maker is going to work and how it's going to come out and what my hope for it is so if you're really eager and you don't care about this go ahead and skip i won't have my feelings hurt but what i wanted to do with this inventory and with this project was to make it as accessible to as many games as possible when you start getting into more advanced tutorials it becomes really hard to actually apply it to your specific game so i really went out of my way to try and break this up into searchable chunks so that's why these videos are coming out as individuals and at the end it'll come out as one long video if you prefer to watch it that way but my goal is to have each of these videos be searchable for one specific topic like how to add an item to a ds grid or how to limit the inventory size of your inventory the size of your inventory each of those subjects are individual videos because sometimes that's just what people need to see so that's how they're going to come out and if you don't have the patience to wait for all the videos then check out my patreon where you can get early access and support me for as little as a dollar a month so how this series is going to break down is like this we're first going to have a discussion about the core concepts of an inventory that's going to come up next and i'm really excited because i think it's a really great discussion and i really want to hear your feedback then we're going to start working on building the inventory one thing at a time we're going to build the base code for an inventory using a ds grid then we're going to be able to add items to it with one script or one function that you can then use anywhere in your game and then we're going to start displaying that master inventory list we're going to figure out how to do drag and drop inventories we're going to figure out how to use sequences to bring up a beautiful transition for a description of an item i'm going to show you how to lock down the size of your inventory so that you can increase it or decrease it as you want we're going to go over how to give every object every npc or player in your game a unique inventory so that you're not just using one because that's really boring and not very useful and then we're going to go over how to sort an inventory by different properties that one's going to be fairly complex but it's also going to be really useful especially if you have any interest in data structures or algorithms then we're going to be talking about that in that video a little bit to give you a good idea of how sorting works and the trade-offs that you have to take depending on the approach that you take yeah that makes sense right and then finally we're just going to wrap it all up put a bow on top of it fix any small problems that we might have and call it good and then you'll be able to use this system wherever you want change the gui change the sprites just modify where you draw things at and you'll be able to use it in any project and game maker that you want so i hope that's really helpful i hope you're excited because i've spent a lot of time on this and i think it's turned out really really well so give me your feedback let me know what you think and that's all i wanted to talk about so thank you for joining me greetings and welcome my name is aaron craig with let's learn this together and today we're going to have a discussion on the core properties of what an inventory is for the most part i just want to talk with you so that means that if you have any questions leave them in the comments below if you disagree with anything or you think that i missed something then let me know and i would love to hear from you but we're going to be designing a beautiful inventory here is what it's going to look like in the end [Music] and so we're gonna be making this inside of game maker and i'm really excited because it is an awesome inventory probably the most functional and beautiful one i've ever made and i'm going to share that with you completely for free you can download the project the link will be in the description below so you can just have at it but before we actually get into designing it i want to talk about what makes up an inventory because if you've played very many games at all that have inventories you know there are an endless variety of them about what they're supposed to do how they look what their functionality is and everything in between so how can i make an inventory that will actually be useful to you in your own game i don't know what you're doing i'm making something completely from my perspective how can i ensure that it's actually going to be functional and useful to you well that's kind of what we're talking about here because even though inventories look vastly different and every single one functions differently there are things at the core level that all inventories have in common and here's what i think they are the first one is to be able to actually see the items that you have in it that's pretty obvious right you need to be able to know what you have so whether that's through text or pictures or a combination of both you need to know what you have in your inventory now a game where you don't know what you have and you have to like remember that kind of becomes the game so i guess maybe that's the exception to the rule if your game is about remembering what's in your inventory but for every other game i think you need to be able to display it so we're going to be going through and i'm going to show you how to display an inventory with pictures and the text from it the second thing an inventory has is functionality or usability now this is fairly game dependent because if your inventory carries mostly consumable items like potions you're going to want to have quick keys and hotkeys to be able to use a health potion or a mana potion instantly when you're in a battle or whatever the case is but if your game is more equipment oriented you're going to want to be able to see everything and compare stats and know which one's better which ones are worse and maybe take your time going through that but whatever the case is you're going to want to be able to use it so i built in a way that we can actually call a script when we're on a specific item that way you can then use the item to either heal equip damage you can get rid of it anything like that we're gonna learn how to add items to the inventory so then from there you can learn how to remove them and use them and get at the effects and the attributes of every single specific item inside of that inventory a third thing that most inventories have in common is a way to sort them and that's because in games you usually acquire a lot of items now there are some standout games where specifically inventory management is part of the game like you can't carry too much thinking like resident evil 4 or something like that where what you have is a big part of how you play the game but for a lot of other games they just allow you to carry as much as you want kind of like skyrim you just stack up all those plates and gold coins and useless artifacts that you can find and stuff them in there but then you want to be able to sort it so i'm going to show you how to actually sort the inventory that we create which is going to be a ds grid and we're going to learn how to sort that by name by type by amount and by price and the really cool thing here is that those are just attributes that i have given my items but you'll be able to sort it by however you want so if your game has specific characteristics to items which i don't even want to try to guess at what they are you will know how to actually sort it by those things because i'm going to teach you how it works we're going to go through a sorting algorithm using a double for loop and i'm going to talk about the complexity and the space-time requirements and i'm making it sound really complicated but i'm just going to show you and talk about how it works so that you can do it on whatever items you have in your own game which i think is necessary when teaching how to make an inventory because you don't want to know how to sort by my item characteristics you want to know how to sort by yours so by the end you will know how to do that and then the last thing that really comes to my mind is the fact that you want every character to be able to have an inventory and that's the kind of system we're going to set up so we're going to have a master list of all the items you can have in your game but then you're going to be able to have every npc both maybe living or inanimate have an inventory so you can go up to a rock if your game allows it and you can trade with that rock you can sell you can buy you can do whatever you want because each object each instance in your game will be able to have an inventory and it's going to be really easy to be able to give them that so that's a really useful thing i think as well we'll have a reference that we go by to make sure that we don't put any items in our game that don't actually exist but then every character every npc every object will have their own unique inventory which i think is essential for any game with inventories because you'll want to trade you'll want to buy you'll want to be able to steal and you want each of them to have unique inventories so that's what i've got what did i miss what do you think makes a requirement for an inventory that's not on my list or do you just totally agree with me and i hit it right on the head i find that unlikely but i'll take it as a compliment if i did so if you're excited and you're ready then go ahead and jump right on in if you want to follow along i encourage you to download the start here project which has all of the items none of the code just the items and sprites that we're going to be using to save time so you can just start following me and by the end hopefully you will understand exactly how to make your own inventory as i explain why i choose what i do and how to do it so that you can put this into whatever game project you're working on stick to the end for details on the giveaway of my beginner games course all right let's go ahead and dive right in first thing we're going to do is create another object and we'll create an object and i'm going to right click and if you're in 2.3 then you can add objects to anywhere on the asset browser which is pretty cool it just takes a second longer to actually find what i'm looking for i'm going to call this obj items and what this is going to be is our master item list so this is going to have every single item we can have inside of the game it's also going to have all the properties we can have for items so i'm going to add a create event in here i'm going to go in full screen this so we can go to work so this is going to be our master item object and inside here we talked about what all items already have so we're going to go ahead and create that inside of code so all item properties the way we're going to be doing it is by using an enum and we're going to just call this item if you're not familiar with enums then go ahead and research that but for the most part it's just a way of listing things out with typed numbers so i'm going to type in something here called like name and when i access this later if i were to say item dot name i can do that with this kind of typing instead of having to do it as a string or just put in a number because every enum is just a number so this is zero that's what the first one is and then the next one is going to be one and so on and so forth we're going to be using these to add things into arrays and ds grids and so it just makes a lot more sense to use it as an enum that way we don't have to remember every single number of inside of like where the ds grid and which one the name is which one the sprite is and so on so the item is going to have a name sprite amount a type a price the object associated with it and the last one is actually just going to be for how many properties there are so name starts at zero height will be the last number and whenever we're creating things we start at zero but the enums like when we create a ds grid it kind of starts counting at one so we just max it off at the height here and that way we just always know how many properties we have because if you wanted to add in more properties if you had them you just put them underneath the height and then you'll always have the correct height in your ds grid and arrays which is pretty cool are you ready to start making the game of your dreams then head on over to less learners together dot com to check out my trilogy of courses to take you from beginner to expert game development is hard and frustrating when you're going at it alone and you don't have anyone to turn to join me on the journey and i'll be with you every step of the way to alleviate all of that frustration and by the end you'll be ready to make any game you can set your mind to go ahead and get started now at learnerstogether.com okay we're gonna add another e num here called type so in this inventory we're gonna have three kinds we're gonna have weapon armor and consumable your game will probably have more like quest items or something else i don't know there's an unlimited amount that you can do but we're just going to stick with the basic three we're going to be able to sort these and have different messages pop up depending on if it's wearable or if it's consumable so i'll show you how to do all of that as well then we're also going to have consumables that can cure certain ailments so an ailment is a bad thing such as being poisoned or if you're confused or maybe you're drunk maybe being poisoned and drunk are actually the same thing well they are the same thing but for this we'll say that they are different enum sort type this is going to be used when we sort our inventory so we're going to be able to sort it by several different ways name amount type price and then same thing here we're going to have a height variable so when we are sorting we're just going to actually be able to say sort it by whichever one it is plus one so to go from name to amount to type to price we'll check if we've reached the height and if so then we'll go right back to name you can add in specific kinds of sorting if you wanted to be able to sort by name and then they wanted to sort by price or something that would also be very simple i'm just going to make it so you can sort by these and it just cycles through them updated it there are no actual 2d arrays like it's all 1d arrays inside of 1d arrays but a ds grid is still going to be a 2d array and this is how it's going to look so we have the x coordinates which is this one here so 0 is going to be an item so and then we have another item over here and then the y coordinates are going to be the actual properties that we set up in the enum item so for the first item it would be 0 0 would be the name 0 1 would be the sprite and so on and so forth that's how we're going to design the grid now you can easily design it the other way but i'm not going to do that simply because i've set it up this way there's no real reason that i've done this besides i just needed to choose one and this is the way i'm used to imagining 2d arrays so it's what i've done so all of the properties like the functions we use for ds width and height if you change this around just reverse those and you'll be good to go all right now we need to actually make the master item list so i'm going to say global.all items equals ds grid create it's going to start with a width of 0 because the width is how many items we have and we start with zero and the amount of properties or the height is going to be item.height so there you go that's our all items list and so this is what we're going to put all of the master items in and check it against now i'm going to show you what it looks like when we add an item with a script but we're going to do that in the next video the reason for that is i want this series to be as searchable as possible so this was designing an inventory in code the next video is going to be adding items to a ds grid so you'll be able to find that very easily if you want early access to that then go ahead and hop on my patreon where you'll have access to the projects the videos and to me to ask any questions so we're going to create a function called add item to master list and looks like game maker 2.3 actually keeps track of functions that you've created in the past even when they're not in there this beginner project doesn't have any scripts it does not have this function but i've used it before and apparently it remembers even if i deleted it which is kind of interesting so it's going to look like this we're going to add in an array of properties like we did so the first one that's why i have this up here to remind myself is going to be the name so it's going to be small knife then it's going to be the sprite which would be spr knife we already have that the amount is going to be 1 the type is going to be type weapon then the price it can be any price you want i'll put it at 5 and the object is going to be obj knife we close that as an array close it up and then when we call this it will add this to our ds grid of all items and we're going to do some checks inside of this function to make sure that what we're adding is appropriate because if we were to come in here and add in another one right here we have no way of knowing that this is incorrect because we're just passing in an array but when we actually get into this function we're going to make sure that we have the correct amount of properties and that everything else is the way it's supposed to be otherwise we'll reject the item because if we tried to add it then our game would crash that's going to come up in the next video so i'm going to create a script right click create a script and i'm using 2.3 so a script here is actually a container for functions but if you're not on 2.3 that's okay just name this script the function that you want to use i'm going to name this inventory because i'm going to put all of my functions inside of here and for right now i'm going to rename this specific function add item to master list and i'm going to put a description inside of here add an item to master list now that's kind of redundant but at the same time it's always a good idea to get into the habit of using descriptions and parameters which is what i'm going to add next so the parameters here are actually going to be attributes this is the array of attributes to add and in 2.3 the function works like every other function in pretty much every other language so we can actually just type in attributes and that is what we can access if you're not on 2.3 you just say var attributes equals argument zero and then we're off doing the exact same thing after that so i want to show you some safe coding practices but before i do that i'll just go ahead and show you exactly how we're going to add this to the ds grid so if that's what you're here for you can do it the first thing we do though is look at the size of our grid right now i've created it at a size of zero because there are no items inside of it the way that i'm going to be doing this is always adding one two whichever one we're at so we have to resize our grid so that it goes up correctly every time we add an item and the function we use for that is ds grid resize so we're going to resize this and i am using my ds grid like this the x or the width of it is the items so i have this is what it looks like and the height are the actual properties that we're using so when we resize a grid we have to pass in the grid which is going to be global.all items we pass in the width and this is the new width so i'm going to say dsgrid width of dot global.all items plus one and then the width or the height of it is going to be ds grid height of what we currently have because we're not changing the actual height at all add two parenthesis because it's all wrapped up inside of a function and now we've resized our grid now we're gonna actually add to it so four of our i is equal to zero i is less than array length and if you're using not to if you're not using 2.3 then you'll use array length 1d we'll say attributes plus plus i and now all we have to do is just map each of the attributes of the array so each index of the array to the index of our ds grid which they should match up exactly because that's the way we have it designed so i'm going to say global.all items and this is the ds grid and we can actually access a ds grid directly as an array with the hashtag or the pound symbol and now we're going to always add the attributes to the item that we just resized for so ds grid width global.all items minus one so when we made it we created it with zero items so it wasn't it was it was not able to hold anything now when we resize we get how many items it can hold oh it can hold zero so let's add one to that now it can hold one item and that one item starts in index zero but when we call ds grid width now after we've resized it it's going to give us a one or two or three or however many items you have so we have to go back one because we just added that one to make sure we're in the right spot but you can't resize after because you have to have that slot available so it must be done in this order just go back to the one you actually want it at ds grid width returns starting counting at 1 but arrays and ds grids start counting at zero kind of annoying but if you understand that that's how it works then you can get around it and the attribute that we're changing for this item is just i because that's what's moving up all the time so close that bracket and just set it equal to attributes i are you ready to start making the game of your dreams then head on over to less learners together dot com to check out my trilogy of courses to take you from beginner to expert game development is hard and frustrating when you're going at it alone and you don't have anyone to turn to join me on the journey and i'll be with you every step of the way to alleviate all of that frustration and by the end you'll be ready to make any game you can set your mind to go ahead and get started now at less learners together.com and that will actually work so i'm going to put a breakpoint in here i'm going to open up our room and i'm going to put the item that we're working on right now which is obj items inside here so we can actually watch this work as it goes so i'll actually put it right here so we can see it get resized as well so i'm going to hit f6 now in here i'm going to pull this up here's our global variable i'm going to right click on it and view it as a ds grid that way we can actually see inside of it so right now if i try to expand it there's nothing there it has a width of zero and that means that it has no items like it can't hold anything but it does have a height of six if i press next now we have one item in here with six empty slots so let's go through and add those in so the first time you can see over here here's our attributes our local variable 0 is small knife so attributes 0 because that's what i is is small knife and we're going to place that here so i click next and it transmits it over you can keep going through and it keeps doing that for all of them and then when it's done well it's done so now we're all done and that's it that's how you add an array to a ds grid it's with a for loop and make sure you resize it beforehand unless you created your grid with the proper size now this is actually adding the item but what i want to also show you is being able to make sure that this functions exactly the way that you would expect it to so if we comment this out we forget to make it or anything like that and then we run this well it's obviously going to crash because we don't have that variable so i want this function to always work without crashing our game now when i say work i just mean it gets called and if it works then it proceeds properly if not then it's going to return gracefully and not crash our game so the first thing we're going to check is does the global variable exist so if variable global exists hey there's a function for that look at that we have to type it in as a string and we only type in the actual name of it not the global portion so we're going to type that if this is equal to false what i'm actually going to do is create it so then global dot all items equals ds grid create zero and then item dot height and that way now if it doesn't exist we make it so let's check again is the global variable a ds grid now we know that if it doesn't exist we make it and so that it is but what happens if somewhere else in your code for some reason you destroy it or you reassign it to something else if that's the case and that happens somewhere along the line after you try to add an item to that then you're gonna get an error and it will crash your game so now we're going to check to see if ds exists global.all items and it's a type of grid and if it's not so it doesn't equal that then we're going to set it to be that so global. all items equals dsgrid create 0 item.height so now if it gets through here and it is a variable but maybe it's something else entirely we're going to grab that and we're going to recreate it to exactly what we need it to be now this might actually cause more problems in your game than it's worth so you could also comment these out and instead just show a message that's like uh no variable found called all items and then return so you can try to fix it or you can just say hey something went terribly wrong here the code that you wrote before you you were supposed to write something went wrong and then you just return return will take you out of the function and not do anything after it's called so that's actually what i'm going to do here just to be on the safe side no ds grid found and the last one we want to check is going to be are the attributes proper so if what we pass in of the attributes isn't an array then we've got a problem and if we try to add it then we're going to fail because we'll try to access variable attributes which isn't an array and we don't want to do that or array length and again if you're not on 2.3 use array length 1d if the attribute's length doesn't equal item.height then we're going to do the same thing so we're going to show a message and then return so input for adding items isn't right so we want to make sure that it is exactly the correct size there otherwise there's a problem so let's test that out let's add a 10 to the end here and now that's the wrong number of attributes so it doesn't work and it gets returned but our game doesn't crash and that's exactly what we wanted so now we are able to add items to the master list in a safe way making sure that it's always going to work properly and if you wanted to you could set up a system here where if you call this and none of these properties are correct you could fix that and then you add it so different ways of approaching the problem i'm going to go with the approach that if it doesn't work then you've typed something wrong in your code and you probably want to go back and fix that and be told right away that something went wrong so that's what i'm going to do right here and that's all i wanted to do in this video in the next one we're going to take what the items that we've added and we're going to add more in the next video as well but we're going to take all of that and start displaying it in a ui in the inventory that we're actually going to have in our game now what we've got so far is a ds grid that we are able to populate with this function add item to master list and we pass in some data about that now we're going to start displaying some objects so i'm going to paste in some more feel free to download the starter project which has all of these sprites and objects and stuff that you'll need to get started it's all just empty for the most part just a lot of sprites like all of these items and all these icons that we're eventually going to use so i wanted to make it really easy to get up and going if you're using your own this is where our projects are going to start changing when it comes to the code because when you're displaying items like we're going to be doing with all of these that's all going to change based on what you have to actually move around so i'm going to be putting in numbers that are specific to the gui sprites like this inventory that i've got right here so it's going to be specific to this and nothing else so if you're using something else how we display it will translate over but the exact code will not first thing we're going to do is just review the room properties uh the room size doesn't matter i've just got this in here it's not a functional playable game it's just for the inventory i've got viewports and the first viewport enabled and i've got 640 by 480 and so it's a 16x9 aspect ratio and then the viewport is 1920x1080 so it looks like this i have a 1440p monitor so it doesn't fill my screen up but you can see that it looks pretty good and i like it so that's what we're going to be using we do need to make an object here so i'm going to make a new object call this obj controller i'm going to assign it a spr player sprite just because i can and then i'm going to put it in here make it a little bit larger and now we have that inside of there so it looks more like a game and that's really all we have to do when it comes to the room so i'm actually going to exit out of that now we are going to be using a couple of scripts when we are displaying things because everything that we display will be able to work with a camera that you have in your game because realistically you're going to have a camera so i'm going to make a new script i'm going to call this camera now game maker 2.3 scripts are actually containers for more functions scripts as you're used to them in previous game maker stuff so name your script whatever you want for each function i have you'll need a script but besides that not much of a difference and so here we're just going to say camera x and all i want to do is just return camera get view x view camera zero and what this is going to do is just save us a lot of typing because we can call this script and get this back which we're going to use a lot then we're also going to do the same for y and add a space up there and i'm sure you can imagine what we're gonna type right here view camera zero and then we're gonna do two more very useful ones camera middle x return camera x so we can use our own function right there plus camera get view width view camera zero divided by two make sure you put the parenthesis in the right spot there then we're gonna do the same thing for camera middle y return camera y plus camera get vue height this time zero divided by two so now when we need to get in the middle of something or when we need to get the origin of where our camera's at then we are good to go and so now when we need to get these they're very accessible if you're going to be doing things on the right side of your camera then you'd probably want to make camera right x and do that but i don't need to for this so i'm not going to okay let's go into obj controller and add a create event and a draw event because we're going to need actually we need a step event too so let's go and add that inside of the create event we're going to have a bunch of variables that control like how many item slots we have how far apart they are and the scaling of all of the items we're going to put these in variables that way we can easily change them if we decide to change the resolution of our game or if you want to start using a different gui you can come in here and it just makes it a lot easier so the first thing we're going to do is make a variable called my items and later on in this series we're going to turn this into our own ds grid because you're going to eventually want every character or at least most characters in your game to have their own ds grids as inventories but for now we're just going to set this equal to global.all items so it's going to point to that and again later on we're going to add in our own items and we're going to make a whole slew of scripts to be able to deal with sorting and adding and stacking and all of that good stuff but for now we're just going to use what we've already got the other variable we're going to need is is showing menu we're going to set that equal to false and we're going to come back and we're going to have a lot more but for now that's enough let's go to our step event so control menu we're going to add an if statement inside of here and just check to see if keyboard check pressed ord m then is showing menu is equal to true and that way we can bring up the menu now when we are showing the menu in our draw event that's when we're going to draw everything so if is showing menu this is where the bulk of our code is going to go inside of our draw event there's going to be a lot here are you ready to start making the game of your dreams then head on over to leslearnesstogether.com to check out my trilogy of courses to take you from beginner to expert game development is hard and frustrating when you're going at it alone and you don't have anyone to turn to join me on the journey and i'll be with you every step of the way to alleviate all of that frustration and by the end you'll be ready to make any game you can set your mind to go ahead and get started now at learners together.com so the first thing we're going to do inside of here is draw a background so that our looks like our game is paused here you probably actually want to pause it uh so you probably actually pause it here but you know whatever we're gonna say draw set color to black we're gonna set the alpha to 0.75 and then we're going to draw the rectangle so draw a rectangle 0 0 room width room height and false it's not going to be an outline we want it to cover the entire thing and now we're going to come down and draw the back of the inventory so this is what the inventory looks like complete and i have broken it down into two so we're going to have the front or that's that's the front we have the back which is this it's the bulk of it but you can see that there's lots of squares and that's how their inventory is actually going to work and function and then we have the plate on top of it so we're going to draw this one first and then we can put our items here and they can fill them up pretty much exactly and then we can put this over top and that way we can have our items look like they're rounded because that's what this is but we don't actually have to have our item sprites be rounded so we're going to draw sprite spr inventory backdrop and it's going to be 0 for the sub image and then we're going to do camera x plus 175 and camera middle y and we want it to be right in the middle so that's all we have to do for that now if we give this a run and i press m well that's kind of working except that we forgot to change our alphaback so i'm going to copy this put that right there set that to 1 and try it again now our inventory will show up completely and we have a nice black filter on the back of our game so that's awesome now we also want to draw front of the inventory so we're going to draw a sprite spr inventory front 0 camera x plus 175 camera middle y plus 20. so we have to have that in there because the front of it uh it doesn't match up perfectly there's some extra stuff at the top but now if we run it you can see our front lines up right there and now we are able to draw everything inside of here which is what we're going to do we're going to draw this i'm just going to go ahead and full screen this code and now we're going to draw all of the items inside of a for loop but before we can actually do that we need a few more variables here so we need to consider a few things and that is the separation here between the items how many items this can hold because if you have a different sprite and you can hold you know only four in each row but more in columns then this is going to change as well so we're going to make this as flexible as possible by adding in some variables here that you can easily change so i'm going to say menu width equals 6 menu height is equal to 48 item separation is going to be equal to 38 and item scale is equal to 2 and that's what we're going to need for this now the item scale and item separation kind of go hand in hand so if you change the scale you'll have to play around with the separation because there's more or less the item icons that i have the item sprites are only 16 by 16 so i'm going to bump them up a little bit and make them look and fill the entire slot there so now let's go ahead and draw them so i'm going to do a for loop i is equal to zero i is less than our ds grid width of my items and then plus plus i now we're going to eventually draw them in different rows and columns so we're going to change things up so i'm going to make it easy by setting some local variables at the beginning of our for loop i'm going to say var item x equals camera x plus 81 plus and in parenthesis i times item separation and then var item y is equal to camera y plus 111 and the sprite we're drawing is equal to my items hashtag i item.sprite this is how you access a ds grid directly without using its functions now we can draw sprite ext it's going to be the sprite we want the sub image is zero item x item y the scale is we already set of item scale for both and then zero c white and one now press f5 and that's really all you have to do to be able to draw them but we have a few extra at the end here the reason for that is we have more than we can hold so what we have to do is add some checks check for additional rows needed if i is greater than or equal to our menu width and it's less than menu width times two then we know it needs to be on the second row we can add more if statements for depending on what i is and draw them where they're supposed to be but since we've already figured out we have variables here to show we're supposed to draw x and y we can just change those so item x will now equal camera x plus 81 plus we're gonna do two parentheses here i minus menu width times item separation and item y equals camera y plus 147. we just need to move them up down we need to move them down by 36. now if we run this it will work perfectly fine so there they are so you can see that we can do that for as many as we want for as many rows and columns as we need and that's displaying the items that we have available now there probably is a fancy math way of checking this depending on what eye is supposed to be if you've got that feel free to throw that in the comments but part of what i really want to do in general but also with this series is make it approachable for anyone who needs it so if i had some fancy math formula right here like it might be too complex for them people to take and use in their own projects this is very simple all we have to do is add another if statement here says if i is greater than now menu width times 2 and i is less than menu width times three well all we have to do is alter the item x and item y by a little bit and then the third row will then display properly so the goal of this is to make it so anybody anytime can use it and that's all i've got for this video that's what i wanted to do is just display an item display an inventory from a ds grid and that's what we're doing the next thing we're going to do is bring up a fancy transition to show the description and bring up more details on our items now i'm going to do that with sequences so if you have 2.3 which you definitely should if you can do the sequences let's go ahead and come into our project and we are going to make a sequence so i'm going to right click and create sequence i'm just going to name this sq description animation and then in a sequence you can actually put in anything you want you can do sprites sounds objects then you can replace all of those within game assets as it's running there's really very little limit to what you can do with sequences but we're going to try and keep it fairly simple here so i'm just going to drag the sprite description onto the sequence and immediately you can see that it shows up right there if it didn't show up then that's probably because for some reason when you brought it in your tracker down here was at a different place than at the beginning so this right here is our sprite in our sequence and you can only see it while it is available while this line is in the right spot so you can drag it all the way up and i'm going to put it at 40 frames and then i'm going to bring this sequence length down to 40 frames so now if i press play it plays for 40 frames which is what we're going to want now there are several things in here that are good to know the first one is the actual size of our sequence which in reality doesn't really matter now our room that we've got in our game right now is 704 by 576 and our camera is 640 by 480. so we don't actually need to change the sequence or the canvas size over here but i found it to be fairly helpful just so that we can kind of eyeball where it's supposed to be if we change this right here now i know i'm eventually going to want this to be closer to right around this this side of my screen because that's where i want it to appear if our canvas was a lot larger it'd be a little more playing like animating it over and over again in the room to make sure it's in the right spot but if we do this i know it's going to be pretty close to where i want it so that's what we're going to do now down here on the timeline everything is controlled by keyframes and if you've done any video editing or used any of adobe's software then you're probably familiar with keyframes and the power of them essentially it will record a property at a specific frame and then translate between property a and property b when moving between those frames so in the beginning if i set this right here in the middle and i go up 20 frames or however many i want and then i move it again now there's another keyframe right here and when i go between these it's going to move between them just like that so however much that distance is it will travel you know 1 20th of that distance every single frame until it gets to where it's going and you can add as many keyframes in here as you want and you can kind of actually see them visually in there which is also really really cool so i'm going to control z take those away because all i want to do is actually move it from the middle here and at frame 40 i want it to be all the way over here now we're going to do more than just do this because that's kind of boring but essentially that's what it's actually going to be doing now we also want to change the scale or how large or how small it is so i'm going to come down here and actually add a parameter track so you can control rotation color multiply image index image speed origin and scale we want scale now if yours is not recording changes that's because you have automatically record changes off so you can take that off and then manually add and delete keys i find it a lot easier to just automatically record them so that's what i am going to do so let's go back to frame 0 and on the scale i'm going to actually come down here and i'm going to shrink this down to zero so you can either shrink it manually which you can do or you can come in and control these properties and set them to zero to zero so now it's right there and it's it's exists it's just so small you can't actually see it but that's okay because we know where it is and what i want to do is when we get to frame 40 i want it to actually be full sized so i'm going to change it back up to 100 by 100 now it looks like that but that's kind of boring it gets the job done but the really cool thing is that you can start doing some really cool animations once you figure out how to use animation curves i'm going to click on the scale and i'm going to come over here and i'm going to right click and convert to an embedded animation curve so now if i double click on it you can see that this animation curve well it's got properties here of x and y which aren't exactly correct it's actually going to be the scale so i can rename this to width and height and that's actually what it should be and even though you can only see a red one there's also a blue one here so that's going to be our width and our height so now we can change these and add more as we so desire and this is where the power of it comes in so this is going to allow us to do really fancy and cool animations just by clicking and not having to do code so i'm going to add some animations to kind of match this to what i had before i'm probably not going to be able to get it exactly but that's okay so i'm going to click here and i'm going to click right there and now we've got this and i actually want to change these to be a little bit smoother so i'm going to click on the curves up here the curve type and change it to smooth and now all of a sudden we can see that it kind of smooths out which is what it's supposed to do and it allows us to play with it i think in a little more natural way so i'm going to give this a bounce so what i actually want to do is i'm going to scroll up and this max value right here is is 100 or it's what it is naturally so if you wanted to actually make it larger in the end you can just bring this up more but i'm going to leave that there instead i'm going to add another point right here and i'm going to bring this up a little bit so that when it gets here it's actually going to be slightly larger than what it was before i'm going to click on a point here so that it kind of does it nice and slow and then we can zoom out and see the whole animation curve so now if we come down here and i press play you can see that it kind of does that and it looks a lot cooler so we can play around with these and move them as much or as little as one wants and this is where you can really start getting the power and specific flavors of animation depending on what you want to do and how flashy you want it to be so this is going to be fairly simple i'm just going to keep that right there i think that's totally fine so now i'm going to exit out of that so i'm going to come down here and click on position and right click and i'm going to actually set this to an external animation curve just to show you this so i'm just going to create a new one and it makes it where does it actually add that right down here i'm going to put this inside of my sequences and just name this am position it doesn't really matter but the power here is that you can create one animation curve just like what we did for this and you can turn this into a file that then you can assign to every well really anything else you want so you don't have to recreate the animation curve every time you can just set it as its own file and then if you really like one animation for projectile or a death animation or something like that you can just apply that animation to all of them which becomes really powerful now as an external file we can actually open it up over here and it i mean it looks exactly this the same there's really nothing different about it the curve type here starts as smooth but that's really about it and then we can add more of them but i don't actually want to use an external curve right here so i'm actually going ahead and delete this so then i'm going to click on position are you ready to start making the game of your dreams then head on over to less learners together.com to check out my trilogy of courses to take you from beginner to expert game development is hard and frustrating when you're going at it alone and you don't have anyone to turn to join me on the journey and i'll be with you every step of the way to alleviate all of that frustration and by the end you'll be ready to make any game you can set your mind to go ahead and get started now at let's learn this together dot com position right click and convert to embedded animation curve and now you can see exactly how it looks now i kind of want this to get here a little bit faster so i'm going to take my x position and move that up so it gets there kind of immediately that way when we play it now it's already moved all the way over and so when the y is changing it looks like it it just it looks a lot better in my opinion so that's kind of what we're going for right there so we've got a 40 frame animation inside of our sequence that i think looks stellar now we need to actually put this into our game so let's open up our obj controller and check out our draw event so when we actually click on something we want this sequence to appear so we have to first figure out how we can click on something and the way we're going to do that is by using the function point in rectangle so check if mouse is hovering over an item i'm going to add some enters here all right if point in rectangle mouse x mouse y and where we're going to check is inside of our for loop here and we want to check our specific item and fortunately we already have variables for exactly where that item x and item y is and we're drawing it at 2x scale which we already set here and we know that it starts at 16 by 16 so that means that it's now 32 by 32 so if we want to get all around it we need to go out by 16 on each side so for the first x i'm just going to say item x minus 16 then item y minus 16 item x plus 16 item y plus 16. now if we are hovering over something let's go ahead and show that so i'm going to set our alpha to do 0.25 i'm going to set our color to see blue and i'm going to draw a rectangle over whatever we're hovering and we're going to draw it at exactly this place too so i'm going to go ahead and copy that then we need to add in a false because it's not just an outline and reset the alpha to 1. all right let's try this if this works which it should we can now see exactly what we're hovering over and now that means we also know when we are clicking on something because we're inside of there so inside of this whole if statement right here let's go ahead and clicked on an item so let's say if mouse check button pressed so we click mb left and showing description is equal to false now we don't actually have this variable yet so i'm going to copy it come over here and we're going to add this in and it's going to be equal to false starting out so this will just tell us when we are actually showing something uh the the description or not and there we go don't add a colon at the end of an if statement so if we click on it then we want to start showing it and we made a sequence already so now all we have to do is just play that sequence and when we play it we use the function layer sequence create and this actually returns whichever sequence that we played it returns that id so we're going to need to store that id to then check to see like where it's at how it's playing and we can also see if it's done playing because when it's done playing that means we actually want to start drawing the item info on that description sheet so we will say sequence equals and we need to actually have this be a variable not just a local one an instance variable so i'm going to go ahead and say sequence equals undefined so it doesn't equal anything to start and then as soon as we actually do create our layer it will fill it up and then we can check to see if it's done playing at that point so we need to create this on a layer so in our room we have instances and we have menu items what i'm going to do is actually create it on instances because our menu items is going to be drawing stuff over top so it needs to be on the layer above it so create it on instances and we're going to create this right in the middle camera middle x camera middle y and then we have to give it that sequence that we have so sq c description animation now an important thing to note about sequences is that when you make it this right here and i guess it doesn't get larger as you zoom in this is the origin of the sequence so if we move this the sequence itself is going to play exactly the same but in our level now this is where it's this is the actual x and y of where the sequence comes in so i'm going to control z that so if we put this right here in the middle then it's going to behave properly and we'll know exactly how it works if we start putting things over here it's going to get kind of wonky so just remember that this right here is the origin of your sequence so in our room we're going to put it right here in the middle and so it should appear on the right hand side just like we've set up there so now let's go ahead and test this out we should be able to click on an item and have it show up awesome if you're following along in the downloaded project you shouldn't have an issue but i did notice that i have two layers which we haven't used menu items at all but for some reason my objects were actually inside of menu items and that was causing a semi glitch so just remember that and i also forgot to add a draw self at the top here so let's just do that real fast okay now we've got that i think a sequence looks slightly too like it's down just a little bit too much but that's okay because we can easily change that so if i wanted to alter the properties i can change the animation curve or i can just come in here and i can move it up if i've got automatic tracking on then it's going to move for me and i can open up that curve and see again right there so now it's it looks like that so if i press play i still think that looks really nice and there we go and if we wanted to make it a little bit smaller at the end so that it's not as large or maybe it's like a smaller version of it you can also just come in here and drag these down and it will make it smaller overall so if we do that let's try it again there we go so now it's closer to the middle of that it's a little bit smaller and i'm gonna move it down just a smidgen again okay that's our sequence that's putting it in and that's being able to actually animate it and get it inside of there no problem now the other thing we have to make sure of is when we're actually done animating we want to then start showing information and right now we have what we need to do it but we haven't done it yet and i think that qualifies as part of this video so let's go ahead and do that we have our sequence instance variable here so now we're going to go into our step event and we're going to check the animations here so i'm going to say if sequence doesn't equal undefined that's the first thing you got to check because if it is undefined and you try to access anything about it then it will crash your game so if it's not undefined and layer sequence is finished we just pass in sequence one more time so we can check to see if it's finished immediately and then if it is then we're going to say showing description is equal to true so now we'll set that equal to true and we'll just do a quick show message here as well we'll just say hi so we can check to see when it is finished and voila and it's just always going to be finished now so there we go okay so now we know when it's done but how do we get rid of it and how do we replay this sequence in reverse order because we could make a new one and then start that but there's also another way of doing it which i think is actually a lot easier and works a lot better especially if you want it to reverse animate out the same way that you brought it in so let's go in and down here we're going to check to see if we click on the little x of our uh can't press spacebar there if we click on this little x we want to reverse the animation now this is going to be a little tricky because we're going to use the point in rectangle and although i have a project i'm following from i'm probably didn't get the exact x and y coordinates here so i got to play around with this a little bit but i'll also show you kind of how i figure out how to do that and then you know how to change this up as well really easily so i'm going to go ahead and draw a rectangle and see if it is right around where the x is at so i have some properties here which are going to be camera x plus 590 camera y plus 30 camera x plus 620 and camera y plus 90 and false and the only reason i'm not using camera middle x and y is because i didn't do that originally and trying to convert it in my head would take a while so that is fairly close i'm going to bring in the x let's say about 580 camera y 35 to 70. and if we do that that should be pretty close to the x if anyone clicks up there i think they're clearly trying to close it and that will work fine so i'm going to copy these coordinates that we just did right there now we're going to say if point in rectangle paste in those coordinates but then we also have to put in the x and y so we're going to say mouse x mouse y so if we are doing that if the point in rectangle is equal to true uh and if mouse check button pressed and be left then this means they want to close it and now what we actually want to do is reverse our animation our sequence so layer sequence head direction so this is where the this is how it plays normally it plays left to right and there are different play modes here as well so we can change the playback mode to repeat or to ping pong to go back and forth but if we did that then we'd have to manually check to see when we're at frame 40 and stop it so i don't want to do that instead i want it to stop on its own and then when we want to close it we're just going to say hey play this sequence again and even though you are finished we're going to change the direction from right from left to right to right to left and that means that now it's at the it was at the end and now it's going to be at the beginning of it and then we're going to just say layer sequence play that sequence and we are no longer showing our description so we set this equal to false and that's actually all we have to do we have to do one more thing to make sure we can play it again but now if we come up here and close it it replays it if we click again it's finished because it's playing from right to left and so it's at the end of that play style and so let's come into our step event and we need to make two changes here we also need to add in a check to say if we are the direction of left to right because otherwise this variable's not going to be showing up the way it should so if so and all of this layer sequence get head directions now we want to know which way it was for this sequence is equal to the normal one so if that's true then we just finished animating in otherwise i'm going to just copy this whole thing and just change this to left because if that happened then we just finished animating out and we want to say layer sequence destroy so we're just going to get rid of it we could just go ahead and reverse it back to the other one but if we destroy it the next time we create it it will come in properly so now when we run this we'll be able to animate in and animate out and there we go so this is a long video but that's because i'm also showing you how to use sequences once you understand the power of sequences which hopefully you do now you can easily create one in just a minute throw it in your game and have complex beautiful and awesome animations right then right there so that's really cool now we have this up and running this is kind of the part of the flashy beautiful inventory that we're working on i think it looks really awesome i hope you do too and i hope that you really play around with the sequences and get a feel for what you can do with them and how they work these are just the tip of the iceberg when it comes to the functions that you can use in sequences so continue to check that out play around with it and have a great time but that's all i wanted to do in this video now we're going to go ahead and create one more object and this is actually going to be the item parent so i'm going to say obj item parent and i'm going to create and all data so inside of the item parent we're going to have all of the things that there could possibly have and that means that there's going to be a fair bit so i'm going to full screen this and the things here i'm going to set to undefined to start that way if we have an error we'll know that we didn't we forgot to set it in that specific item and we'll be able to go back and change that real easy so something we're going to want is a description and i'm just going to go ahead and copy i'm going to copy this whole equals thing so i can just type out the name so damage equals undefined defense equals undefined health restored these are all properties that this game's items could potentially have the more properties and things that you want your items to do you can just add them right here i'm not going to cover actually using these items because that's very game dependent but i'm going to show you how you can set it up so that you can start to use them so ailments wait ailments cured is undefined uh we can also have things like a speed boost i don't think any of mine do i'm just showing things that your game might possibly have mana changed energy changed and then they're going to have some specific drawing data so things like our type name and price so these are things that actually get set in our ds grid and we're going to set them for the item when we create it the other thing we have to know is if we are in our menu which is going to be false and if we should be showing our detailed info which is also going to be false to start now where we're going to be drawing all of this is on our sprite which is our description so we actually need to figure out how much we can draw from side to side so we want to eliminate a little bit of the edge here and a fair bit of the edge over here so in our item parent we're going to have our text width equals sprite get width spr description and we're going to subtract 60 from that and then we're also going to eventually be drawing some icons and we're going to draw them at 0.4 scale so i'm just going to put that there for when we do start drawing the icons and that's all we need for our item parent in the create event so let's go and actually create some items here now there's i'm not going to do all of these items because it could it could take a very long time so go ahead and do these yourself i'm going to do a few of them just to show you that they are working so description here specific item attributes first thing you need to inherit the event and then we're going to set them here so the description equals legendary armor worn by an awesome hero and then the defense of this is going to be a hundred health changed equals 50. i'm setting up so that if you want you can also do like negatives so if it's something that is a detractor it would be a negative value and that would still work totally fine but the changed value means that it's giving that to you or taking it away so here the energy change will actually be negative let's do negative 10 because it's so heavy so actually yeah that's all we'll do for now we don't need to do a whole lot more than that we might add some more later or i'll just bring in some objects so that we can do it but i don't want to waste too much time on that the other thing is we need a draw event inside of here now each item is actually going to be taking care of the draw event so we need to put it in the parent and then we don't want to do anything in the actual specific items we're just going to have them inherit that but to make sure that they do inherit it let's go to item parent parent and we can actually just drag all of these into the children category which is really cool so now each one will take care of that itself so let's go back to the drawing now are you ready to start making the game of your dreams then head on over to less learners together dot com to check out my trilogy of courses to take you from beginner to expert game development is hard and frustrating when you're going at it alone and you don't have anyone to turn to join me on the journey and i'll be with you every step of the way to alleviate all of that frustration and by the end you'll be ready to make any game you can set your mind to go ahead and get started now at learners together dot com and the first thing i want to do is draw self most of the time you're not going to actually see this but we are going to implement some dragon drag and drop inventory management so we're going to need to make sure that we can actually see the item when we need to be able to see it now this is info for when displaying description sprite so if is showing info is equal to true then we're going to do that and then we're going to have another one down here and this is going to be the price and this is always going to show up when we do this so if is and menu is equal to true and i'm trying to format my if statements a little bit different but i keep forgetting so this one is going to be the price so we're going to set the color here to see orange because they don't have a gold we're going to set the font which we haven't actually made any fonts yet so we're going to have two fonts we're going to have a smaller one and a larger one so i'm gonna go ahead and create a font font smaller and this is actually gonna be a fairly small font because our game window is so small we're blowing it up a lot this looks pretty small but it's going to be totally legible i'm going to go ahead and choose mana space because i really like this font it's like old retro gaming it's pretty cool looking i'm going to create one more font font larger and we're going to choose mana space one more time and this one is going to be size 12. so not a lot larger looking but it still is a fair bit so that's the two fonts we need let's go back into the draw event so now we're going to set the font smaller fonts matter makes total sense then we're going to draw the text of the price so draw text ext camera x km ry plus 390 name plus and then we're going to say is worth surrounded by spaces plus the string of our price variable plus space gold each and then we have to and then we're going to also draw the separation so this that's the whole part of extended so now we can set the separation like each line should be separated by how much and the width so the separation here is actually going to be font get size of the font we're using times 1.5 then the separation we're using is sprite get with spr inventory front minus 20. so not the text width over here because that's going to be for the main description this is actually just happening on the front of our inventory now we haven't actually created any objects yet so let's go ahead and move into actually the obj controller here and we're going to come up here above clicking on an item we're going to say draw item info now if instance exists and we have which item it is inside of our ds grid so we can actually just check to see if that exists so my items i item.object is equal to false so if it doesn't exist we're going to create it and then allow it to draw things this also takes care of the whole depth issue which can be a big problem if you're trying to draw on the same layer which is why in our room we're going to have two layers and this one is at depth 0 and the instance is at 100 so everything drawn from the items which we create like this current item equals instance create layer and we're going to do this outside of the room and we're going to make it on menu items that way everything it draws is above the instances layer we're doing it at my items the object we're creating is my items i item dot object now current item here we're gonna make this variable down here or up here current item equals undefined and now we just need to set some of the properties for the item we made so that it knows what to draw so current item dot price which we set equals my items i item.price current item dot type equals my items i item dot type and this will be useful for when we are drawing the button of either to equip the item or to use the item now type turns red because it is now a keyword but it's also it's a constant for when you're using sequences but it doesn't cause an error when you're doing this but you should probably change this to something else in your actual project just in case down the road they do make it more of a keyword that you're not allowed to use so just keep that in mind current item dot name is also now a keyword so you got to be careful with that one too but i already have it working in here so i'm just going to keep on using it so item.name and then we just set item dot is and menu is equal to true and if we are showing a description when we create this item then we tell this item that we're doing it current item dot is showing info equals true and now we are just about ready to do it you may have noticed a small mistake i made i actually put the drawing info for the item parent inside of the obj items so i'm going to right click cut that event out and i'm going to place it inside of item parent where it belongs and now if we run it we won't get an error that we're trying to draw a non-existent sprite and now when we hover over our legendary crystal armor it's right there so as soon as we go away from it though we have a problem because none of the other variables are set on any of the other objects we create and that's because we need to actually set event inherited on all of these so event inherited copy that just going to come in and place that on each of these so that we don't get a crash now if we do try to draw info or anything else on any of these objects then we're going to have a problem but we should be able to come in and at least move around on these so you can see that it's starting to pile up and that's because we need to actually destroy the objects as soon as we're done with them so we come over here we create them all of that is fine but then as soon as we leave we want to either destroy it or if we're making another one make sure that we only ever have one so right down here i'm going to say ensure only one item exists at a time so if instance number of obj item parent is greater than one then we're going to destroy all of them and that is fine because we can destroy all of them and then we're still hovering over that object that we just created and it will make it again so it's totally cool now let's try it again we hover over this and there we go so now each of these actually have their own price and we can see that it's working just fine and if we come off we don't have any errors everything works great if we bring this up nothing happens because we don't have any drawing information for it yet so let's go ahead and do that next let's open up the item parent draw event we'll go full screen here so we have it when we're drawing just in the menu now we want to actually draw some info over here as well first thing we're going to do is the name so we're going to set the font to font smaller we're going to set the color to red then we're going to draw text extended this is going to be camera middle x plus 60 camera y plus 120 the name that we have separation is going to be 20 and the text width plus 15 because it can go a little bit further than the description can let's try that out so we should start seeing the name of the item open this up and there's nothing here but if we move over oh there it is look at that okay so it didn't appear right when we wanted it to and the reason for that is because we're not actually setting that we are showing info on the item that we make the sequence start so let's go into our controller so we create a sequence when we click on it but by that point the item's already made so that means we need to actually do current item dot is showing info equal to true in our step event so i'm going to copy that and at the end when we are showing description and so we can just say if instance exists obj item parent is equal to true then we set it equal to true because remember this actual if statement is going to continue to trigger unless we were to destroy it or make it so that a sequence was undefined or something like that but that's okay we want the sequence to actually stay there we just need to make sure that we aren't trying to set something that doesn't actually exist and now if we run it it should work exactly the way that we expect it to we click on an item and then it starts showing the name perfect that's what we wanted i think we can move it down just a few pixels but that looks pretty good so i'll move it down 125. okay now we'll do the description so we're going to do pretty much the same thing we're going to set the font here this time it's going to be font larger we're going to set the color to black then we're going to draw text extended camera middle x plus 60 camera middle y minus 75 our description 20 and text width now up here i'm also going to set draw set alpha to 1 just to make sure that these always come in properly so there's a lot that we can draw in here but i'm not going to do all of these by hand because i think it's a little bit too much you can see that these are drawing undefined because we haven't set them but these are coming in correctly and i think that looks pretty cool so i'm going to go ahead and copy over the attributes and just kind of walk you through them because i feel like it's just too much and it would be a little bit waste of time because once you do one that's pretty much the exact same thing so what we're doing on these attributes is drawing a sprite which is an icon at a place i think called gameikons.net and they are just really great icons for free you can use in any of your projects they come in 64 by 64 sizes which is why we're drawing them at a 0.4 scale so we're drawing the icon and then we're going to draw the text next to it because i think visual indications register a lot faster for a player than just reading a bunch of text so when we hover over our armor it is clearly showing that it does it provides you a hundred defense now the rest of these don't have anything but that's okay we haven't set them up yet and then we just do that for each one so damage defense health restored mana restored and you can keep on adding more these are all if statements because we want them all to trigger because they can have multiple properties the other thing that we have in here is the ailments so i'm going to come down here our items can actually cure multiple ailments and the way we can set that up is by going into let's say the blue jelly and let's come down here let's give it a quick description uh mana restoring elixir so it can do that but it can also cure ailments and what we're going to do is have this as array a list of elements it can cure so let's just go ahead and give it all of it so it can cure poison drunkenness and confusion so it can do all of those you pass it in like that and then this system goes through it draws a sprite for each ailment icon or shows a sprite for the ailment icon and then for each one in that array it draws what it can cure so let's take a look this jelly can cure each one of those which i think is really really cool so you can have as many ailments cure as you want or you can just do one or two it doesn't really matter and then the last thing after ailments is going to be the buttons so we have armor weapon and consumable types so i'm going to draw a sprite right there depending on which one it is and obviously you can have a lot more types than that but for here you can see there's our equip and there's our used ones i think it looks like it i don't know we set up the type already in the ds grid so each one of those is actually working exactly the way we would expect it to now currently it's really hard to actually come down and be able to click on this and if we click on it it doesn't do anything but we're going to set that up later to where we can actually lock an item in here and then we can hover over stuff and it doesn't change it which then makes it a lot easier to use but that's just being able to actually draw everything that we want on there and there you go that is drawing everything i know i went over this really quickly but you'll be able to download the finished project from the description so you can just grab that and compare it but you'll probably want to actually draw your stuff instead of mine anyway so there you go and that's all i wanted to do that is the system we're using to display information and i think it works really well i haven't really come across any bugs or problems in it yet so if you do let me know otherwise i think this works great for any inventory system you want to do to be able to show information from specific objects let's go into our item controller and inside of the draw vent we're actually going to do pretty much everything inside of here so we've already got a bunch but i'm going to try and show you just how to do a drag and drop system if that's what you're interested in so outside of our point and rectangle system is where we're going to implement this now the only thing we have to add inside of here to be able to know which one that we're currently on is a variable current item slot and we're just going to set this equal to i because whichever one we were in when we're in this rectangle this is the one that we're going to begin by dragging over so that's what we need to know uh which one it is first and we don't have that variable set anywhere else so i'm going to go ahead and say current item slot equals undefined when we start okay now outside of here dragging system okay we're going to check to see we're going to use the middle mouse button here as well so if mouse check button mb middle so while we have the middle mouse button down we're going to say dragged item equals instance find obj item parent zero and that's because we're actually creating our items and that's how we're actually displaying them as well so if you if you're not creating it yet then i guess you could just draw a sprite over here instead but i'm actually going to create the item and set it on this so then dragged item.x equal to mousex dragged item.y equal to mouse y dragged item.visible is equal to true drag item dot image x scale equals our item scale to make sure it's the same size and the image y scale and we're going to set dragging item equal to true so let's go ahead and create this variable and dragging item here as well so dragged item will start as undefined and dragging item will start as false so while we're holding it down we can move an item around let's go ahead and give that a try we should be able to come in here and if we're holding middle we can now move this item around we do have a slight problem where as if we're holding this down then it actually changes to the next item that we're on and that's not really what we want and if we leave it there it kind of stays so we have a couple of things that we have to add here the first thing we have to do is not create new items when we are dragging an item so up here when we are creating an item we want to add a check so we are going to say and dragging item is equal to false so because dragging items becomes true we should now not create a new item when we are hovering over it there we go and you can see that the text down here doesn't change and so that's what we want now we've got that and that looks really weird so let's go ahead and move on to that next thing so we're not creating it now we want to when we release it we want to change places with an item if we are hovering over an item that we can change with otherwise just reset everything back to the way it was so we're going to say if mouse check button released mb middle then we're going to move the dragged item outside of the screen so we're going to put it to negative 100 on both of these equals negative 100. and dragging item is now false and we're going to set alarm 0 equal to 1 because we actually need to know which item we are hovering over which is going to become our current item slot so when we release it we want to change the current item slot get that and then we're going to use it the other piece of information we need is which item we're actually dragging now we could do a complex script of finding the object index that we currently have comparing it against our grid and so on and so forth but i'm just going to say when we click the mouse button the first time so mouse check button pressed so this is a one-time event which is what we need the first time we click it we're going to say dragged item slot equals current item slot and we don't have this variable so let's go into the create event and set this equal to undefined to start now the first time we click it we'll save it and then when we go to change it current item slot will be the one underneath dragged item slot will be the one we're carrying and we're just going to do a swaparoo and we'll call it good are you ready to start making the game of your dreams then head on over to lesslernestogether.com to check out my trilogy of courses to take you from beginner to expert game development is hard and frustrating when you're going at it alone and you don't have anyone to turn to join me on the journey and i'll be with you every step of the way to alleviate all of that frustration and by the end you'll be ready to make any game you can set your mind to go ahead and get started now at least learners together.com so let's create the alarm event i'm going to open up obj controller i'm going to add alarm 0 i'm going to drag this into here so it can be full screen as well and we're just going to say swap items and here is where kind of the complexity comes into place so i'm going to walk you through it as we go along the first thing we're going to do is create a ds grid because we're just going to take all the properties of that item which are stored in a ds grid and put it in a temporary grid so i'm just going to say var temp grid equals ds grid create it can hold one item and it's going to be item height because that's what they all are then we're going to say save the item we're hovering over to temp whenever you are swapping places with anything you have to have a temporary container for one of them it doesn't matter which one you do but because we're going to take one item place it and replace it we have to make sure that we know what the data was for the one that we replaced so i am just going to save the item that we're hovering over and then we're going to take that item put it in there and then replace it so there's a function for this when you're using grids which is kind of confusing but also can save a lot of time and that's called ds grid set grid region let's go ahead and take a look at their manual because i think it does a fairly good job so we're going to go from one grid to another which is the index and the source so the index is the grid that you're going to the source is where it's coming from and you just set where and how many cells you're copying and then it will just copy those from the x and y coordinate you do so you can see here that we want to copy six cells and we tell it start copying those cells at one and one over here and so it just copies those over now that's a little confusing and i still get this messed up from time to time i have to try it over and over again to actually get it right but it does save a whole lot of time because you can just do it in one function so we are going to save the item we're hovering over so temp grid is where we want to put this information and it's coming from my items and we're going to do current item slot 0 so we're starting on the item we want on the x position we're starting at the top of the attributes because we want to copy all of them we're staying on that same item so we don't we're not copying any extra items and we're going all the way to the bottom of the properties and then we want to just copy it over into zero and zero on the temporary grid which is the only slot we have available to put something now replace item we're hovering over so now we're going to do the same thing here ds grid set grid region but now it's going to be from my items to my items so we're just going to take everything from one item and copy to an x so for for one or two steps or one or two not even frames so one or two lines of code we're gonna have a duplicate item in there but that's okay because after we copy it from here we're gonna take the temporary grid we have and copy the item from that so now we need that dragged item slot that we saved zero dragged item slot and item.height and this time we are putting it into the new item which is the current item slot that's where we are hovering over so that's where we're putting the item this is why i'm leaving comments because i took me a while to figure this out just right so replace item we dragged with item we were just hovering over now ds grid set grid region my items temp grid and this is all just going to be 0 0 0 going all the way to item dot height dragged item slot 0 and then we're going to destroy our temp grid because we made it up here and now we're going to get rid of it because we no longer need it let's run this and see what happens i drag this and there we go it replaces those items and it moves it and that's the drag and drop system that we needed and that's actually all we have to do so these are kind of complex but they do a lot of work for you with just one function which is really really handy so let me see if i can give you a visual indication of what we're doing and i apologize it has to be done with my artwork but i think this will kind of make sense so let's walk through this code line by line with a visual representation so the first thing we do is create a temporary grid so essentially we take this and we copy it and we paste it and we make a temporary grid over here now it is completely empty it's all well it all starts as zeros so i guess maybe it's not empty but this is a temporary grid over here and it just is zero index so voila kind of looks the same as the other ones same height and everything but there's nothing inside of it that matters then what we do is we save the item that we're going into so let's say we're going to take our sword and we're exchanging it with the cape so we're hovering our sword we're moving the sword and we hover it over cape and we we've released now we're going to save our cape we got to save one of them it doesn't matter which one but i'm going to save the cape by putting it inside of here this now becomes our temporary ds grid so let me delete this and now essentially this becomes that ds grid we filled it up there we've saved it we have to save it because in the next line of code we are now taking this sword copying it and putting it inside of here so now we have two swords we've taken everything from there and put it in there and it is now slot zero even though you can kind of see the one don't don't think about that too much then what we do is we take this one and then we move it into here so this now becomes the first slot so we erase the zero and it becomes the one and that's it then we i guess we destroy the temporary grid because we make sure we don't have a memory leak but that's what's happening here we just need to know how tall our attributes are which is item.height and we need to know where we need to copy the temporary one into and the one that we're copying to as well so we're just copying it over and then deleting the original one with the temporary grid that we created so that's kind of the visual illustration which hopefully helps a little bit using this function i found you just have to play around with it quite a bit to make sure you get the numbers right it saves a lot of time though once you understand what it's doing and how it works but that's our drag and drop system using just a ds grid and it works really cool that's exactly what we want we can also do it while we're in here and you can see that the description doesn't change and there we go everything is working perfectly so i'm going to say function add item and then i can pass in the arguments right here so that that's going to be the grid and the attributes and if you're not using 2.3 then you just do something like this var grid equals argument 0 and var attributes equals argument 1. everything else from there on out will be exactly the same all right let's go ahead and make sure i've got a description and arguments in here it's going to paste those there adding an item the ds grid and an array of the item enum attributes so just like what we've got down here except this will allow us to add any item to any grid this function that we already had is only to the master list and it doesn't check as many things as we are going to check here so i'm going to first go into obj controller the create event and i'm going to switch my items and i'm going to create my own ds grid here it's going to be 0 and item dot height and then down here what it's going to look like is this i'm just going to go ahead and copy this in so we don't have to go through and type at all but recall add item we pass in the grid that we want and then we pass in the array of properties that we've set up already if you don't understand what i'm doing here go back to the beginning of the playlist where we actually talk about what the inventory has and then how i designed it so that it works just like this i've already got sprites for all of these and i have objects for all of these as well and i went in and added more information on all of these objects too so when we actually go into the inventory you'll be able to see it a little bit better and it'll be totally functional but besides that i'm just going to add all of these and you can see that i can add an amount so uh which one is the amount i don't actually remember let's go amount is the third one here so this is the amount so i'm going to add one knife one broadsword 13 red jelly and then i'm going to add another knife down here and that's what we're going to show how to not stack items okay let's go ahead and where is that script at inventory here we go i'm gonna pull this out and just have it be its own thing okay we're gonna do kind of the same thing down here we're gonna be a little bit cautious and make sure that whatever we do it is going to work like no matter what we do i want it to not crash at all that means we're going to do some safe coding practices but it shouldn't add too much time to what we're doing so first i'm going to add a local variable called can stack and that's going to be equal to true you're going to be able to change this variable based on whatever properties you want of your inventory i am just going to change it so that non-consumable ones are not going to be allowed to stack so let's go ahead and get started on our checks so this is going to be the first check that we have here are the arguments acceptable so this is going to be very similar to what we already did down here so we're going to check to see if the ds exists first so grid and it is of type ds type grid and if it is not that then i'm going to show message no grid found and return before we try and do anything else i'm also going to say if our attributes is not an array so if it equals false or array length and if you're not using 2.3 this will be array length 1d if array length of our attributes does not equal item.height then we have passed in the wrong number uh wrong attributes and we'll return from that as well second check is this item in the master list so one of the things that you could do to make adding items significantly faster is in the controller you could just have a script that says like find item and just type in the name small knife and then it would pull the rest of this out of there which would make a lot more sense and be much safer when you're actually adding items i'm not doing it here just because that's one extra step that you don't need i do cover that kind of adding items in my advanced course which you can find on my website but i'm not going to worry about it here because this works good enough for now but i do want to make sure that when we add an item in that it is in the master list because if it's not then we might have problems later on if we ever have to check that so i'm going to say var is in master list is equal to false for bar i is equal to zero i is less than ds grid width global dot all items plus plus i and then if global. all items so hashtag i and we're going to compare the item name here is equal to attributes item.name if we find it in there then is in master list will become true and if it's true then we are good to go but if it's not true then we're going to return out of there so if is in master list is equal to false show message cannot find this item and we're gonna return are you ready to start making the game of your dreams then head on over to leslearnesstogether.com to check out my trilogy of courses to take you from beginner to expert game development is hard and frustrating when you're going at it alone and you don't have anyone to turn to join me on the journey and i'll be with you every step of the way to alleviate all of that frustration and by the end you'll be ready to make any game you can set your mind to go ahead and get started now at learners together dot com all right third one this is going to be can it stack now here's an important note is that you probably already saw when i showed you in the beginning is that some items can stack and some cannot but what happens if you pass in an item in an amount more than one that's not allowed to stack well you're going to have to actually break that item up for each item that's in there and just call add item again and so we'll come back and tackle this after we finish this whole script if it can stack we'll set it equal to true and if it's not allowed to we'll set it equal to false and the way i'm doing that is just checking attributes item.type doesn't equal type dot consumable here you can have any kind of arbitrary requirement for it being allowed to stack or you can actually add it in the inventory itself like as a item property and just check that so if it's not allowed to stack because it's a consumable then i'm just going to say can stack equals false and then fourth check is it already in the grid now this is one that can easily be forgotten but if it's allowed to stack and it's in there then you want to put it in you don't want to just add it in as a new item so this is going to be if it's already in there we will just increase the amount so if it can stack then we're going to do a for loop if our i is equal to zero i is less than ds grid width of the grid we passed in increase i by one if attributes item.name is equal to grid i item.name so if we're able to find in the inside of our grid if we're able to find the same named item so if you have the same name of items but they're different this would cause a problem you might want to come up with some other unique identifiable characteristic of your item but it's in here so add one or add amount to item in grid so grid i item dot amount plus equals attributes item dot amount and then just make sure to put return here and that will be all good to go and then fifth check not in the grid so add it here we just do almost the actually we do the same thing that we do right down here we just don't do the global all items but i'll type it out just in case you're here and you just want to know how to add items so ds grid resize we're going to resize our grid that we passed in and we get the ds grid width of our grid add 1 to it ds grid height of our grid now it's resized now we do another for loop i is less than array length 1d oh array length attributes plus plus i and then we just copied over one line at a time so grid ds grid width of our grid minus one i equals attributes i and now we are adding in items in our controller we've already set my items to here and we're adding it there that's all we have to do let's run the game and now we have our own items and you can see that we have two knives here we can move things around we do have an amount but we can't actually see that so let's go ahead and add that in and that is actually going to be inside of our draw event we're going to do that here and come on up right after we're drawing the sprite i want to draw the amount over top of it so this is going to be amount we're going to set the color to see white we're going to set the alpha to 1 we're going to set the font to font smaller and then we're just going to draw the text at item x minus 16 item y plus four and we just draw the amount so my items hashtag i item.amount and then let's go ahead and test it out we should now be able to see the amount and voila here are our knives and our sword which are not allowed to stack but we do have one here and i did mention this and i said i wasn't going to do it but i'm going to go ahead and try it i just want to make sure that my idea is correct so if you try to pass in something that is not allowed to stack in an amount more than one here is what you're gonna have to do first you gotta check to see if that amount is greater than one because if it is we need to do a for loop so if our i is equal to zero i is less than attributes item dot amount increase i and then you just call add item again now the tricky part here is that you actually have to pass in the array but you have to make sure you only pass in one not just the whole attributes again otherwise you'll be stuck in an endless loop so you got to pass in attributes item.name attributes item.sprite 1 for the amount because you're going to pass in the correct amount for this for loop you just pass in one at a time attributes item.type attributes item.price and attributes item.object and that needs to all be inside of an array and if we run that now it'll work so we passed in 20 staffs and there they are now they're over here because we didn't go all the way when we're drawing items you can see here that i know how many i'm supposed to draw for the first six and then the next six but i didn't actually set this up over here correctly well then we got to come in here and we have to set item x equals camera camera x plus 81 plus i minus menu width times 2 times item separation item y equals camera y plus and each time we just add 36 it's going to be 183. if we run this then more of the staffs will show up properly and as you can see they are all split up correctly so there's still more like off screen and i can keep well actually yeah why not let's go ahead i actually have all of these right there i can just copy and paste them because we're going to be using this exact same system for when we lock down items i don't know why there's so many vars here because we don't need to recreate it every single time but this will display all of the items properly that you can ever have it'll only be one slight problem is that at the end of it well we've got 20 of those and three of those that's how many we actually have then we got to come down here and inside of this if statement right after the for loop we have to call return so that we don't actually add the one that has that large amount and that will take care of that so now we have the ability to add as many individual items as we want and there we go the next thing we're going to tackle is actually limiting the amount of items that you are allowed to have so right now we can have as many here but in some games you can increase your inventory or decrease it based on weight or anything in your game so i'm going to show you how we can limit the amount of inventory that we can have and how to easily increase it with just one line of code we're going to tackle that in the next video first thing we're going to do is go into our obj controller and in the create event i'm going to add a variable so max inventory slots we'll start this at 5. now however you want to limit the inventory you need to have some kind of number in here our system is actually going to be fairly simple because we already have a complex add item script right here we can just come in and add one more check and i'm actually going to put it as the very first check inside of here so i will say zero with the check that's definitely not how you spell it zeroth check do i have space so we're just gonna say if so every item in your game that is be able to be limited must have this variable name if you want to use the same script if max inventory slots is less than or equal to ds grid width of the grid we're using so if our maximum size is five and we already have five inside of here we're not going to be able to add any more so we're just gonna say return and if we do that right away this will actually start working and now we can only have five items inside of here but we also want to display that we're not allowed to use them through some way because otherwise the player might think there's some kind of glitch or something going on so let's go into the draw event and i'm actually going to copy this whole thing right here because we're going to do almost the exact same thing and actually i'm just going to go ahead and copy this whole for loop while i'm at it we're going to go down here and before the front of the inventory i'm going to paste this in and i'm just going to say locked item slots so here the sprite is actually just going to be spr locked icon and all that is is well it's just an icon that i found from gameicons.net i'm pretty sure that's the place i should double check that for next time but it's just right here and i think it looks pretty good it fits exactly what i want to do so i'm going to go ahead and use it so we're going to use that this is going to make sure that they're all in the correct space now the only difference is that it's not going to start at 0 this is actually going to start at max inventory slots and it's going to go until menu height times menu width other than that we just basically do the exact same thing except we're going to need to draw this at point 4 and point 4 because otherwise it's going to be a little too large so let's press f5 and check it out and we forgot one more curly brace right there do need that when copying an entire for loop and voila 0.4 looks a little small let's go ahead and change that to 0.5 and try one more time now we have locks on everything and you can clearly see what you're allowed to use and what you're not allowed to use and to change it all you have to do is change max inventory slots so i'll add 10 here and now we have 10 slots the items start making the game of your dreams then head on over to less learners together.com to check out my trilogy of courses to take you from beginner to expert game development is hard and frustrating when you're going at it alone and you don't have anyone to turn to join me on the journey and i'll be with you every step of the way to alleviate all of that frustration and by the end you'll be ready to make any game you can set your mind to go ahead and get started now at learnerstogether.com the items that don't get added just kind of disappear so you probably want to do something more specific with that and the other thing to think about is if we add an item like this if we add an item that is actually can be stacked and is adding onto it well currently since we put this at zeroth it will just return immediately so we'll actually put it right after this fourth check so then it becomes the fifth check and this becomes the sixth check now the reason this will work is even though we are adding items up here the uh adding it to the ones that can stack us here so it has to be after that and these ones will all get refunded or not refunded but they will not work because we actually are going to go through here we're going to find a can't stack and we'll eventually hit this before we actually try to add it so if we do this we should have three blue jellies even though we added the other two after these other ones so that takes care of that small problem that might arise and that i think is actually it uh it's really simple to do it's just changing that variable and adding in that for loop uh like i said you're going to want to take care of the items that you can't add maybe automatically adding some gold to the player or doing something like that but again that gets very game specific and i don't know what your game is like so i'm not going to try to tell you how that should work but that's all i've got for you super short super sweet compared to my other tutorials so if you liked this and you want to see more uh hit the subscribe ring the bell maybe check out the playlist that this video is in for how to create a beautiful inventory in game maker studio from start to finish and if you want to see more content from me then go ahead and check out my courses at let's learn this together dot com thank you so much and as always keep making keep learning and i'll talk to you later so i am going to be adding a function to my inventory script now i am using game maker 2.3 which just means that my scripts are containers for functions that's really about it so if you're not using 2.3 just make a script with this name we're going to call it function sort inventory and i'm going to go ahead and press enter a bunch and i'm going to pass in two parameters here two arguments it's going to be sort type and the grid which actually we've done grid first on all of these let's go ahead and do grid and then sort type now if you're not using 2.3 all you'll do is say var grid equals argument 0 and var sort type equals uh argument one and then everything else will be exactly the same so let's get started on the coding now we've already figured out what kinds of things we can sort by and we are we have those inside of our obj items come back here we have sort type we have name amount type and price so if your items have more things that you can sort by then you can obviously put those in and use them the last one we have is height and that's because the way we're actually going to sort it is just by pressing the s key and when we do that we're just going to say plus plus sort type and then it's going to increase it by one and if we're at the height then it's going to go back to the first one that's just how that's going to work from a technical standpoint which is why we have a height there if you're not familiar with enums they're just names for numbers and they start at zero okay first thing we got to do is convert our sort type into the type of things that we can actually find inside of our inventory because the sort type here does not necessarily mean the sort type over here you could potentially do that if you want like put name and amount and type and price all in the same order but i think that's kind of unnecessary and could get very confusing especially with larger inventories with a lot of different item types so instead we're going to go ahead and convert sort type to item attribute and the way we'll do this is with a switch statement and we'll just say sort type and we're going to say case sort type dot name and we're going to say sort type then equals item dot name break now that should switch to a local variable unless i am typing something wrong i've got a colon after case and it's only after the full case that you want that okay now let's do the rest of the cases so sort type dot amount that's going to be sort type equals item dot amount break case of sort type dot price sort type with an equal item dot price break don't forget the breaks because if you do you will be in trouble last one is the type sort type equals item dot type break okay looks like we got everything there it's all coming together now what we've got to do is create a temporary ds grid that we are going to sort and then we're going to write over our original grid that we're passing in here and that's because you don't you can sort a grid in place but there's trade-offs to that it becomes more complex and anytime you're talking about sorting or searching and you start talking about algorithms the two things that you have to consider are space and time which are which is complexity so essentially do you want to make something easier by using more memory or do you want to make it more complex by using less memory because most of the time when it's more complex there's a lot there's more code or at least the code itself is much much harder to read and understand but if you use more space it's a whole lot easier so we have plenty of space writing another ds grid even for a thousand or ten thousand items is not going to take up very much memory so that's the route i'm choosing to go and i think it's the smarter route when you are not restricted by something all right so we're going to create a temporary ds grid so var sorted grid equals ds grid create going to start out empty height and we also need to know which one is the lowest item while we're searching and then we also are going to have saved items so saved items but game maker is kind of strange in the sense that you're not actually allowed to instantiate a array inside of the same time that you give it its name so i have to do that and then i can come down here and say saved item 0 equals undefined these are going to be items we already got from the grid okay this is just going to be an array of numbers that way we know which ones we've already done now here comes the complex part is a nested for loop so the first one is going to be using i so i is going to be less than the width of the grid we passed in so we're going to iterate over the grid through our eye here but we can't just iterate over it once at least not with the sorting algorithm that we're using we have to actually sort over it every time for each item in the grid to make sure that we've found all of them so now we're going to say var j is equal to zero j is less than ds grid width of grid and plus plus j now be careful because we've got two for loops and two local variables with them so you've got to make sure that j is this for loop and i is up here you cannot use the same variable and if you mix them or at any point in this double for loop it's going to blow up in your face so keep that in mind now item one is going to equal to grid lowest item sort type so we start at 0 which is totally fine we're going to start at the beginning of the grid then item 2 is going to be equal to grid j sort type so item one is just checking the first item that we're at against all of the items as we iterate over the grid so we're checking j so we're gonna go over the entire grid one time and we're just going to say if item 2 is less than or equal to item 1 and we need to create another function here it's going to be array contains saved items j is equal to false now let's go in and create this function i can just do it right here which is really nice i'm going to say function array contains and what this is going to do i'll actually paste in the description so that you can read it we just need to know if an array contains a specific number and the reason we need to know that is when we are sorting through our grid we don't want to have any dupli we don't want to duplicate an item like if we're going through and we find that the third item in the grid is actually the lowest one but we already saved the third item then we want to skip over we don't want to even do anything with it so what we're doing is we're saving we have an array of all the items that we have already copied over and this function is just going to tell us hey that one we've already saved so don't even consider it so all we have to do is pass in an array and a number and this is just gonna do a for loop var i is equal to zero i is less than array length of the array and if array i is equal to the number that we passed in then we're going to return true otherwise at the end we return false and that's all that that's going to do so it just finds out if there's a number in the array so up here if both of these things are true so item two that we're comparing remember item one is the one that has the lowest item so that's the one that we think is the lowest and we're gonna say if item two is actually lower than that and we haven't saved it already then lowest item equal to j all right now we come down two parentheses so outside of the second for loop but we're still inside the first one so end of inner loop now we're going to add that item to our sorted grid because we already have the function written for that so we add the item to the sorted grid and that means we have to pass it in you know because we don't have an easy function to get all the attributes that we want so i'm going to say grid lowest item item.name and grid lowest item item dot sprite and so on and so forth until we get all of them lowest i'm just going to copy this lowest item bit because we're going to do that several more times and then we need the item dot amount i'll bring it down here for item.type and item.price and item.object and that's all inside of an array so make sure you have a second bracket there and a parenthesis for the function of add item okay we add the item there now we're going to add two saved items so this array that we are adding stuff to saved items i because that's the one that we are actually on so saved items i equals lowest item so i is when we're iterating through the array one at a time and we iterate j amount of times for every i if that's not confusing then i don't know what it is but listen to it over and over type it out yourself and it will make sense okay so we're saving the saved items to the low we're saving the lowest item two saved items so that we don't ever copy an item that we already have now find next lowest item all right we're going to do 4 var i or no we can't do i we have to do a different one because if we reset i here it's not going to work so we're going to do var l equals 0 l is less than ds grid width of grid plus plus l and now we're going to check the array contains again and this part is essential and this is what threw me off when i was first doing it is i didn't have this in there and it was overriding items and eventually i'd have just the same item and the reason for that is if we start lowest item at zero every time or some kind of fixed number then eventually that item will always be the lowest and this will never trigger and we'll just add the same item over and over and over so what we have to do is find the next lowest item and set the lowest item to that so if array contains saved items i or l so where we're already at so the for loop that we're in if it doesn't contain it then we set lowest item equal to our l and then once we got all of that sorting properly and it's all done we have to actually copy and return so we're going to say ds grid set grid region which we've used this before we're going to pass in the grid that we passed the source is going to be a sorted grid we're going to start at the beginning and we're going to go all the way over so ds grid width of sorted grid or it could be grid doesn't matter we're gonna go all the way to the bottom with item.height and we're gonna start at the top left as well so we're gonna copy everything from sorted grid over to grid and then we're going to uh destroy sorted grid and return grid are you ready to start making the game of your dreams then head on over to leslearnesstogether.com to check out my trilogy of courses to take you from beginner to expert game development is hard and frustrating when you're going at it alone and you don't have anyone to turn to join me on the journey and i'll be with you every step of the way to alleviate all of that frustration and by the end you'll be ready to make any game you can set your mind to go ahead and get started now at learners together.com now i'm going to paste in the description and the parameters for this and that should be everything that we actually need to know so sort inventory is only referenced once that is just fine it's a function now we need to actually implement this inside and start calling it so let's go back to our controller we're going to create event and up here i'm just going to go ahead and say sort type is going to be equal to 0 to start or you can give it a name so like sort type name is also zero but you can choose any of them except height if you choose height that's going to be a problem then let's go into the step event and when we bring up the menu we're going to call sort inventory immediately so it's going to be our sort type with my oh you know we switched those around my items and sort type and then we can just run this and we have it being sorted by name so there we go let's check it out we've got blue jelly broad sword legendary crystal major staff last one is small knife looks like that's working properly awesome now inside of the step event here let's actually be able to add and change the sort based on what we press so if is showing menu so we only want to be able to do it while we're showing the menu if keyboard check pressed ord of s or any key you want then we're going to say plus plus sort type and just check to see if we've gone too far so if sort type is greater than or equal to sort type dot height sort type we'll go back to zero and then we call the actual sorting to make sure that we always call it with a valid type so my items sort type now we should be able to actually see it in action okay i don't see any problems but the only thing is that we can't actually tell how we're sorting it so we need to add in a little bit of information for the player so let's go into the draw event and at the very bottom we want to actually do it after we draw the front of the sprite we want to call draw the sort type and let the player know what how we're sorting it so let's go draw set alpha for one draw set color for c white and we're going to draw set the font for a font smaller now if sort type is equal to sort type dot name and the order here doesn't matter at all we're just going to draw some text and that's going to be at camera x plus 50 camera y plus 425 and we are sorting by amount now i imagine i'm actually going to have to change some of these values but let's go ahead and do this so now we can do amount price type and just change the actual word so the first one is by name amount price type let's run it i think it's going to be a little too low or get in the middle of oh no that actually looks pretty good okay so now we've got sorting by name sorting by amount starting by type sorting by price let's go ahead and move the camera x in let's do like 75 i think that would look better and voila we are sorting we are displaying what we're doing and i'm pretty happy with that it's fairly complex i will admit getting a good sort is very difficult to do this isn't by far the most efficient and it's probably not even the prettiest way of doing it but i think it's probably the easiest way to do it and that's unfortunate because it's still rather complex but i hope this makes sense if not go over it again or you can check out my patreon for some one-on-one tutoring if you really are stuck and you want to be able to just talk to me and show me what you're working on and i might be able to help you out there so that's what i've got for you today though in the next video what we're going to be tackling is using items in an inventory now i'm not actually going to use an item like in a game because that's very game specific and i'm trying to be as general as possible but we are going to set up the little system of how to use an item and maybe a couple different ways of going about that so we're going to go into our controller and in the draw event we actually want to add in some code here to lock down the item draw red and make it so that whatever we do it we can't actually change anything else about that item and then we can actually click on that equip or use button and make it so that something actually happens so we're going to need three variables to do that i'm going to come down here into our create event i'm going to say item locked is equal to false locked item x is equal to undefined and locked item y is equal to undefined so this will be where we draw the rectangle and this will be the actual item that we have locked or this will be that if we have an item locked so now we'll go into our draw event and underneath being able to click on an item to bring up the description and play the sequence we're going to have this be able to lock an item so if mouse check button pressed mb right and item locked is equal to false and we only want to be able to do this while we actually are showing the description so i'm going to add one more showing description is equal to true then i'm going to say item locked is equal to true locked item x equals item x and locked item y equals item y and those are things that we're setting up here so now we have those and then to unlock it we're just going to say elsif mouse check button pressed and be right and item locked is true then we just reset that i add unlocked is equal to false and we can reset the locked item x and y if we want to but i don't think it's actually necessary the other thing we have to do is up here we are creating objects as we mouse over them so we need to add one more and to check to see if item locked is equal to false so if we are not locked we'll keep making items otherwise we're going to keep it on that one and that's kind of the key of actually making it so that we don't start showing descriptions of other items otherwise that will happen so we're just going to come right down here outside of the for loop draw locked item and just say if item locked is equal to true draw set alpha to 0.5 we're going to set the color to red and we're going to draw a rectangle and we already know exactly where to do it so locked item x minus 16 locked item y minus 16 lock item x plus 16 and locked item x plus our loft item y plus 16. and false for the outline and reset the alpha okay let's give that a try we should now be able to lock an item so let's open up our description lock it and now nothing happens over here so that's exactly what we want we can unlock it and we can move it around so that's perfect now what we want to do is set up the point and rectangle function to be able to find the button and then call a script when that's pressed so we can actually come down here we can do it anywhere down here but i'll put it at the very bottom so press button and what this is going to do is the same thing that we've already done several times which is checking the point in rectangle and our mouse x and mouse y the actual coordinates here are going to be down near that button so because i don't know exactly where that is i'm actually going to turn this into a draw rectangle first and i'm going to copy in what i think it should be which is this right here so these coordinates and needs to be false and i'll run this and see how close this rectangle actually is to it so if we load this up that covers it up perfectly might be a little too large but i'm pretty happy with it so i'm going to go ahead and cut out those coordinates and say if point in rectangle mouse x mouse y is equal to true and mouse check button pressed md left then we'll show a message button pressed we'll run that and that's what we have now we can open this up we can lock this item and move between and then we can click down here and that's where you would call your script to then equip an item based on which one you have selected and you know which one you have selected because that's the locked item you can easily add in more data about the locked item so you can just pull it right there or you can grab that from somewhere else doesn't really matter but that's how you would use an item with this inventory are you ready to start making the game of your dreams then head on over to let's learn this together.com to check out my trilogy of courses to take you from beginner to expert game development is hard and frustrating when you're going at it alone and you don't have anyone to turn to join me on the journey and i'll be with you every step of the way to alleviate all of that frustration and by the end you'll be ready to make any game you can set your mind to go ahead and get started now at learnerstogether.com and that's pretty much everything we need to do that's all we have to do for using an item but if you're following along with this whole inventory then there's just a few things left right now we can't actually get out of our inventory so i can't leave it and then if we open up an item and quit this we actually still are displaying everything so let's take care of those few little bugs that we have left the first one is going to be actually i think they're all going to be in the step event right here where we are actually opening this up so we want to check to see if we are actually have the inventory so if is showing menu is equal to true then we're going to do one thing else we're going to do this over here so if we are not showing or if we already are showing the menu then we want to close out of it so is showing menu is equal to false we're going to layer we want to destroy the sequence but first we have to make sure that the sequence isn't undefined because if it is then the game will crash so if it's not undefined then we'll destroy it and then if we have any items left we'll just go ahead and destroy them it doesn't hurt anything if we call destroy when there aren't any and that will be just about everything so now we can go into the menu we can come out of it we can open this up and we can come out of that and the problem is that this item is actually still displaying stuff so something strange is going on the problem is that when we destroy the sequence here we haven't actually done anything to the item that is actually around so i'm going to go ahead and say if we destroy the sequence then we are going to destroy the item as well and that should be the last thing we need to do let's open this up exit out and there it goes now it kind of goes away a little late so i'm actually going to take this and put it where we click on that exit which is up here oh no that is right here exit description so i'm going to destroy the parent that we the item that we've got there and that will actually take care of that there we go and if we come out of the menu there we go and really the last thing we have to do is in the step event when we're destroying the sequence set showing description equal to false that should finish it off if you find anything else let me know and i can update this but i think that's it so now when we exit out it's not displaying it we can exit out of it here and it goes away just the way it should everything is golden alright so that's everything that i've actually got for you if you enjoyed this video or this series please leave a like comment and let me know by subscribing and ringing the bell if you want to see more stuff from me in the future well that's it that's the whole playlist you've gotten to the end and that's everything i've got for you and making a beautiful inventory in game maker 2.3 uh what'd you think did you like that was it awesome did it miss some features or was it exactly what you were looking for here i would really value your feedback i want to hear what worked what didn't and how i can improve for the future and if you want a chance to be able to vote on the projects that i work on in the future check out my patreon where they all get to vote on the content i create so this series making an inventory was voted on by my patrons and this is what they wanted to see so there it is they also got a lot of early access to the projects to the builds and they got to request specific features in there like being able to limit inventory size was something that was requested on there but that's what this is i hope you enjoyed this series i hope it was useful again let me know what you thought and what i can improve on and anything else you'd like to see in the future i can't guarantee it but if it's a good idea i'll add it to my list and it probably will get made eventually just no guarantee when so thanks for joining me on this journey thank you for your feedback and your encouragement i really do love doing this and i really appreciate hearing from all of you so as i always say keep making keep learning and i'll talk to you later on every game maker tutorial and video i put out from here into the future i'm going to be giving away one copy of my beginner game developer course a great way to go from no programming experience to be able to make your own games to be entered to win just like the video and leave a comment showing me your keyboard works you can leave a comment about anything a week after the video is posted i will send you a message with the coupon if you want you can use it for yourself give it to a friend or apply it towards a more expensive course by just sending me an email and letting me know that's what you'd like to do if you want to see more content from me then subscribe and ring the bell to be notified every time i put out a new video but that's all i've got for you so thank you so much for joining me and as i always say keep making keep learning and i'll talk to you later a huge thank you to all of the awesome people who support me over on patreon their names are on the screen now and every dollar pledged helps me create more awesome content you can support me for as little as one dollar a month and get access to exclusive perks like my discord server your name in the credits early access to my youtube videos and courses and more check it out at patreon.com let's learn this together.com or find the link in the description below and become a patron today [Music] [Music] you

Channel: Let's Learn This Together

Views: 2,731

Keywords: GameMaker Studio, GameMaker Studio 2, GameMaker Studio Tutorial, GameMaker Studio 2 Tutorial, GMS, GMS 2, GMS Tutorial, GMS 2 Tutorial, LLTT, Let's Learn This Together, GameMaker 2, GameMaker Projects, GameMaker Studio 2.3, GameMaker Studio 2.3 Tutorial, gamemaker studio 2 inventory tutorial, add item to ds grid, coding inventory, display items ds grid, fancy animations, display item details, drag & drop sort, unique inventory, inventory resize, sorting ds grid, final touch

Id: R3LV2EuEhmY

Length: 154min 41sec (9281 seconds)

Published: Fri Oct 02 2020