Basic Inventory: Picking Up & Dropping Items In Unreal Engine 5

hey what's up guys today i'm going to show you how to make a simple system for an inventory that'll let you run around and pick up items from the ground and store them in your inventory like a bag or backpack maybe your character has and then you can also throw these back on the ground maybe you decide you know you're done with these or you need to get rid of some stuff free up some space or some some weight you can throw these items back on the ground like this all right so i'll show you how to get started here all right i'm going to start off here with a new first person template project and what i'll do first is make my parent class for pickup items so i'll make a new blueprint actor called be underscore pick up item parent and i'll open that up and i want to add a couple things here i'm going to add a static mesh component and i'll select the default scene root here and add a sphere collision and i'm going to call this the overlap sphere and i just want to make one change here in the details i'm going to find under collision uh the collision presets here i'm going to change this to custom and i'm just going to select overlap for everything so i don't want it to block anything i just want it to overlap only and that's fine for now so i'm going to close that next thing i'll do is make our inventory widgets so i'll right click here and make a new user interface a widget blueprint a user widget i'll call this w underscore inventory [Music] all right and for this one i'm going to start off with a canvas panel i'll drag that down here and what i want to add here is first of all a border and i'll drag that on and maybe size it up something like this just in the corner here and i'm going to change the brush color here i'll just actually set this to maybe sort of a medium gray and set the alpha here to maybe like point three okay and then what i'm going to do here is add a wrap box and i'm not going to drop it in the border here i'm just going to add it to the canvas panel and size it up just a bit smaller than the wrap box and drag it over top like this okay and i'll also add a text element same thing i'm going to drag that onto the canvas panel i'll just set the text here to say inventory and i'll make it a bit smaller here maybe say 18 and i'll drag this down right here like this okay and the only thing i have to do here is select my wrap box and say is variable and we'll name this the inventory let's say the inventory box okay i'll compile and close now i'm going to make the widget that will represent each of the items we're going to pick up so i'm going to make another user interface widget blueprint user widget and i'll call this w underscore pickup item okay and for this one i'm going to set the screen size here to custom and 100 by 100 is fine i'm going to add an overlay to start with all right and i'm going to also add a button drag that into my overlay and i'll select the button here and i'll say we want that to fill horizontally and vertically and i'll change the name here i'm going to call this item button all right and next i'll add an image and i'll drag that into the button and we'll say fill horizontally and vertically and i'll select my find our padding here i'm going to say padding for this can be just 2 and for the item button we'll set the padding as well here to and two we don't need uh these wide edges here all right and uh for the image uh i'm gonna change the name here to item icon all right and i'm also going to add a text element here i'm going to drag that into my overlay and i'm going to change the color let's see here i want to change the text color to black and we'll say for the text itself here i'm going to set it to 99 and the size let's say maybe 16 and i want to say for the vertical alignment we'll say bottom a line so we'll put it in this bottom corner here and this is going to be the stack size for if you have more than one of the same item in your inventory and it's allowed to stack okay so i'll set that to is variable and i'm going to change the name to stack size text all right and so i'm going to go now to the event graph for this widget and add another variable here and i'm going to call it item class and i'm going to change the variable type here and i'm going to set it to an actor and i'm going to set it to an actor class reference okay and i'm going to add two more variables here i'm going to call this one current stack and i'll set that to an integer and one more called max stack also an integer okay that's good for now i'll compile and close that okay next i'm going to make an interface that we're going to use to communicate between pickup items and our first person character or other actors okay so i'm going to right click here blueprints blueprint interface and we'll call this pickup item underscore interface all right and i'll start off by making a new function here called pickup item and i'm going to add some inputs here um we'll the first one will say item class and i'll set that again to an actor class reference and another input here we'll say item icon and this time i'm going to select texture 2d just the object reference and one more input here this will be stack um amount and we'll set that to integer all right and next i'll add another function here we'll call this one drop item and for the inputs here i'll add item class and we'll set that to actor class reference and okay i'll compile and close that for now and what i want to do next is i want to get our inventory widget to display on the screen when we start playing so i'm going to go to my first person folder here and the blueprints folder and open up the first person character blueprint all right and i'll find an empty spot here on the blueprint and i'm just going to right click and say begin play we'll get the event begin play and i'll drag from that and go create widget and i'll find our w underscore inventory widget and i want to promote that to a variable we'll call this our inventory widget all right then i'll drag from here and say add to viewport and i also want to be able to use our mouse by default the mouse is hidden and it's used just for uh moving around your character for looking around so what i'm going to do here is i'm going to right click and say get player controller and i'll drag from that and say set input mode game and ui and i'm also going to drag here from player controller and say set show mouse cursor and i'll select that to be true and now when we play the game we'll have our mouse showing and you have to right click hold right click to use it as a look around otherwise you move your cursor and you can click on things on the screen uh so let's just give that a quick try here all right and so we've got our inventory box on the screen here uh the background's a little bit light i'm going to make that just a little bit darker here okay so that's a little better now we need to uh be able to pick up some items and add some widgets to our inventory so what i'm going to do next here is make a couple of pickup items and what i've got here is a medical kit model and a potion bottle and so i'll start off here by making our potion bottle and so what i'll do is just right click my pick up item parent and i'll say create a child blueprint class and i'll call this be underscore uh potion let's let's call this health potion pickup all right and uh for the static mesh here i'll make i'll find my bottle here sm potion bottle all right and i'll set the materials here let's set the material to green potion and i've already got the health label on here so pretty well all set the overlap sphere is uh unfortunately not really overlapping the mesh because the mesh base starts at the center here and the overlap sphere has the uh center as the is is from the center not the base so what i'm going to do real quick here is open up the pickup item parent go to the viewport and we'll select the overlap sphere and i'm just going to drag it up say well let's say 20. and we'll take a look at that in the health potion pickup and that looks better all right i'm going to go ahead and make one more pickup item here so i'll just i'll just take this one and duplicate it and we'll call this b underscore medical kit pickup all right and for this one i'll just change the static mesh here to the medical kit and i think i need to rotate this just a little bit there we go uh okay and i'll scale it down maybe that's a little bit large we'll say 0.6.6.6 all right and the overlap sphere uh for this one maybe could be uh just a little bit larger so here what i'll do is center this uh let's see we'll turn off the grid center it a little bit better and uh i'll select the sphere and i'll change the radius maybe to 50. all right well maybe 40 actually yeah that seems fine okay so the next thing that i'm going to do here is go to my pickup item parent blueprint and i want to add a couple of variables here and we'll start with item class and we'll set that to an actor class reference and i'm going to set this to instance editable by selecting this little eyeball here where you can check up here instance editable and i'm going to add another variable called item icon and i'll set that to a texture 2d object reference and one more variable here called stack size [Music] and that's going to be an integer and i'm going to make the both of those also instance editable so all three of these are instance editable and so now what i can do is uh on my health potion pickup select the route here and i can find the item class item icon and stack size so the item class here i can set this to health potion pickup stack size let's say we want to be able to stack these up to five at a time uh and now item icon so at this point what i'm going to do is make a couple of icons for these pickups and so what i'm going to do is something very simple obviously you can make icons in any number of ways but i'm just going to drag one out here uh onto my grid and i'll press g and then i'm just going to use uh windows key shift and s and we'll take a screenshot okay and then i'm going to open up uh is of course free software anybody can download this and i'll paste that image into here and i'll just say image scale image 256 and i'll unlock this so i can set it to 256 in both dimensions it's going to stretch it maybe a little bit i didn't take a perfectly square screenshot that's no problem what i want to do here is i'm just going to grab my ellipse select tool and do something like this with a circle selection around here i'm going to go to edit stroke selection and i'm just going to use a solid color line width 10 and i've got a bright green color here set as my foreground color i'll hit stroke and next i'm going to say go to select go to feather and i'll feather the selection by 15 and now i'm going to use ctrl c and ctrl shift v and now i've got this icon that's sort of a basic icon for my medikit pickup so i'll export this to my desktop okay and i'm going to do the same thing again here for the potion so i'll just delete that drop the potion here we'll turn this around and i'll press g and shift windows key s take a screenshot i'll try to make it as square as i can here maybe take another one [Music] now that's better okay and back to we'll paste it and we'll do the same steps again here all right and so now i'll just import those two icons uh into the content browser here we'll just drag those from the desktop all right i'm back in my health potion pickup blueprint here i can now set item icon and find that health potion icon and in the medical kit pickup blueprint we'll set uh we'll set all of these here actually the item class to be uh the medical kit pickup and the item icon medical kit icon and stack size let's say just one these are pretty big you can't really stack these let's say you only have one at a one per slot all right one more thing i'm going to do here for these pickups is set these to simulate physics so i'm going to grab the static mesh here find simulate physics and i'll turn that on for both of these all right and on the pickup item parent what i'm going to do is select the static mesh and i'm going to find under the physics category here constraints and we're going to lock the rotation on the x and the y dimension and set maybe the um let's see here i'll search for the eng uh max angular velocity and uh so i want to set this to maybe something like 360 i believe that's degrees per second so i don't want these items to be able to spin out of control i just want to just be able to spin a little bit and not rotate in the x and y dimensions they're just going to be able to spin in the z dimension all right so i'll compile that and i'll close these for now my health potion pickup and my medical kit pickup okay so now we want to be able to walk over these items and pick them up into our inventory so what i'm going to do here is open up the first person character blueprint and i'm going to start off by going to class settings and we're going to add that interface that we created the pickup item interface now under interfaces over here i can find that drop item and pick up item function that we defined and we'll start off with pickup item here i'll just double click that and what i want to do is we want to send this message to the character when they overlap the pickup item so in pickup item parent what i'm going to do is on the event graph we'll say on actor begin overlap we'll say from other actor does implement interface and we'll see if that actor implements the pickup item interface and i'll make a branch from here and if they do implement the interface uh then we want to make sure that it's not another pickup item so if an if a pickup item overlaps another pickup item maybe you drop one on another one we don't want this event to happen so we're going to check for that we'll say we'll say other actor get class and then from the get class value i can say is child classes child of and we'll see if it's a child of b underscore pick up item parent and they'll get another branch here all right oops okay and so if it's true that it implements the interface but false that it's not another pickup item then we're going to go ahead and send the interface message so i'll just drag again from other actor here and i'll type in pick up item now we'll plug that in from false and the item class and icon and stack amount i'm just going to drag in from right here from our variables so we'll drag in item class icon and stack size so now back to the first person character blueprint when the first person character overlaps an item and receives that message what we want to do is we want to check if we already have one of these on hand well first we'll see if it's even a stackable item so we'll say we'll grab stack amount and we'll say greater than one all right and if it's greater than one that means it can stack and so we should check our existing inventory for if we already have it so i'm going to grab this inventory widget reference drag it in here and we'll say get inventory box and from that i'm going to drag and say get children get all children and from the array return value i'm going to get a for each loop with a break all right and so i'll plug this in from the true and now i want to get information about the widget and so i'm going to go back to my interface to create another function here real quick we'll go open up the pickup item interface and i'm going to add a function here called get pickup item data and that's going to have some outputs so the first output is going to be item class and we'll set that to an actor class reference all right and the next output here is going to be current stack amount and that's going to be an integer and i'll make one more output here and this is going to be the max stack amount also an integer okay and so what i want to do is in my inventory widgets so i'm going to find my w pickup item and i'm going to go to the event graph and class settings and i'm going to add that same interface the pickup item interface okay and i'll compile here and under interfaces now i can select this get pickup item data i'll double click that and now i can return the item class and the current stack amount and the max stack amount okay so i'll compile that and go back to the first person character blueprint and we'll drag from each from the array element here and we'll say get pickup item data okay it's now we can check the item class and we can see if this is equal to the item class that we've just tried to pick up and so we're going to see do we already have one of these items in our inventory all right and if we have one we want to see if we can in fact add to the stack so now we need to check if the current stack amount and plus 1 because we're trying to pick one up if is that going to be less than or equal to the max stack amount and get another branch here all right uh and if it is if if we can then we want to add one to the stack so what i need to do now is make one more interface function so i'm going to go back to the pickup item interface and i'll add a new function here called add pickup item to stack all right and i don't need any inputs or outputs for that one what we're going to do is in the w underscore pickup item widget i'm going to go back to the event graph here and we'll right click and say add pickup item to stack we'll make the event and i'm just going to grab the current stack variable here drag from that and i'll say plus plus so that'll increment that by one and then i also want to grab the stack size text we'll drag that in here and i'll say set text and we'll drag on from the current stack integer to the text and it'll make a conversion node here for us okay and one more thing i'm going to do here is i'm going to go back to the design i'm going to select the stack size text here find visibility and i'm going to change it to hidden so it's hidden by default and then back in the graph here we'll say grab our stack size text here and say set visibility we'll make it visible if we have increased the stack amount so there's more than one so there will be no number visible if you just have one if you have more than one it shows the number okay so that's pretty much done now back in the first person character we can go ahead and call add pickup item to stack when this returns true so i'll just drag here from the array element add pickup item to stack all right and i want to stop looping through this once we've added the item once we've found an existing stack that we can that will accept this item we don't need to keep looping through the rest of our inventory uh so we will loop around here to the break pin and i'll just double click this so that we can reroute it a bit nicer here i'll route it up top maybe something like that all right and one more thing i'm going to do here actually before we uh go to the break pin is i'm going to add one more variable we're going to call this um is item added question mark and we'll set that to true if we successfully found a spot to add the item to an existing stack all right so the next thing i'm going to do here is go back to the beginning of this function here and now we're going to say what if we don't have that item existing or it doesn't stack in the first place we need to add it a new widget to start with so what we'll do here is from the false pin we'll say create widget and i'll select the w pickup item and then we need to set a couple of the variables so we're going to set the class the item class then we'll drag in item class here we want to get the item icon and drag from that and say set the brush all right and for the brush what we'll do here is grab the item icon pin here and we'll say make brush from texture and i'll set the width to 100 and the height to 100 and we'll plug that into the in brush pin here okay then we'll grab from the return value of the widget here and say set max stack and we'll drag in the stack amount here all right so with those three things set here the item class the item icon and the max stack amount we can go ahead and add this to our wrap box so i'll grab the inventory widget reference here drag from this and get the inventory box that's our wrap box and i'll just drag from this and say add child to wrap box and we'll plug this in here and the child that we're trying to add is the widget that we just created here the return value from the create widget node all right and that's pretty much it so what we want to do also though is if we come off of the loop here we want to check is item added to see if we actually added the item to an existing stack and if we didn't then we want to come around to the same logic here where we make the new widget and so again here i'll just route this a bit nicer and what i want to do is actually collapse all of this into a function so we'll just grab everything here and i'll right click and say collapse to function and i'll call this add item to inventory all right and we'll just clean this up a little bit here um let's see this a we don't need this actually comes from max stack here and b this actually comes from item class so just because we've used them twice in the function it's made a separate input but we don't actually need those so i'll delete a and delete b and uh we'll change the name of this to item icon all right and that's pretty much it and also for is item added uh i want to make this a local variable so i'm just going to go here and say local variables is item added question mark and we will delete this and we'll use this one instead okay so it might have been easier to uh just make this a function right from the get-go but i kind of forgot and so uh converted it afterwards here made a little bit of a mess and cleaned it back up so hopefully you're able to follow everything there and that's basically it for this function so i'm going to compile see here add item to inventory just need to remove these pins here compile all right and we're all set all right so with that done the next thing i want to do is go back to my pickup item parent and right after the pickup item message basically we're going to destroy the actor so if you've picked up the item then the 3d model version of the item in the world is gone and now you presumably have it in your bag or whatever so we'll just drag from here and say destroy actor all right so let's give it a try here and see what we've got so far uh i'll just see if i can pick up this bag and the health pot here i'll just walk over top of them and yeah we've got them in our inventory and let's check out the stacking function here we'll just make a handful of these health pots here i'll hold alt and duplicate these and we'll make a whole bunch here and i'll make a couple extra medical kits here as well all right so looks like our stacking is working but uh it was off by a little bit there i think what happened is we need to set the initial stack size to one so i'll go to uh w underscore pickup item current stack and the default value should be a one all right we'll try that out again here so i should have uh one bottle here and then a second and then a third yep so that's working now and these don't stack at all and this stacks up to five and then starts a new stack there all right perfect so the next thing that i want to implement is i want to be able to click these and well let's have it just drop the item for now so obviously using an item you'd have to implement specifically to what items you're you have in your game and that would be a game specific implementation but what i want to do is implement a way to drop these items back on the ground okay so the next thing i'll do here is go to my pickup item widget and i want to select the item button and on clicked event here i'm going to hit plus and what we'll do is we'll use that drop item message that we set up in our interface so i'll say i'll right click here and just say get player pawn and we'll get the owning player pawn and i'll drag from that and say drop item message and the item class we'll drag in from here [Music] and then what we want to do is deduct from our stack so we want to check we want to take our current stack uh we'll get that and say minus minus to decrement that by 1. all right and then after decrementing that by one we're gonna check if it's equal to zero and i'll get a branch here and if it is then there's no more of that item and so we'll say remove from parent and if it's not then that means there's still some more of that item left so we'll update the stack size text here i'll drag that in get that and say set text and plug that in from the false here and the text is going to be the current stack that'll be converted to text from an integer [Music] all right and then what i want to do here is we want to see if the current stack i'll just grab the current stack reference control d and see if it's equal to just one and i'll get a branch here and if it is equal to just one then i'm going to say stack size text i will duplicate that as well again here and say set visibility and we'll set this back to hidden so that we don't see that number for just a single stack or a single unit okay so that's pretty much done for the uh widget and so now we just need to define this uh drop item once we send this message uh to the uh owning player pawn which is our player character we need to drop the item so i'll go back to our first person character here and i'll right click here and say drop event drop item and what we'll do is we'll say spawn actor from class and the class is going to be the item class of course and i'll split the pin here for the transform uh and we want to spawn this pretty much in front of the player so what i'm going to do is say get actor rotation drag from that and say get forward vector so that's going to be the forward direction from our actor whatever way we're facing and now i want to add some to this so i'm going to say multiply and what i want to do is i want to get the actor location [Music] and we'll add some amount to that here which is going to be from this forward vector so i'll plug these in i can right click here convert pin convert to a float and we'll put it something like say 150 centimeters in front of the player okay and so what i want to do now is we need to want to add an impulse to the item that you've dropped so that it sort of pushes it out in front of you and so i'm going to use another interface message for that i'm going to go back to the pickup item interface and we'll add one more function here called push pickup item away okay and no inputs or outputs this is just strictly a message and we'll go back to the first person character blueprint drag from this return value and say push pick up item away okay and i'm going to go back to the pickup item parent blueprint and first thing i'll do here is go to class settings and add the same interface here the pickup item interface and i'll compile and i'll find an empty spot here right click and say push and get this event push pickup item away all right and what i want to do is grab the static mesh reference and i'm going to say add impulse we'll use the add velocity change impulse at location so that's going to add an impulse with no regard for the mass essentially and so what i want to do is for the location i will just say get actor location but i'm not going to plug that in directly we're going to add a little bit to it here and what i'm going to do is for the impulse i'm going to get the player camera manager and i can drag from that and get the camera rotation and i can drag from that and get a forward vector so we're going to get a forward vector for whatever way the camera is facing and so what i want to do for my impulse is i'm going to take that forward vector and i'm going to multiply it by uh some amount here so i'll plug this into impulse and i'll convert this to a float and i'll multiply this by something like 250. all right and for the location here what i'm going to do is use getactor location but i'm going to add and we'll plug this in here all right and what i want to add is an amount here from the forward vector of the camera so we'll say multiplied by plug this in down here all right and i just want to actually uh move over slightly i want to move say 15 units over uh in the x dimension and so that's actually just going to make it so that our impulse puts a small spin on the item as we toss it so it doesn't just go straight out in front of the player it's going to have a small angle a small spin on it all right so let's give it a try here and see how it's working i'll run around and pick some of these items up here and then i'll just click here and see if i can put these back on the ground all right yep perfect and so that's pretty much working uh as intended and of course there's still a handful of improvements you would need to make here to this system uh for example there's no check for uh the number of slots for example in the inventory or how big your bag might be or anything like that but of course those would be game specific implementations and so that pretty much wraps it up for this video and thank you for watching and we'll see you in the next video

Channel: BuildGamesWithJon

Views: 60,301

Keywords:

Id: t1ECs7CfPNE

Length: 44min 17sec (2657 seconds)

Published: Mon May 09 2022