Collision Pins? 💥📌 Now that's clever! 🐱 Scratch RPG #7

foreign [Music] scratchers Collision points just what are they well we are back for another captivating episode of our epic RPG series and at last we are going to work on adding Collision detection for our players and about time I hear you say but I have been putting this off for a good reason for simple tile sets we can assume each tile is either solid or not and that makes Collision detection real easy but not so or are more complex tile set for example some tiles are half a block wide and that Collision looks awful but worse than this we even have some pixel wide Dividing Walls oh man we need a more elegant solution now if you want to know more about my thought process then go back and watch my RPG devlog episode 2 but essentially I decided upon a cunning Collision system using nine collider pins we Define which bins are solid for each tile costume room and since the player is wider than the distance between pins we cannot pass between them but they can walk right up close to either side just perfect for our game to store this Collision metadata we label solid pins as one and non-solid as zero before working from left to right and then bottom to top combining them into a nine digit value this is our Collision pin value and they can be easily stored in a new tile pin list one row per tile costume enabling fast lookup for each tile as we look for collisions the next question is do we want to enter all these Collision values by hand well of course not there's over 500 tile costumes in our game man so stay tuned because we are going to be coding up yet another super awesome enhancement to our level editor to let us speedily draw our Collision pins directly in our game this is just too cool so what are we waiting for let's get scratching We Begin from where we left off in episode 6 making sure to save the project as a new copy for this is episode seven now let's start by making a new list to hold the tile Collision pin values we'll name it tile pins making it for all Sprites as all Sprites will need to check for collisions so in theory if we were doing this all by hand we could identify the first tile costume number in our costume editor that's costume number 20 and then in our new list add rows down to the corresponding item 20. we enter the Collision string one zero zero one zero zero one one and that would be that not so hard huh but times that by 500 costumes and it would take us a very long time and would be even harder to track down our mistakes yep we're bound to make them so let's hide that list for the time being and we'll focus on making the Collision pin editor okay make sure you are in the tiles Sprite now and we want a way to toggle the Collision pin editor on and off so make a new variable naming it palette meta editor for this Sprite only hold on what does meta mean well metadata is any data that is information that describes something about another bit of data and this list will contain Collision data describing our tile costumes so set palette meta Editor to zero right when the green flag is clicked then to toggle it on and off when key pressed and we'll use the P key for palette do you think we'll remember all these key codes though now we'll toggle the value by setting palette and meta to one subtract the palette meta editor cool feel free to press that P key right now and just confirm it is toggling on and off between 1 and 0. yes super good job little variable next up we'll want to paint the Collision pins themselves overlaying them upon our existing tiles in the palette for this we can find the Define paint palette now if we just scroll down until we find the second stamp which is after we switch to costume gidx here and remember gidx is both the grid position in the palette and the costume number since they are laid out one after the other sequentially so after stamping the tile costume we want to draw the pin on top let's make a new custom block for this naming it draw Collision pins and we're going to have two inputs X and Y tick to run without screen refresh and then click ok but we only want to draw these pins when the meta editor is enabled with that P key if palette meta editor is greater than zero then and drop in the new draw Collision pin block the X and Y we can just borrow from the current X position and Y position of this Sprite I'll explain why we need these later cool we just dropped that right in after we stamp the tile costume in the palette and now to draw some pins how exciting we'll start simple a single Central pin for each tile and we'll use the pen to do it set the pen size to 5 pixels and set pen color to Pure White okay then to paint a perfect circle simply use the pen down and the pen up just like jabbing the paper with a felt tip pen in theory that should do the trick so smash that green flag and then with the level editor open tap the P key to enable the palette meta editor and there we go a perfect white dot should have appeared at the center of each tile in the palette a brilliant start and they are easily toggled on and off with the same P key with that success we can try to expand this to draw a small grid of three by three pins per costume that's nine pins each we've created plenty of grid bass Loops by now so this should feel very familiar so separate off the set color and Pen down and up scripts first we'll need them soon enough we want to begin drawing the first of our nine pins offset below and the left changing X by negative 11 which is a good value and change y also by negative 11. that's just around a third of a tile width now we Loop repeating for three rows of pins and again for three pins in each row or columns if you will then in our Loop we do the drawing so drop those scripts back in there we just need to ensure after drawing each pin that we move on to the next pin position change X by positive 11 pixels then once a full row is complete we need to move up a row but not before we reset back to the First Column again to do this we change X by and this could be negative 11 multiply by 3 because we've done it three times and that will be negative 33 right then we can change y by R11 to move up to the next pin above sweet are we done not quite because after moving the Sprite in this script we must ensure to return it to where it was before this script ran otherwise the Sprite palette will not continue to paint correctly so go to x y and luckily we had the forethought to pass the starting position of the Sprite in as inputs X and Y when we created a custom block how thoughtful drop the X and Y into the go to X Y block at the bottom of this script Splendid because now we get to test smash that green flag and press P had wow look at all those funky white dots these will be perfect for visualizing our Collision pins don't you think and we can still scroll around the palette to get access to all the other tiles cool let's move on next we Define a collision pin string making a new variable naming it pin string for this Sprite only and let's push some random pins into this set pinstring to one zero one zero one zero one zero one that should be nine pin digits in total do this before we start moving the Sprite into position up here now as we loop around in these repeat Loops we need to keep track of which digit or letter of the pin string we have reached so another new variable and name this one I for integer we'll Begin by setting I to 1. for the first letter of the pin string and we move on to the next letter using the change I by 1. before we loop around again down here perfect that will loop from 1 up to nine as we progress through all the pins this script is getting a bit long though so I'm going to pull out the pin painting from the repeat loops make a new custom block naming it draw pin of type with the input type and run without screen refresh this will replace these pen scripts but make sure to leave the change X and the change I variable in the repeat Loop next place a call to draw pin type back in the loop before the change X like so but now we need the individual pin values from the pin string that would be a 0 or a one how do we get a single letter from a variable well using the letter of block of course the letter we want is given by our new I variable one through nine and it's coming from the pin string variable yeah I'm liking that so each of the ones and zeros will now be passed one at a time through to our pin drawing script over on the right we just need to distinguish which type it is a one or zero and change the color appropriately if else putting the pen down and up blocks underneath the set pen color then goes inside the if okay so our condition is whether the pin type is firstly a one a solid pin and I'm opting for a nice sky blue to represent a solid pin the else is for non-solid Pins just a placeholder really but it's important we can still see it so set the color to white so how is this coming along hey take a look at this it's working great our simple pin pattern one zero one zero one zero one zero one has made a lattice of blue and white circles but I feel that the white circles are too solid looking we need to ghost them out drop a set pen transparency to and whap it right up to 90 percent okay yes that's more like it it's obvious now which pins are on and which pins are off solid and not solid we can have some fun with this now testing out different pin combinations by changing the ones and zeros in our pin string variable yeah that's really fun I love playing around with that but our goal is to feed these pins from the tile pin list we created right back at the start of the episode no problem replace that fixed string with an item of list block switching it to the tile pin list and the item number of this tile costume if you remember that is stored in the grid index gidx variable right starting at 20 and counting up for each costume in our tile palette so this is interesting bring back up the tiles pin list see where we ended a pin string for costume 20. so if we run the project and press P would you look at that there is our manually entered Collision pin string represented as colored pins that is really funky shall we try adding a new one for costume 22. it only registers when you click out of the list there you go this is So Meta awesome work as you can imagine now that we can visualize our pin layouts we could just go through each costume and enter the pin strings by hand matching them to the costume Collision boundaries but there are still a whole lot of them to go through so instead we'll make it possible to toggle these pins right here in the editor too before we continue though let's clear down the entire tile pin list using a delete all of tile pins careful not to accidentally delete your grid list otherwise goodbye level if you ever did do that you'll just need to pop into the level store Sprite and run the new level script by hand to start up a new Fresh level brilliant find the draw pin of type block and as we draw each pin we can now check whether the user is trying to toggle it on or off with a key press if how close is the mouse to this pin distance to Mouse pointer if it's less than 5.5 that's half the distance between pins 11 divided by two then we know our Mouse is over this pin so if else and check for a key press the number one one for a solid pin right now actually setting pins is not super straightforward so let's make a new custom block set pin with an input of pin hash pin number that'll be the pin number from one to nine followed by the label of tile with the input tile hash that'll be the costume number of our tile followed by the label 2 and a final input of value which will be either a one or zero for the time being wow that was a long one hit run without screen refresh and we can script this baby up first though let's put it in place the pin number is given by the available I the tile costume is grid index gidx and the value we are setting the PIN to well this is the one key right so set it to one great so what if we want to set it back to zero sadly we can't use a zero key as that turns the level editor on and off instead then we'll use the X key like a delete or remove key and we set the PIN to zero and this is where things get interesting firstly we are asking to change the pin layout for the tile costume tile hash now assume tile hash is tile number 20. what if our list doesn't have 20 items in it yet we can't update a row that doesn't exist so we need to fill the list with rows first to do this we repeat and we use a subtract starting at the number of items that we require that's given by the input variable tile hash and in our example that's 20 so we subtract from that the number of items already in the pin list right now that's zero so this would Loop 20 minus zero that's a full 20 times great so add to the tile pins list 20 times but careful now the value we add should be a string of nine zeros one two three four five six seven eight nine zeros careful to get the right amount exactly nine okay shall we give that a test to confirm use a new set pin block setting pin one of tile 20 to the value 1. the tile pin list starts empty and after we click the test set pin block voila we now have that required 20th item ready to update its pins let's pull out item 20 and take a look set pen string to item of the list tile pins and we want the item given by tile hash that's item 20. run that test again clicking the set pin of tile 20 again and now the pin string variable should be reporting all zeros yeah brilliant this is the PIN string we want to update but hold the phone this next step is the tricky bit how do we change one digit of this string value without affecting the other digits well there's a number of ways but let me show you my favorite We Begin by splitting the letters up into yet another new list naming it split for this Sprite only start with it blank deleting all of split and then repeat looping through all nine digits of pin string we want to add each letter of pinstring to the new list name split and we know to get the digits out we'll need to use a letter of and drop in the pin string but which letter do we begin with it should start with one and then go on to two three four Etc we could use a new variable but think about this the current length of the split list is zero right because it's empty so zero plus one gives us one and that is the first letter of pen string now once we've added this letter to the split list we repeat around for a second letter how many items are now in the split list that's right one since we just added it so length is now one and one plus one is two so we get the second letter added to split and this repeats each time around adding the next letter until all nine digits are added to our split list shall we see that in action click the test script again and ta-da we have all nine digits split out into our split list well at least it looks like it but it's hard to tell because these are all zeros anyway so for now you'll just have to take my word for it but why did I go to the bother of putting all these digits into a new list shall I show you a really funky scratch feature tell me in the comments if this was new to you drag out the list reporter itself into your project and try clicking it to see its value well this is showing as a single nine digit value again even though we are looking at the value of our list now usually list report items separated by spaces but under the special circumstance where every item in the list is one digit long instead it Returns the list as a single value without spaces and this is Mega useful for putting string values back together again right then we get ahead of ourselves though first we must actually update the pin luckily that's easy replace item of the split list and the pin number we are changing is given by the input pin hash the value we are setting to is given by the input value nice that gives us a chance to test our script again and now we should be able to confirm that it does actually replace item 1 in our split list with a 1 as requested that's great news and it means that if we now click the split list reporter again and there you see the first pin has changed to a one really useful indeed all that's left then is to stuff the updated pin value back into our tile pin list to store away that important metadata replace item for item number tile hash that's our tile costume of the tile pins list of course with and this is my favorite bit the list reporter split yes you really can use lists like that watch what happens when we run our test script now tile pins item 20 is all zeros but after running the script now pin one of item 20 is set to 1. let's try that setting pin three to one instead click and look now both pins one and three of item 20 are set want to reset pin 3 back to zero it's easy see how about pin three of item 21 201 that's a new item entirely click looking down in the list and there it is just pin three of item 21. isn't that an awesome little script that we've put together so guys what are we waiting for if this is correct then we should be able to run the project and actually see these pins being changed in the level editor remembering to click P to see our pins yes there they are I should be able to inject new pins in real time by simply changing the set pin test script and clicking it that is fun a new PIN at Pin five but you know if I just hide all these available reporters don't forget that before coding up the set pin script we already coded up the key presses to allow us to change pins in the level editor So in theory with all the pins showing we just need to hover over a pin and press the one key oh my gosh would you look at that oh oops um what I didn't anticipate is that I already use the one key to toggle layers in the editor yeah oops I'll fix that in a moment in the meantime enjoy pressing X to remove a pin Splendid this is working brilliantly right let's address the key binding issue the easiest solution is to prevent the changing of layers while the meta editor is enabled so find the when one key pressed yeah this uses the set layer block from down here so we can disable this from there just surround this inner if else with a new if and check if pallet meta editor is less than one and with the pin editor active pressing one now doesn't switch layers any longer cool until I press the P again and then switching layers is active once more that's great because that actually means as the outro music begins we are finally free to start laying down our official Collision pins and it's so easy holding down one to draw a solid row of pins an X to tidy up any mistakes in our next RPG episode we will actually add in the player to tile pin Collision scripts so if you haven't subscribed to this channel yet do it now so you can get alerted as soon as the video comes out yeah check the notification Bell and all also if you haven't given this video a thumbs up then please do smash that like button now as it makes all the difference to getting my videos seen by other fellow scratchers thank you so much there's been a lot of interest in my early access membership of late and that's no surprise as members get to see my videos early not only getting the chance to get ahead of the game but also having added perks like priority replies to comments and custom Channel Emoji for those of you who are teachers or Educators please consider supporting my channel too either through patreon or by becoming an inner circle member of this channel it's a small price to pay for the work I put in and you get the bonuses of access to my finished projects and that is it from me today I hope you've enjoyed the video and I look forward to seeing you next time until then have a great week ahead and scratch on guys [Music] [Music] thank you

Channel: griffpatch

Views: 111,551

Keywords: scratch level designer, collision pins, collision detection, collision detection in scratch, tile based collision detection, rpg collision, clever coding, coding collision detection, how to code collision in scratch, how to code collision detection, scratch rpg tutorial, scratch rpg game tutorial, scratch zelda, coding zelda, scratch tutorial, griffpatch, tile stamping, level editor, scratch grid list, rpg scratch tutorial, scratch.mit.edu, scratch programming, Metadata

Id: xSt7aF8MNn8

Length: 26min 3sec (1563 seconds)

Published: Sat Oct 29 2022