Make an Action RPG in Godot 3.2 (P11 | Melee attacks with Hurtboxes and Hitboxes)

good morning afternoon or evening wherever and whenever you are my name is Benjamin and welcome to our Kudo action RPG series this will be part 11 and in this video we're going to be adding hurt boxes and hit boxes so that we can start attacking our grass and in the last video we set it up so that we had the grass effect that plays when we swing the sword for overpowered move here and one of the things that you guys mentioned why make a brand new scene for this grass effect why not just put the grass effect inside of the grass scene right here and that is a personal preference so that's actually a fine way to do it if you want to put the grass effect inside of the grass scene and have it not be its own scene you can do that i partially did it the way i did it in the last video for educational purposes so I could talk about instancing scenes in code and I partially did it that way because I actually prefer to do it that way now doing it inside of here is going to make it slightly optimized and if you have you know if if you have a game where you have a thousand grass pieces that you can hit with some superpower move and it's going to make them all play the effect at once you might be worried about that and you might have a good reason for the optimization otherwise you're probably fine without that slight optimization so then at that point it just becomes personal preference some people prefer to have it in the grass scene inside of here there are some problems that come up with that that method which is if you put it inside of here you're going to have to disable the hurt box of the grass while it's playing the animation or else hitting it over and over and over again could play the animation over and over and over again but that's not really I mean that's a problem that can be solved right it's not it's not a big deal so it at the end of the day it just comes down to which problems would you rather have and which do you prefer the people who asked me that I guess what I have to say to that is that that's actually a really good solution as well and if you prefer to do it that way then that's great you can you can do it that way it's a it's a good way to do it and I like to see people thinking about doing these things in their own ways right it's better for you to come up with a way maybe you prefer to do something a little bit differently that's good it's good for you to do it in your way and not always just do exactly what I say to do right I have my way of doing it and I like it this way and I have reasons for that but if if you have a different way of doing it that's okay too let's come into our well let's create two new scenes here and these are both going to be area 2d scenes okay so this first one we're gonna call it her heart box and this next one we're gonna call it hitbox okay you can save both of these scenes this one's hitbox will save this inside well let's actually create a new folder here I'm going to right-click do a new folder and call this hitbox hitboxes and hurt boxes no that's good enough and we'll save hitbox in here I will also say hurt save hurt box in here now both of these also need their own area to do a collision shape 2d so we'll save that come into this one we'll give it a collision shape 2d and save that now we're getting a warning here this warning says will you you created this area and you have a collision shape in it but you don't actually you didn't actually create a collision shape and that's intentional and that's because we're going to be using these kind of as components or as reusable pieces that we can apply to multiple different areas of our game and I'll show you how we do that but this hurt box and hitbox they they both use an area 2d and I want to talk about what an area 2d is a little bit here so an area 2d is a node that has to have a collision shape attached to it but once it does it can do some things like it can detect collisions you can detect if the player has entered it and if you look over at the signals here that we get these signals will tell us a lot of the different things that we can actually do with this area 2d we're going to be using these signals like for area entered in order to detect an overlap between our heart boxes and hit boxes so let's close out of both of these two scenes that we made and we're going to come into our grass here and we're going to click this little button right here and what this will allow us to do is instance a new scene that we've made inside of this scene and we're going to instance our we're gonna come into our heart boxes and hitboxes folder and we're going to do our hurt box on the grass now you can see that instance the scene here but we don't have access to the children of this scene so we can right click on it and we can do editable children and that will give us access to our collision shape so now we can actually set the collision shape for this will do a new rectangle shape we can set it right here and set this rectangle shape and you can do it any size you like I'm gonna make mine slightly smaller so that it doesn't quite take up the entire 16 by 16 space but now we have my heart box attached to our sprite or our grass I mean and we can take this heart box and we can say okay we want to be able to destroy the grass when this hurt box gets hit by a hitbox right when there's an overlap and so we'll come into our node and we'll come into our signals here and we can do air the area entered signal right here this area entered signal you can double click on it we can attach it to our grass so now when this heart box has an area entered signal on it with the area that is entering it we can destroy the grass so right here will say q3 right and will actually take this code right here where we create the effect and we'll make a function out of this function create grass effect okay once again if you have changed this part to where you have your own grass effect inside of the grass scene you're going to have to make sure that you disable your hurt box collision shape or whatever so that it can't be hit multiple times and reset this animation that you're playing create grass effect unless you have a different way of solving that problem but yeah the idea stays the same so we create the grass effect and well cue free and so this is what the code inside of our grass scene is going to look like now let's attach a Hurt box to our player let's come into the world scene open up our player scene not a hurt box a hit box although we will be attaching a hurt box at some point but let's start by attaching a hitbox hitbox okay I don't actually like the name of this right here let's rename it here I don't know we'll call it overlap for now because I don't I don't have a good name for it so we come into our player we have our hitbox here okay we need to once again right-click and do editable children so we can create some sort of shape here we're going to use a capsule shape for the hitbox on our player I'm going to shrink this down just a little bit and do something like that well couldn't save seeing likely depends dependencies instances could not be satisfied so maybe renaming the thing that we did was an oops E's let's actually delete this hitbox and try and save the scene there we go that seemed to work and we'll add a new overlap hitbox we'll add another one again ooh look it remembered it mmm that's interesting that might be a bug is this gonna let us save now it did so that seemed to work so if you have issues with that because of renaming this you might have to delete the hitbox and recreate it there I think that was a bug but it's hard to say I might have done something silly there I don't know for sure snark player has a hitbox but of course this hitbox just follows the player around it should still work though when we walk into the grass the grass gets destroyed which is kind of cool right because it detects the overlap there and then destroys the grass but we want to use our sword to destroy the grass and we want it to be attached to our animations so we can come into our animation player well first make sure that your animation tree is set to not be active anymore so that you can come into your animation player and we can pull up all the attacks and we want our hitbox here we want to be able to rotate the hitbox to face the direction that we're attacking with this sword so I'm actually going to create a position 2d node and a position 2d is honestly exactly like a node 2d except we get a visual indicator inside of the room for where it is there's a little if we actually hold alt and click on it and move it you can see this little visual indicator that node 2ds don't have but it's basically exactly the same and you can change the gizmo extents which just basically changes the size of indicator right so but we're going to actually position this at negative four and we'll call this hitbox hitbox pivot I think and let's see our transform should be at negative 4 and this hitbox right here we'll call this sword hitbox now I guess renaming it got rid of the editable children interesting so let's open up editable children again we'll attach it to our hitbox that also got rid of the editable children we need editable children to be on and we'll set the sword hitbox to be well let's come into our animation player and we're doing attack down let's set it to attack right and then we'll zoom in here a little bit and we'll scrub to this frame right here because this is going to be the best visual indicator of what our hitbox should look like I've found that a good size here and we can move this out right here to about there so that position mm-hmm so I accidentally moved the collision shape here so we want to set its transform to 0-0 we actually want to move the sword hitbox and we'll set its transform to zero in the Y so that it's right on our pivot and then a exposition of 15 I found that works pretty well in the collision shape if you click click on our capsule here we're going to have a radius of 10 and a height of 12 so we get a pretty big collision shape here for our sword okay so we can save this now and this represents so let's go over this again we have our hitbox pivot it's at position 0 negative 4 we have our sword hitbox it's at position 15 0 and then we have our collision shape which has a capsule size of radius 10 height 15 that will give you this exact scenario right here for as long as your animation is set up like mine with your player position right where your because this the position of your sprite is important as well and mine is set to negative 9 and the Y and 0 and the X so that's important to make sure this lines up as well but you don't have to do yours exactly like mine I just wanted to give you those values in case you wanted to so then what we need to do here is we need to key the rotation of our HR hitbox pivot so let's key this rotation which is 0 and we actually want that key I keyed it right here at this point but we want that key to actually be at the start of our attack right animation so I'm going to grab that key and drag it all the way over here to the left or you could just key it at this point so let's go to the attack down right and which way do we want our rotation to be for attack down we want it to be at 90 so that will rotate our our hitbox so that it is facing down here where the sword will be swiping will key this position now we want to do a tack left and we want to set our rotation to 180 that will face left and we want to key this position create a key make sure there at the start of the animation and then we'll do a tack up and we'll set our rotation - you can either do negative 90 or 270 it doesn't matter they both work and we'll key this position okay so that should work now we've got our hip box attached to the player in the front of the player so when we like if I stand right here and then I do the attack animation you can see that it actually swipes the sword and kills the grass however there's a problem ah you saw it just there so if I swipe down right now the hurt box is actually below the player so let's actually show this visually we'll come in to project visible collision shapes and show this like this and you can see now if I attack down it puts the collision box down but it's still active so I can just walk into the grass right I can I can put it up but it's still active so I can just walk into the grass up here so this collision box is set to being active all the time and we want to update that in our animations so let's come into our animation player and you can decide which frame you want it to be active on I like it to be active on this frame right here on this very first frame of the attack not this one but start on this one so I might come to our collision shape here and we're going to key the disabled property so key this okay but it's obviously not checked we just keyed it unchecked and then we're going to come to here at this frame I'm going to check disabled and key that okay so then it starts out active right here and then gets disabled at the end of the animation and we'll do that with down as well so what key is enabled here come over to this frame check it disable it and key it there then we'll do attack left come over to this frame key enabled come over to this frame disable it and key that and then we'll do a tack right same thing get disabled now you actually want it to start off disabled otherwise when we start the game it will be enabled and so we want to just check disabled and save so now it's set disabled by default and now when we start the game you can see that it draws it gray here and it actually doesn't interact with the grass but the minute we use an attack it enables it and positions it properly okay and if we now come back into our debugger and turn off visible collision shapes we can save run the game and this is going to fill a lot more natural for our sword swipe now we have hit boxes and hurt boxes enabled now there is a problem with this and I'm I guess I should probably go into it in this video I was trying to decide whether to split it up into multiple videos but I do want to address this problem right now because you know in this in this series I introduce things in sequence and so sometimes I'll do something because I'm trying to teach it but then it actually introduces problems that we'll need to solve and so the problem that we're going to run into here is actually that are our hurt box right here it's signal gets emitted whenever an area enters this area okay any area that's the problem so like let's say we come into our world and we grab this piece of grass and we stick it inside of that piece of grass you can imagine what's going to happen when we run the game they destroy each other right because it's any area that enters it so we even though we've labeled them hurt boxes and hit boxes there's actually no way for the game to know when one of them's a hurt box or one of them's a hit box so the solution to this problem and will come back into our heart boxes and hitboxes here the solution to this problem is called well you could use groups but I wouldn't recommend using groups we're gonna use collision layers and masks you can actually set these to give them names because they start off as just layer one layer two right but if you come into your project settings right here and you scroll all the way down to layer names and you do 2d physics right here we can give these layers names and so what I like to do is set up first I have my first layer be the world layer okay so that's where you would put anything that you want to be able to collide with like a solid object and then I like to have sometimes I'll do a player layer so but we won't do that for now we'll skip two layer three here and we'll do hitbox and then for layer four we'll do hurt box and well actually I want to check my reference project on this one okay yeah I'm glad I checked it because I actually changed how I do this for this project I think I found a different way that I would prefer so I have the world layer and then I generally have a player layer just in case something needs to detect the player and then I have a player hurt box and I have an enemy hurt box and I'll explain why we only need these in just a minute so that these are the four that we're going to create so in project settings under layer names 2d physics we're creating these layers okay world player player hurt box enemy hurt box close so what do we do here well first off I'm going to go into my hurt box and I'm going to turn off I'm gonna check both of these so that there are no white boxes in here so I'm gonna turn off both of those then I'm going to go into my hit box and I'm also going to uncheck both of those so they're not in either then I'm going to go into my player and I'm going to go into the collision shape here and for the player we're going to want to set where's our oh here we go the actual player kinematic body come into your collisions here and we want to put the player on so the layer is the layer that you're on okay think about it as in like you're sitting on the layer so the layer is the place that you are and the mask is the place that you're looking to so we want to put this on the player layer because our players on the player layer okay we want to look to the world layer and if you click on these little things over here you can actually see them okay so we're on the player layer and we're looking to the world layer and this is for our players kinematic body that way we can collide with the world so then we come into our world here come into your dirt path tile map know the dirt cliff tile map and you can set the collision on this so it's not going to be on the player layer for this one we can just set it to the world layer this doesn't have to look to any other layers it can just be on the world layer that's fine so our player is on the player layer rimes it's kind of annoying to say over and over but we're looking to the world layer if we weren't looking to the world layer we would no longer collide with our walls okay that's how important this is we need to be looking to this world layer so our mask should be the world that way we're looking to it and then we can properly collide with these walls so collision layers are they were super confusing for me at first when I first started learning Godot I was like I have no clue how to keep track of this in my head so I finally came up with the system of the layer being the thing that you're on and the mask being the thing that you're looking to write so that makes it easier for setting up our boxes and herb boxes so come into our grass and click on the hurt box here and we're going to say okay well this hurt box will be on the will choose a layer for the hurt box to be on we want this to be on the enemy hurt box layer because it's going to be damaged by swords and anything that an enemy would be damaged by in fact you could think of this grass as a non-moving enemy that's kind of how I'm thinking about it right now so it's a non-moving enemy so we're putting the hurt box on this grass to the enemy hurt box layer okay that makes sense now let's go back into the player and come into the sword hit box and come into collision and we want to set the mask to the enemy hurt box because the player's sword hit box should be looking for or looking to the enemy hurt box layer okay so that's why I have it set up that way now you can't just have any area collide with this grass the only area that will actually trigger the collision now will be an area that is looking to or on oh if it's on is that an issue to just just a realization here that might have been overlooked let's move this grass down here save and run the game if they're on the same layer they might trigger each other still too so no they don't they don't actually trigger each other and so now this works properly right only the hitbox layer only something that is looking to that that enemy hurt box layer can trigger the collision and the only thing that's doing that right now is our players hurt box so in the future when we make enemies we will give them their own hit boxes right but we'll use the same hit box scene that we've created over and over for all the hitboxes however the hitboxes on our enemies they won't look to the enemy Hurt box they'll look to the player her box well unless you want enemies to be able to damage each other then you could have them look to both and it's really easy but potentially you just want them to damage the player so you'd have them look to look to the player hurt box layer so the mask would be the player her box and there we go that's it so that is like I said it was one of the most confusing parts of Godot for me when I first started using it but using the layers and masks is really important for optimization if you want to have your game nicely optimized because then it won't even try and it won't even try and detect a collision if they're not in the proper if they're not if they're not on the same layer or mask they won't even detect them but it is confusing so don't feel bad if you're a little confused by it and let me know in the comments if you need more of an explanation let me move this grass back up there we go and finally I just remembered I do want to talk about this as well so I have seen this has been this has been an interesting thing for me in this series okay I have seen basically a divide in the Godot community as to when you should use process and when you should use physics process so we talked about this in the last video that from the research that I've done it seems that in the documentation they actually tell you not to use the move and slide function outside of the physics process and so my guess is that under the hood move and slide is accessing the position of the character and so it wants to have accurate data for that I want so wait until the physics process but then I've had other people say that oh but it getting input doesn't work quite as well inside of the physics process so I would I would lean towards the official documentation personally but there may be problems with this to that I'm not aware of I don't know the truth of the matter is I haven't noticed a problem with either of them they've both worked fine for me I think it's a little bit overkill for this example to get too deep into that I'm gonna go with the documentation and stick with the physics process here and if you have reasons for using the process function you can leave a comment below I'll look at those I take all of the comments seriously that you guys make but once again I'm going to stick with I'm going to stick with the physics process for this for my example and the main reason I'm going to do that is because of the Godot examples if you go to see the official platformer game the the Godot platformer demo it uses the physics process for the platformer demo that's why I've made that decision in the end it's such an easy decision to make it's such an easy thing to change so if you ever get new information you can just change it later it's not a hard thing to switch between these two anyways thank you guys so much for watching this video this was made possible by my Kido 1-bit Godot course Kickstarter backers as you all know now that your 11 videos in I'll leave a link to that in the description if you enjoyed this video and learn something let me know in the comments below and give me a like and subscribe to my channel and I will talk to you all later

Channel: HeartBeast

Views: 124,075

Keywords: Godot Engine, Godot 3.2, Godot 3, Tutorial, Series, Action RPG, RPG, Pixel Art Game, Indie Game, Game Development, Learn gamedev, Gamedev

Id: vDbEfmPcv-Q

Length: 29min 36sec (1776 seconds)

Published: Fri Apr 03 2020

Reddit Comments

[u/TheFirst1Hunter]

I'm not following this series but I want you yo know that I appreciate your work and I always think your the best option for teaching godot