How to Build a Complete 2D Farming Game an 8-Hour Tutorial Series - Godot 4.3 - All 25 Episodes

Would you like to learn how to make a 2D top-down game using Godot you are in the right place and this series will guide you step by step. You will create a 2D

top-down farming game with detailed tutorials on how to use Tilemap layers and create scenes with Y-Sorting allowing your player to move seamlessly in front

of and behind objects. You will also design tools that let players chop-down trees, mine stones till the soil and grow crops on your

farm. In this series you will interact

farm. In this series you will interact with other characters using a dialogue manager adding depth and interactivity to your game. You will also learn how to

grow your crops using day and night cycles that bring your farming game to life. You will learn how to speed up your

life. You will learn how to speed up your development by creating custom components like hit, hurt, damage, collectible, interactable, and navigation

components. Plus, you will set up smooth

components. Plus, you will set up smooth NPC movement with navigation regions and navigation agents to ensure they navigate the environment effectively. You

will create interactive UIs and style your controls using theming for game elements such as the tool, inventory day

and night panels, giving players a seamless way to interact with your game.

This tutorial series is packed with techniques and tips to help you design and build your own 2D top-down game.

[Music] Now before we begin creating our game we will use the Sproutlands asset pack by cup-nooble you can find this on

itch.io and I will leave this link in the description below. So once you've

description below. So once you've downloaded the asset pack we will then unzip this pack and organize the assets into different folders and we'll rename name them. We will do this before we

name them. We will do this before we start creating any scenes for our game.

Now let's hop over to Godot once the game engine loads let's create a new project and for this game we will call it Croptails and if you leave create folder

checked, it will automatically create you the game folder in your project path so feel free to set your preferred project path before setting up the project and

game name. We will leave the renderer on

game name. We will leave the renderer on Forward+ and for Version Control we will just set this as None however if you do prefer to use Git and you do want

to add this into your source control then leave the version control metadata to Git and it will create you a .gitignore

file automatically in your game folder.

Now let's select create and edit. Once the

editor loads you can see that you have your scene and import on the left hand side, your editor in the middle and the inspector, node and history on the right hand side. With the file system

hand side. With the file system underneath scene and the ability to modify files underneath. However in my tutorials I have my own layout. So I can

select this by using the editor layout option and this is a layout which I have already created myself and I have saved.

So you won't have this layout. So what

I'm going to do is I'm going to just change to this and you may wish to use the same layout so just move the panels by changing the dock positions and once you

have the same layout as this, just go to editor and save the layout. You may wish to use the same layout as me so that it is easier to follow the tutorial steps

as I'm moving files around, creating scenes or changing variables in the inspector. As we are only creating a 2D

inspector. As we are only creating a 2D top-down game we don't need the 3D editor options. So to make the editor a

editor options. So to make the editor a little simpler and to remove this 3D option here and also remove the 3D scene from here. We can say editor manage

from here. We can say editor manage editor features and just turn off our 3D options. This is where you can turn

options. This is where you can turn features for the editor on and off so we can just click this here, if we click okay you can see that the 3D option has

been removed here and we can't choose those 3D scenes. Our editor is now ready so we can begin bringing over the assets from the Sproutlands asset pack in the

root folder. Let's create a new folder,

root folder. Let's create a new folder, and we will call this asset, click okay, and we can then go inside this folder. In

the Sproutlands asset pack. Once you

have unzipped this you will get a characters folder, objects folder and tilesets folder. What we will do is just

tilesets folder. What we will do is just highlight these folders and drag them into the assets folder. These assets will now be imported. I will now rename the

folders and the file names so that we follow some good practices. I will make them lowercase and the spaces underscored.

[Music] So I have now finished renaming the folders and all of the different

assets and it's always good to follow a naming convention. It keeps everything

naming convention. It keeps everything neater and also it is better organized as well. I will now create a new folder

as well. I will now create a new folder and call this game and I'll just move these asset folders into there and in future tutorials we'll be adding more

assets for the UI and also our sound effects and music files as well.

[Music] I will show you how to create tilemap layers in Godot to better organize and separate different types of tiles in

your game. These layers offer more

your game. These layers offer more control and flexibility compared to the older tilemap node. Plus, I will guide you through creating animated tiles to add

dynamic effects to your game environments. Let's begin by creating a

environments. Let's begin by creating a new folder and we'll call this scenes.

Click okay and inside the scenes folder we'll create a new folder and call this test. Now let's create a new 2D scene

test. Now let's create a new 2D scene press F2 on the node and let's call this test scene tilemap and press enter and let's save the scene. So we'll save that

in our test scene. I'm going to use a different

scene. I'm going to use a different approach to building this game from the last tutorial series. I'm going to use many more different test scenes so that we can create the different components

in isolation. This means we'll have a

in isolation. This means we'll have a test scene for tilemaps a different test scene for our player, our different NPCs and other scenes that we create and add

to our game. Now the benefit of creating test scenes is that we can create all the different components in isolation.

Therefore, at the end, when we create the level and put all of our components together, if we find that something isn't quite working we can always go back to the test scene and see whether or not

that game component is working in isolation. We will start to create our tilemap

isolation. We will start to create our tilemap by adding some tilemap layer nodes so let's go and add a child node and we will choose node 2D and let's call this

game tilemap and then we'll add some tilemap layers, so add child node again and as you can see the tilemap has been marked as deprecated and this was used

in previous versions of Godot. The

difference between Tilemap and Tilemap Layer is that in tilemap you used to create the layers inside the tilemap. Where as now we create different tilemap layers so choose

this option here and we won't use this in future. So click create and press F2

in future. So click create and press F2 and we'll name this as water and in the tileset if we just pull this up. Let's

just click on here and click new tileset and right click save as, and we'll do a new folder in here and

we'll call this tilesets, and inside the tilesets folder we will call this game tileset and click save.

This will now give us a new tileset here now click the tileset pane at the bottom so this brings up the tiles and then in the tilesets folder click and drag the

water PNG file into the tileset. Now

when this dialogue displays we don't want to automatically create the tiles in the atlas so just click no here and the reason is is that these tiles are

going to be animated. So let's just click the first tile to add that to our Atlas now choose the select option and click

the first tile. Now to animate the tiles we have four tiles as columns so for the columns choose four. Then what we need to

do is add an element. So click add element, will add the next tile in the sequence for our animation and if you look at frames we have a 1 second

duration for each animation so I'm going to reduce this and make this 0.2 seconds so choose 0.2 and then add the element

0.2 again add the element for the very last tile in the frame series and then just change that to 0.2 now let's begin drawing the water tile so click on tile

map at the bottom pick the first tile as these are all animated tiles and then choose the square option and in the top left corner let's just drag and draw

those tiles so let's begin running our first scene now usually we use the Run button here but because we are creating test scenes and running them in isolation we are going to just use run

current scene so click this button here and it will launch the window so we can see that our water tiles are now in the top left corner and they are animating but what we need to do is to

set some further project settings which sets the viewport resolution correctly we will also set some integer scaling so that we have our pixels rendering

correctly and we will also set up the test window so let's just close this window let's head over to project settings and under the display option choose window and we'll see that the

Viewpoint width and height is currently set to 1152 and 648 now I would like to use a lower resolution and my monitor is set to 1920

and 1080 so I'm going to put 1920 and then divide that by three which will give me a resolution of 640 and for the viewport height I'll put 1080 and also

divide that by three which will give me a viewport width and height of 640 by 360 I will leave the mode here to window but in the future we will use options

such as exclusive full screen and what we'll also do is set the stretch mode to the viewport the aspect ratio we will change to keep height in the scale mode

we will set this to be integer and setting this to integer will stop the pixels from changing size when the window is being stretched and this

option is much better for low pixel resolution games so what we'll do is let's just close that as you can see the viewport has now changed here and you may

notice I don't also have a camera in my scene and we don't need one in the test scene as long as I draw the tilemap within the Viewpoint window here so

let's now run this current scene the Viewpoint window has launched I'm just going to check my settings again because the window size is slightly smaller but

actually let's switch on advanced settings and we can override that size so let's say 640 and then multiply that by

two and we'll say 360 and also multiply that by two and just enter on that let's close that again and let's launch our test window so as you can see the

animation is now working on the tiles and we have our water tiles here so let's close the window so I'll explain a little bit about exclusive full screen

if we launch the window again our game test window is 1280 by 720 yet the pixel resolution for the game is

640x 360 so if we just maximize the window you will see that because we set integer scaling we will get these black bars

around the game and this is so that the pixel resolution is always correct in integer scaling and this prevents the pixels from stretching so when you

finish the game you would want to run the game as exclusive full screen so let's just close this window and then go to Project settings and choose

exclusive full screen and then close that and then when you launch the scene again it will launch as full screen and you can really clearly now see the

animation in the pixels let's just close the game and return back to Godot and go back to project settings and we'll just change this back to window and just

close that so now let's continue drawing the water [Music] tiles we'll just cover our viewport now let's add another child node and

create another tilemap layer we'll call this grass and we'll assign the game tileset now let's drag the grass PNG into

our tileset and again we won't click to add all of the tiles we'll choose them ourselves so with the grass tileset loaded in the tileset we'll now add these

two the atlas by just clicking them so in setup have that selected and then just start choosing your tiles so we'll select the following tiles here and then

what we can then do is go to the select option and select single tile and under terrains we will need to add it to a Terrain set so go to the tileset here

and under terrain sets let's add an element then we'll add another element here and in this terrain here we'll name

this as grass terrain and just enter that then in the terrain set we need to increase this to zero and as we have only one terrain here will'll also

increase that to zero as well now in paint we go to the paint properties and select terrains and we need to choose

the terrain set zero then in terrain we will choose grass terrain now let's then set all of our grass terrains until

we reach the last one then we need to paint the bit mask and keep painting the bit mask

[Music] through until you have something that looks like this so just missing a little

bit on there okay and then save that now that we've created all of our bit masks we can then go to tilemap go to the terrains option and you can see that we now have

a grass terrain which we created in our tileset so choose the square option and let's now start to create an island so

we can now draw some options on there we can start creating some of our shapes I'm just going to add a little bit more and if we run the current scene you can now

see that we have an island floating in the water if you then choose the water tilemap layer you can see that the grass tile map layer is disabled so

you can now draw on each of those layers now let's add a new tilemap layer so click game tilemap and add a child node and choose tilemap layer and click create

now let's name this as tilled dirt and enter and then in the tileset let's load the game tileset go back to tiles and

in the tileset let's add the tilled dirt wide PNG click no again for automatically creating the tiles and

with setup selected let's choose our tiles then click select and pick the first tile let's just move this up a little bit more and then click tileset and

open it and we want to add another terrain so let's add an element here and in this terrain let's call this tilled

dirt terrain let's just choose a different color then in the terrain set here just let's add that terrain and it

will be number one because the first element is at array zero under terrain so it's zero and then one and then go to

paint but on this one we want to choose the same terrain set but tilled dirt and then let's paint those so we'll choose them all and then let's paint that bit mask

[Music] in and we're creating the same bit mask as we have done for the grass layer now let's head over to tilemap and choose

terrain as the option but choose tilled dirt and we'll just use the pen and then let's zoom in and let's start to draw some

terrain and then we'll go and draw a little bit more terrain here so this will be the tilled dirt where we start to add our crops later now let's create

another tilemap layer to add flowers and other nature elements so we'll go add child node choose tilemap layer and then rename

this to Nature once that's been renamed we can then load a tileset so go to quick load and load the game tileset

then click tileset and in the assets game objects folder we want the basic grass biome things so let's just click

and drag that into the tileset but click no for automatically creating the tiles with setup now selected in the tile set

we can now begin adding some of these sprites so we'll click this tile for the mushrooms these leaves and rocks this

log stump and log the flowers the rocks in the water and these Lily Pad as you can see I've got sunflower here which

stretches over two tiles so hold the shift key down before selecting the first tile then click and drag and it will select and create a larger tile I'm now going

to finish adding the other tiles now click on tilemap go to tiles let's zoom in and let's begin adding these tiles to

the scene so we can now test that we are rendering these tiles [Music] correctly now as you can see in the

editor some of our images are blurred so what we need to do is to update the texture filter settings so go to project project settings and under rendering

and textures the default texture should be nearest because we're using pixel art so then just click close and you can see that the pixels are now defined much

better let's test the scene and when the scene launches we can see that our assets are now rendered correctly let's close the scene and that brings us to

the end of this tutorial on how to create a tilemap with different tilemap layers such as the grass water and tilled dirt we can also create a nature tilemap

layer which holds the different assets such as the mushrooms and the trees [Music] I will show you how to create a

player character with animations and a state machine you will learn how to make the idle and walk states for the state machine and then transition between them using your keyboard

inputs so before we begin creating our player let's head over to our scenes folder and in the test folder let's create another test scene for our player

let's duplicate this scene just call it scene default so that we can duplicate the scene in future. Now open up test scene default and we will just delete the tilled

dirt layer and also the nature layer so this test scene will always be used for other components such as a player and other NPCs and we can just duplicate

that let's just save test scene default and duplicate that scene again and we'll call it test scene player click duplicate and open up the test scene

player and now we can create a new scene so scene new scene a new 2D scene and let's just change this type so we'll use

a character body 2D and let's then rename this to player and in the scenes folder let's add a new folder

call this characters click okay in the characters folder create a new folder and call this player okay and save our scene in

the characters player folder click on player add child node search for animated sprite 2D

create and in the Sprite frames let's create a new Sprite frames and then open that and in the add frames option let's

go to assets game characters and choose the basic character sprite open that and choose the first two so zero

and one here add those two frames and let's just zoom in on the player and just play that okay pause that animation and then let's rename this to idle front

and then set the animation to be default on play by clicking the default here so this is autoplay onload and then add another animation we'll call this

idle back click add frames choose basic character sprites again and we'll choose the second two here add the two frames

and just play that okay add another animation and call this idle left add the frames and choose the left ones play that again zooming a bit more add

another animation and we'll call this idle right add frames open the basic character sprites once again and then add the last two frames and we'll just play that and for each of the

animations we'll keep looping on now as we play the animation it is a little quick so let's just reduce that to three frames per second and let's just set that for each of those

animations now add a new animation and let's add the animations for each of the tools add a new animation and call this

tilling front add frames and we'll choose the character sprites this time so we'll change the horizontal to be two and increase the vertical so that we've

got 12 choose the top two and add those frames let's just play that let's stop that and reduce the frames per second to

three then add frames again and rename this to tilling back add the frames choose the character sprites again and then choose the next

two we change the frames per second to three add new animation call this tilling left add the frames character sprite

open and then we'll choose the next sequence of frames play that and just stop and change the frames per second to

three add new animation tilling right add the frames character sprites and open and then choose the next frames in the

sequence for tilling right change the frames per second to three and let's do the same for the axe tool so add new animation and rename this to chopping

front add frames choose character sprites and open and choose the chopping animations so we just zoom in on there you can just see those a little clearer

and add those two frames let's change the frames per second to three and add a new animation call this chopping back add the frames out to Sprite

and we'll choose those two animations change frames per second to three and add another animation call this chopping

left add the frames car to Sprite and choose the two animations so add those frames and change the frames per second

to three add another animation chopping right add frames character sprites and open and we'll choose the chopping right

animation and add those two frames change the frames per second three so click add animation and rename this to

watering front add frames to character sprite and then just zoom in and choose the watering front Sprites add the

frames and change the frames per second to three add new animation and say watering back add frames character

sprite select the Sprite and add the frames and then just set this again to three frames per second add animation

watering left add frames character sprite open and choose the watering left animation and add those two frames and

then choose three frames per second and then add the last animation for watering we'll call this watering right add frames character

sprite and then choose the last two frames in the set add the two frames and then set three frames per second now for

our last set of animations we want the character to walk so add animation again and we'll say walk front add frames but

choose the basic character sprites this time and we want the top two Sprites here so we've got walking front back left and right so add those two frames

three frames per second add new animation walk back add frames basic character sprites and open and then

choose those two sprites change that three frames per second and then add another animation walk

left choose the basic character sprites and open and then choose the left walking animations and then change that for

three frames per second again and then for the very last animation we will use walk right add frames basic character

sprite and choose the last two frames in the set add frames and then change this to three frames per second now that we've completed all the animations we'll just

select idle front just to reset the animation here then let's just click on animated Sprite 2D and then using the

arrow keys we can move the Sprite so that it sits on the x-axis so we'll just sit those feet there on the x-axis and

then here we have a message that informs us we need to add a collider so we'll add a collision shape so we use collision

shape 2D and in the shape option just click this and choose new circle shape and then we'll just click and move this

up just drag that and make it a little bit smaller and then it just covers the player so before we move on to creating the player State machine and all of the

player State let's just go to the test scene player and add our player to our test scene scene so go to the scenes folder and in the character player

folder just drag the player onto the scene then let's run the current scene here and as you can see the player is

now on our test scene and the animation is now playing let's close that window now before we create our state machine let's add some of the keyboard inputs so

we can allow the player to walk so go to project project settings input map and add new action so we'll say walk up

add click the plus key here and then click the W key then add again and click the Up Arrow key then add a new action and

say walk down add click the add button here click S add again and the Down

Arrow key add another action left add and then add key to listen for the input

and click A okay add and then the Left Key and then for the final action we'll say walk right add and then listen for

the input so we want D okay add again and the Right Arrow key okay so this sets up our inputs let's just close that and then save all now that that we have

set up our inputs for our player we can head over to the player scene and we can begin creating our player State machine the state machine makes it easier to

create the actions that the player requires such as walking tilling watering and other actions for the player we could create all of these

actions using a state machine in a single script however I'm going to show you how to create a state machine using

nodes and each action will have its own State node and you will see that when we use the state machine you'll have better control when you transition from each

action to another action I have covered State machines in previous tutorials so I'm going to ask you to download two scripts from my GitHub we can install

those two scripts into this game and then I'll explain the functions once more so head over to my GitHub I will leave the link in the description below

and download the node State GD file and the deo state machine GD file and this can be found under tutorial components and

scripts scripts and this state machine here so let's begin downloading those so just click on the file and then just click download file

here and then go to node State machine and just click and download the file file again once you have downloaded the node State machine script files go to the root folder let's create a new

folder and call this scripts in the scripts folder create another new folder and call this state underscore machine and

then drag and drop the files inside of the state machine folder and this will copy the two scripts over so we can then view these when we use the node State

machine script the initial node state will hold the very first node and then the node States will hold all of the other state nodes the current node state is

which current node are we currently running and we also hold the current node state name when the game Begins the children of the state machine node will

be held in this array here so we hold the node State and we then connect the transition to method which enables the

node to transition from one node to the next then in the ready method when the initial node starts we will enter into

that node the process method is then called as the game runs and we get the current node State and then we go into

the onprocess method of the current node at the same time on the next frames the physics process method will be called

and we will run the on physics process method of the current node and then we will go to process the

transitions so this is a new method in this state machine so we can separate the input checking which allows us to

then navigate to another state if those input conditions are met the transition to function allows the node to transition

from one state to the next and as we get to here we will exit State node and then we will enter the next node in the node

State this class is attached to each of the state nodes in the state machine we have the on process on physics on next

transitions on enter and on exit however these methods are overridden so we will use this script class to then attach our own methods inside

and as you can see the on physics process method here is what we call here so we have this on process on physics on

next transitions on exit and on enter are these methods which are being called on the actual State node once we have created the state machine and added the

two nodes which is idle and walk I will show you how to debug the state machine so that you can see how those methods are being called and that will help you

when you create your own State machine for future player characters or NPCs and then you'll be able to adapt this state

machine and create your own states so click on the player node add a child node and just choose node itself let's rename

this node and call this state machine and then click and drag the script and drop it on the node then add another child node choose node again and create

and we'll call this idle then add a script and we'll call this idle State now in the state machine script

folder open node State script and then just copy everything out of there and go into the idle State script and paste that in we now have an error message

where the class name is what we want to do is copy node State and just replace node with that and then just remove the class name because we want to actually extend node state here and then just

remove these two items here because they are actually in the node state class so if you press control hover over the class name and click it you can see that it

extends from that go back to idle State script and just save that in the idle script we now need to export two variables so type at export for player

and character body 2D and another export variable which is the animated Sprite 2D animated Sprite 2D then on the state

machine Let's assign the initial node this will be idle and on our idle node let's assign our player and assign the animated Sprite 2D then let's add

another variable called var Direction which is a type Vector 2 and in the on physics process we will say if input is

action pressed walk left and Direction equals Vector 2 dot left else if input dot

is action pressed walk right then Direction equals Vector right else if input dot is action press walk up direction equals

Vector 2 dot up else if input dot is action press walk down Direction equals Vector

2 dot down and finally else Direction equals Vector 2 dot zero then we need to say if Direction

equals Vector 2 dot up and animated Sprite 2D play idle

back else if Direction Vector 2 dot right and animated Sprite 2D play idle right else if

Direction equals Vector 2 dot down then animated Sprite 2D idle front else if Direction equals Vector 2 dot left

animated Sprite 2D play idle left and finally else animated Sprite 2D play idle front so first we get the input

action from the user and the player will then turn the direction left right up or down and then we'll take this direction and play the associated animation for

that direction let's save that now let's click the test scene player or load this from your scenes test folder and then let's run that test scene and

if you see the player here let's now use the WASD on the keyboard and if you hold the key down you can see that the player

now turns in the correct direction so let's just close that window it is also possible to debug your scripts if you just put a break point on line 13

where it says input dot is action pressed walk left then run the test scene again and you can then use F10 on the keyboard

or you can use these options here to step over step in but I'm just using F10 on the keyboard and I can see what my options are on here so it's currently

going into Direction zero on here but what I'm going to do now is I'm actually going to put the break point on 18 so that when I do press the input is action

up I want it to land on this direction here so press F12 to keep running now I'm holding the D key for right and when I press the W key it will instantly hit

this break point because this condition here is met so you can debug your code by just popping break points on here and then just running the test scene here so

let's press F12 again and let's just close that window now before we move on to the walk state we are going to refactor this code first because we are going to use this

in multiple places so we don't want to keep copying ourselves when we've got the same type of code we can reuse that so let's head over to our scripts folder

and we'll create a new script here and we'll call this game input events and just create that script let's open it

let's just remove this top part here and call this class name game input event so we're going to create our own class for this which will allow us to add these

methods in there just remove the content here and we'll call this movement input so we'll create a static function movement input and that will be a type

of Vector 2 and we'll return the direction out of this method then go back to the idle State and copy the code

from that method into here then add a variable static var direction that will be a type of vector 2 and as you can see that has rectified those error

messages here and we still have an error message here because it is expecting us to return a type of Vector 2 out of this function so we just return here and then

we can say return the direction so this function has been strongly types we are defining what we would like to return as a type and the direction here is Vector

2 so if you change this to string as you can now see Direction isn't of type Vector 2 so you must return Vector two we'll add another method in here which

will help so say static function and we'll call it is movement input which will return a bool and we'll check if the

direction is equal to zero let's return false else return true so the is movement input function will just determine if the player is

actually moving now head back to the player and click on the idle State script and we can now delete this bit of

code here and just say Direction equals game input events dot movement input we can then go to test scene player and test the scene again and just hold the

key down just to quickly test that that is working and just stop that now we are ready to create our next state so head back over to the player let's add another child node to the

state machine so add child node choose node and create then rename that to walk and attach a script we'll call this walk

State and save that into the player folder let's open the script and then we'll go back to the node State script and we will copy all of the methods out

of here like we did with the idle state so go back to walk State and then just overwrite everything in there then copy node State and paste this over node and

then just delete that class name and then just remove those two items at the top because we are extending the node State class so let's begin by adding our

export variables so say var player character body 2D at export again for animated Sprite 2D at export again var

speed integer equals 50 then in our on physics process method we'll say var Direction Vector 2 equals game input events movement input so we're using our

game input events movement input function to get hold of the direction and we're using it as a strongly typed variable for direction and we'll say if

Direction equals Vector 2 dot up then animated Sprite 2D play walk back then we will say else if Direction equals

Vector 2 right animated Sprite 2D play the walk right animation else if Direction equals Vector 2 down animated Sprite 2D

dot play walk front and then elif Direction equals Vector 2 left then the animated Sprite play will walk left as you can

see this code is the same as the idle code here except we're going to use different animations now the last thing

to apply is the velocity so say player dot velocity equals Direction multiplied by speed and say Player move and slide this

should then allow the player to move as we start to change the direction using the WASD key let's head back over to the idle script and what we now need to do

is to transition to the walk State when we are moving so in the on next transitions method we will start to make some changes here because if we look

back at the state machine because after the on physics process method we also then check on the on next transitions to see if we have any inputs which we can

check against and then transition from one state to the next so go back to the idle set and in the on next transitions

method first we'll check if there's any movement input then we will check if the is movement input is returning true or

false and then we can call the signal which is inside node State here which is registered in the state machine and we

can say transition and then use the walk State now click back onto the walk node and on the player just click assign and assign that player node to the player

variable and for the animated Sprite 2D variable just assign the animated Sprite 2D we are now ready to test the scene player so click on test scene

player and let's test the scene and before we press any keys on the keyboard the player is currently in the idle State and if we just press a key we can

see that the current state is walk but when we release the key it doesn't go back to the idle state so let's just stop that we head back over to the

player and in the walk state in the on next transitions function we like to say game input event his movement input is

returning false using the not operator and if we're not moving I using this then we want to transition back to Idol just save that but first of all I just

want to make a quick modification to the state machine I'm just going to copy this print statement here and I'm going to paste it in the is it process method

so that we're always pushing out the current state to the output window save that let's go back to test scene player let's run the test scene now hold the D

key and as you can see in the output window just below the game window here you can see we're now in Idol and then we're in walk idle

again Up Walk we're walking left release back into I all okay so let's just walk right one

more time now when I release the player faces forward let's go left release and the

player is facing forward again let's fix that so that when you release the player stays facing in the correct direction so if we look at the walk State we get our

direction from the game input events movement input function how however in the idle State we also do something similar here so what we need to do is to

get the direction when we are in the walk State and then store that so that when we then go back to the idle State we only pull the last Direction state

which was saved at the time so it is possible to do that by storing a variable on the actual player itself so select the player node and let's create

a new script so attach a script and make sure the template is off because we want to just create an empty script and then we'll create that so just open the

script and inside of the script let's create a new variable so we'll say for player Direction and the type of that is

Vector 2 now head back over to the W State script and after the last else if

we can say if direction is not equal Vector 2 0 then player dot player

Direction equals Direction however if you notice when you type player Direction it doesn't appear in the

intellisense and this is because we're using Dynamic types so if you go back over to your player script this variable can't be found because we need to give

this a class name so we can say class name player which derives from character body 2D and the player will now have the

variable player Direction so we go back to walk State now just save everything first and then save player. player

Direction so it's still not there and this is because we are still only using character body 2D so let's use that class name as player so you can now see

that it's here and it's got the same iccon as a car body 2D because if you go back to the player script the class is a

player which still extends from character body 2D so player has player Direction and everything that character

body 2D has as well so let's go back to W State now we've changed this to player and we say player do player

Direction equals Direction so we now have that intellisense and that has been made possible by using class inheritance now

that we are storing the player Direction in its own variable and assigning this from within the walk State we can now make a modification to the idle State

first in the idle script let's just change this player to say player here then remove this first line here and

then say player do player Direction and then just copy this over the direction itens as such here we can also remove the local variable as well because we're

getting the player direction from the player here now in the idol script as we transition from Idol to walk and then back from walk to Idol we just want to

stop the animation so we just copy the animated Sprite 2D and then when we exit this state we just want to stop the idol

animation because as we go into the next state the next state will handle its own animations so on exit from the idle State we'll stop that and then we'll go

to the walk State and when we transition back to Idol we'll exit again so we just want to start the walk animation too so

head back over to the test scene player just go back to the test folder load test scene player and then let's run that test scene so let's hold the D key

down so you can see that the current state is walk but as you release the key the idle state is in the correct

direction so let's go up and the idle state is correct so we're in walk and then as we release he cars his face in left and then forward again so we've now

resolved how to store that player Direction and use that in other stage let's just stop that now that brings us to the end of this tutorial on how to

create a player with a state machine and two states which is idle and walk in the oncoming tutorials you'll be advancing on the state machine to create different

states for chopping trees filling the land and watering the [Music] crops I will show you how to create the

three different tools for for the player these are chopping hilling and watering we will create the states and transitions for the state machine in the previous tutorial I showed you how to

create a state machine for the player and the idle and walk state in this tutorial I will be showing you how to create the chopping tilling and watering

states in the state machine let's add a new node choose node and click create and rename this to chopping let's add a script and we'll call this topping

State and create that then in the scripts folder in state machine open up the nod State script again and select everything just copy that and then go

back to the chopping State and then just paste that in and then copy node State and then change that on the extends so we'll extends node State and then just

remove these two as they come from n State now if we go to test scene player which is under the test folder let's just run this scene and what we need to

do is to allow the player to move into the chopping state so we need to create some tools and then allow the player to select the tool to then move into the

chopping state so let's just close that then head over to the scripts folder and create a new folder and call this

globals inside the globals folder create a new script and call this data type and open up the data types script then

we'll create an enom and call this tools and the enumerations will go non ax wood

till round water crops plant corn and plant tomato so throughout the game we're going to use these different tools to perform these actions so we'll just

create the enom now up front then we wish to access the tools from anywhere within our script so let's remove extends node and we'll call this class

name data type then let's go to the player script and let's export a variable so say export for current tool

is data types do tools equals data types do tools do none so we'll just default that To None now now let's head back

over to the idle State and in on next transitions we can say if player current

tool equals the data types FS ax then transition to chopping now let's test the scene so got to test scene player let's just run the test scene and as you

can see we've got the current state here let's just go to our player and open that scene let's just bring the window back and let's just change the current

tool here so we just say aord and we can see that the current state has moved in from Idol into chopping let's just stop that so now that we can move into the chopping State let's make some more

modifications to The Chopping State scrip so when we reach the onenter we want to animate the Sprite based on the player's Direction and for each chopping

animation once the animation starts playing we want to then exit the state and go back to Idol so let's begin writing the code for that so let's

export some variables so say export bar player and then export bar animated Sprite 2D and then the animated Sprite

2D then in on enter we say if player player Direction equals Vector 2 up and

the animated Sprite play and then shopping so we can view our animations again from the animated Sprite 2D and we want to run this animation here so I'm

just going to write the rest of this [Music] cord and as you can see this cord is very similar to the code which we've

used previously in our Idol and our walk St however we would like to just play the animation as we enter the state so we're just going to leave the physics

process empty then then on our next transition we need to check if the animated Sprite is playing so we can say

if not animated right 2D is playing then we can transition back to Idol and then once we transition we can just say on

exit animated right 2D do stop animation so this will stop this animation as we move back to our idle state but it should have already stopped anyway but

this just make sure the next thing to do is to just go into your animations and for chopping back make sure looping is now off chopping front looping off

chopping left looping off chopping right looping off so we only want to play the animation one time so as we go into onenter the animation will play then we

check if the animation has stopped playing and if it has stopped playing we transition back to Idol let's go to the test scene player again and let's just

run that okay so that's currently not working what we need to do is just go back to player and click chopping and just make sure we assign our player to

those export variables so we've got the player variable and the animated Sprite 2D variable now go back to test scene player and let's just run that one more

time so as we can see the animation is going between the idle State and The Chopping State let's just go back to our player okay so on the player we've got

it on Ax wood that's why it's switching between the two so we go into the state it plays the animation and then comes back out let's just change that to non

so we're now in Idol let's change that to axw and it's now axw okay let's stop that we go back to the idol script the next thing we need to do is to only

trigger transition into chopping when we actually press the mouse left button down and this will act as the chopping action so let's go to project project

settings input Mark add a new action called Hit add and then add button here and for the event in the listening for input just click the left Mouse button

down and click okay and we'll just close that then head over to scripts open up the game input event script and let's add a new function all static function

call it use tool and we'll return type of B and want save our use tool value which is a type of B and then use input

do is action just press and then pass in Hit and that is the name of our action which we've just created and then we'll return the variable used to Value then

head back over to the idle script and in the idle State script we can just check for the players's current tool and in the game input event check if we're

actually using the tool hit event now let's test the script go back to test scene player let's run the test scene and then let's just press the left Mouse

button down so remember on the player we need to have ax wood set here because if we just set that back to none and then just few our game if I click the mouse button down I can still move left and

right cuz that's the W State as you can see here in the current states under the window just move this up so walking then let's just activate the axb bring the

window in and then if I click the mouse button and I can move all the different directions and click in the mouse button

so if I'm walking and I click it doesn't show the ax animation because that is what the state machine will do we are making sure that we transition to the

correct State when our conditions are met so when we're walking we don't want to be able to chop at the same time and then chop stop and then chop okay let's

close that window now for our tilling State let's create a new node on the state machine we'll just create a node and then rename this to tilling let's

attach a script and we'll call this tilling State let's create that then head over to the chopping script and just select everything in the file let's

copy that go back to the tilling script and then just paste the content so everything is the same for the tilling State and The Chopping State however we

need to change the animations here let's open up animated Sprite 2D and let's just check the tilling animation so tilling back let's turn looping off turn

looping off for the tilling front tilling left turn it off and tilling right turn looping off with that then instead of chopping we just need to

staying let's just copy and paste those values there now let's head back over to our idle script and let's just copy these two lines here and we'll say if

the player current tool and instead of awood use till ground and we want to still keep our game input events as used tool but this time we'll transition to

tilling we're now ready to test our scene so go to test scene player run the test scene and let's just click on our player let's just view our current tools

so this is now on ax wood so if we go left we got ax wood let's just change the tool now to till ground and open up the window and we can see we still got

another error here and this is because we haven't assigned our variables again so let's just stop the test scene and oning let's just assign player and

assign animated Sprite D go back to the test scene and when we move left we now have tilling so you can see the current state Chang in the bottom and that's

everything working for our tilling State now for the watering State this will allow the player to water crops and then they'll grow so we'll go to our player

ADD child node create a node and call this watering then attach a script and we'll call this watering State and we'll get our tilling script copy everything

go back to the watering script and then paste that in so just save everything then on the watering node let's just assign our player and assign our

animated Sprite 2D then let's choose the animated Sprite 2D and on our watering animations let's just turn looping off for each of the

animations and then where we have filling back let's just update this as well now let's head back to the idol script and we just need to copy the

these two lines once again so we can say player. current tool is equal to water

player. current tool is equal to water crops and we still want to use the tool so once we have this tool we can then go

to our watering State let's go back to the test scene player and let's test that so select the player again and as we move left and press our left Mouse

button down we're still tilling the ground I just open the output window as well so we can see see that so tilling idle tilling idle and then let's just

choose water crop and we can see that we are now using the water crops animation so just close that window now that brings us to the end of this tutorial on

how to create the different tool States for the player so we have chopping tilling and [Music] watering it is possible to use maps to

create variations of different scenes you may have smaller to Maps which hold assets by creating houses for example in this tutorial I'm going to show you how

to use tow maps to create small scenes which can then be added to a scene's collection and then used in your game I will also show you how to create a custom component which can be used as an

interactable which opens and closes the door to one of the houses when you then test the scene you will be able to walk through through the door and these are the various different houses all created

from the same tilemap so before we get started on creating our house tile map I'm just going to show you a little technique on how we can change the folder colors so that we can better

organize the project if you right click the folder there is an option here for setting the folder color so for the root folder for assets I can make this orange

then I can see that all these folders here are asset related folders then for scenes I would change this for green

scripts I will change this to Pink and F set I can make that yellow so feel free to choose any of the colors you can also change the color of a nested folder too

and this just makes it really easy to see what type of folders they are what type of content is contained in those folders and as your project grows you

may find it easier to use a color scheme or color called those folders let's head over to the scenes test folder and let's just make a copy of the test scene

player so for this scene we'll say right click and then duplicate and what we'll call this is test scene house P then

just duplicate that and let's just close the test scene player and then open up the test scene house fat let's just click the test SC toap node let's just

F2 that and we will rename this scene house tilemap and then just save that so to create the house scene let's go back to the scenes folder create a new folder

and we'll just name this houses and click okay and then we go scene new scene 2D scene and then we'll rename this to large house and just save that

scene in the houses folder so in the large house scene we can create a new child choose no 2D and then rename this

to house tile map then add a child node and we'll search for TI map layer and rename This Ti map layer to flor then in

the tileset let's create a new tileset I just drag this up a little then right click and save as and then in the to sets folder we'll save this through

house to set now click on the house tile set and in the tile set menu here let's then go to our assets folder and in the tile sets folder we have a

wooden house walls asset let's just drag that into our tiles and just say no to the atlas then under setup let's just

click and activate the floor tile then click on tile map choose the floor tile and let's start to paint the floor once the floor has been painted we

can then go to the towel set and then let's just start to set up the walls so let's just choose these walls here and then this window option here

the next step is to draw the walls for the house so if we just zoom in on the walls first of all before we paint them we should add some Collision shapes so that the player can't walk through them

so just go back to the towel set just activate it and then click physics layers and on the first Collision layer let's just rename this layer and call it

ground now now I know these are walls however with it being a top- down 2D game I'm going to consider walls and the ground to be the same thing but however

feel free to call this layer walls and then you can manage ground items and wall items as something completely different so I'm just going to rename that and to draw the Collision shapes

just click select choose the first cell and then in physics let's just begin adding our shape so so we'll click the

plus button here and then we'll start to draw that with snapping let's turn on half pixel snap and this will just help us to get a really good pixel snpp in as

we draw the shape so as you can see this is now covered and then in paint let's just choose that property so we go paint physics layer and then you can paint

that and then choose on half pixel snap and we'll just start to snap the markers to create our shape and then paint that

we can leave that the same then paint that again move the markers again and then click it then paint and paint again

then choose this one and then just cover the full item if you click it so that it highlights here and then press f it will fully fill it and then click it there

and then we can just paint that one as such for these four now that we've got the this fully filled you can just paint them and for the window we can also just

paint that so that completes the physics Collision shape just save that let me just drag this down then under house tow map let's add a child node create a tow

map layer and rename this to walls then in to set let's just load the house tow set and in tilemap let's start to draw

our wall so we'll start with the left hand side and then just add these and just add the corners in and another corner

here and then we can just finish those walls there so we can leave a space for the door and then I'm going to add some windows so one window here and two windows here we could possibly put two

at the back so then that completes the house and now we ready to add some furniture so under house tilemap ADD

child n new tilemap layer and just rename this to Furniture then under tileset quick load and choose the house to set then in our game assets we can go to

object so we should have an asset for basic Furniture so just choose to sets here and then drag the basic furniture asset into there just say no for

creating the atlas then on setup let's just activate the tiles which we will paint so holding shift down we can create the bed assets and select

multiple Tils I'll just open this so we can zoom in a little bit more and we've got two cells for each of the beds single ones for the carpet another

double as such and then we can activate the chairs and the Box to the walls we can now create the Collision shapes for

the furniture so click on paint with the physics layer set to zero which is if you click on the tileset here is the Collision layer which we've already set

to ground so I'm going to just choose the asset here and then holding control I can zoom out a little bit on the asset

to set up the visits layer here and then I'm just going to turn on half pi snap and then just start to bring in the

markers just to cover the asset itself once I'm happy with this I can then paint the beds that's all the beds covered and then let's repeat the

process for the wooden furniture which is the tables the cabinet and the chairs and these six flowers here

[Music] that's finished setting up the furniture and the plants here now that we have set up the tow Mar we can just reduce the

size of this here and then cck on furniture and start to draw some of the furniture in the house so we'll go for that's a z key to

[Music] rotate and that completes setting up the furniture for the house so as you can see it is easier to create the house

using a scene and then a town map which is just Associated for the house asset and then you can start to create different scenes with different house

types so for this one I created a large house now head over to test scene house tilemap and we would like to add the large house to this scene however what

we can do which is better is to just add a child n do another tilemap layer and call this houses then in the towel set

quick load and load the game towel set and in the tileset option we want to add and choose scenes collection here and this will give us an EMP scene

collection then drag and drop the large house scene into here and this will add the large house to the scenes collection

then click on tow Mark and we can then paint this house here so we can just pop that as such there once we've placed the house we can do this multiple times I'm

just going to remove that and we can now test the scene however I'm just going to switch on the visible Collision shapes in the debug menu just turn that on and

then let's test our T scene so we'll just run that and let's just see if the player can first walk through the wall so that's okay I think the Collision

shape on the player is probably going to be a little bit too big so cuz we can't get through the door so let's just then close the scene and then let's reduce

the size of the Collision shape so select Collision shape here and just reduce the side and then we can just move that to the bottom of the player

then head over to test scene again and run the test scene so now when we move the player we still can't go through walls but we can now enter the house and

we can't walk through the furniture the bed but we can walk around the house as such okay let's stop that we are now going to create a door for the house for

the player to walk through and I'm going to show you how to create your own custom component which will act as an interactive to allow the do to open and

close to go to scene new scene 2D scene and then just change the type and choose static body 2D and just change that type

then add a child node and search for animated Sprite 2D and create that then with animated Sprite 2D selected choose animation from this option here then

click in Sprite frames add new Sprite frames frames and rename this to open door then choose the frames option here

then go to assets game file set and choose the doors file set then let's zoom in then change horizontal to one and choose the frames in this order so

it's the closed door first and then it as it starts to open so it's Z 1 2 and three so add those let's see zoom in on

the door in our scene let's turn looping off and then let's just play that animation let's add another animation

and call this closed door click on the frames choose doors again zoom in and then we'll choose the top one zero this

one is number one number two and number three add those frames turn looping off and then let's just play the animation so we'll create a default animation for

when these scen start so we'll actually put this back and call it default and let's just turn looping off open up the Sprite frames go to doors open and we

just need the one frame which is the door automatically closed then set this to autoo so that this always displays when the scene begins let's rename the

scene just call this door and then let's save the scene so go to scenes houses and just save that scene in The house's folder so we need to add a collision

shape as this warning is telling us to do so so we'll say add child node Collision shape nude rectangle shape and

then just resize this so that it fits over our Sprite save the scene again and then click on door again and we want

this Collision shape to be on the layer ground however let's go back to the player and check what layer is the player on so the player is currently on

the Collision layer of ground so what we need to do is edit the layer names and let's add a new layer or player then

choose Layer Two to put the player on that layer but we'll always collide with items that are currently on the ground let's go back to the door scene and

let's add this scene to our house so let's go back to large house scene and on the walls tilemap layer let's go back

to our tileset and in tileset let's add the scenes collection then drag the door scene into that scenes collection here

then with wall selected go to toart choose the door scene and let's just paint it here so as you can see we now have a scene painted in the tow Mar now

let's test the scene so let's go back to debug just make sure visible Collision shapes is still on go to test scene house tilemap and let's just run the test scene so we'll move the character

and just make sure the character still can't get through the door so that's correct but what we want to do is when the player approaches the door the door opens but the character then can go

through the Collision shape so let's just stop the scene so back on door we need the player to approach the door and it to open so I'm going to show you how

to create your first extensible component sometimes it's better to use components if we're always going to do similar actions so I'm going to create

an interactable component which will always receive the player and can then do some actions on that so let's just

create a new folder in scenes and we'll call this folder components and just click okay inside the components folder

let's create a new scene so new 2D scene and just change the type and search for area 2D then rename the scene and call

it interactable component then save the scene into the components folder then attach a script and we'll call it interactable components we just create

that script and then above the extends we'll call this class name interactable component then we need two signals which

is interactable activated and Signal interactable deactivated then select the interactable component and choose noord

and then choose body entered and then connect then body exited and

connect then in interactable activated when we get an un bodybody entered event we just want to emit that signal and

then in the body exited event we just want to emit that signal as well then click back on interactive component and just go to the inspector and we need to

change the Collision layer so let's edit layer names and for the third layer call this interactable and just close that

and then just add layer three which is interactable and we want to interact with the player layer so turn off round and then just choose player layer okay

let's head back over to door and let's give the door a script so create the door script and that's saved in the houses folder then let's add the

interactable component to the door so go back to component and add the interactable here once the interactable components added then we can add the

Collision shape so go back to 2D here and then create the Collision shape so we say add child node and add the Collision shape then in the shape we'll

just add a rectangle then I'll just create the shape so that we have a space before the door and some Collision shape after the door so let's just change the color so that it's a little bit easier

to distinguish between the two Collision shapes which we have and we don't need to set any Collision masks because we've already done this on the interactable

component this is already preconfigured for us so let's save that and then go back to the door script and then choose all three items click and drag and then

hold down the control key and this will automatically create us our unready variables now let's link up the interactable component signal so first

of all we need the ready function so say function ready so Interac component then get the Interac will activated signal

and then use the connect function to connect the on interactable activated so we'll just create this function to we'll just say pass for now then we say

interactable component when the interactable is deactivated then connect and can say function on interactable

deactivated just pass and then save and then place a method into the connect function the next thing to do is to play the animation when the uninteractive is

activated so let's just say animated spr 2D play open door and when the uninter is deactivated then we'll play close

door let's just put two print statements in here for debuging and we'll just say activated and deactivated let's just save that okay let's go to the test

scene house format and let's just test we got to debug and make sure visible cision shaps on and then run the test seene okay let's just have a look at the

pr statements here which is on the output now we are outputting messages from the state machine so let's just stop that first let's just while it's

running you can just go to scripts State machine inside the state machine and just comment this line out comment this

one as well let's just clear the output queue go back to the game let's just move the character so we're not getting any more output messages and then let's

just move the player into that area so we can see that's activated that's now calling that message and we come out and it's deactivated and you can see the

door is opened but we can't get through the door and the reason is we still have another Collision shape now that Collision shape is to stop the player

from just walking through the door so there's two ways we can do this and solve this problem we can either hide that Collision shape or we can change

the Collision layout temporarily so as let's just stop the scene if we look at the door and go onto

the Collision shape here you can see that the Collision layer is on ground and the player is stopped by any items

that are on the ground layer however what we can do is temporarily change the Collision layer so that it's on the same layer as the player so what we'll do is because we're already on the static body

2D object we can say when the scene loads set the layer to one when the door opens set the layer to the same layer as the

player so the player will walk through the Collision shape and then when it's deactivated set the Collision layer back to one so let's test the scene again

let's go to test scene house to go to 2D and then let's test the scene so now when the player go into the area the

door opens and the player can walk through so you can still see that the blue collision shape is still visible however it's now on the same layer as

the player and the player can just walk through so that's a way to resolve Collision shapes going through other Collision shapes is by modifying the

mass temporarily let's just stop that so this would be really useful if for example the player had a key and the keys in the inventory as a player

approaches the door it activates however it requires the key which changes the Collision layer and then allows a player through the door however I just thought

I'd show you an alternative technique on how to switch Collision layers during the game as this can be really useful in certain scenarios so now you know how to

create houses using Town maps you can then create various different styles of houses and then paint these throughout the game I'm going to create a

mediumsized house and a small-sized house

[Music]

now I'm going to duplicate the medium house and call this small house just duplicate that scene and then I'm going to repeat exactly what I've just done

for the medium house [Music] [Music] [Music]

now that brings us to the end of this tutorial on how to create scenes using tow maps in this case we have house tow

map and we want to create some variations of houses using a smaller TI map we can create several different scenes then add them to a scene's

collection and then paint them throughout the [Music] game I will show you how to create trees you can chop down and then add them to

your tilemap SC collection for easy use in any scene we will also cover hit and hurt components to apply damage when

using the axe tool and create reusable collectible components to gather logs and other interactable items let's begin by creating a new test

scene we'll just take the test scene default in the scenes and test folder and let's just duplicate this let's just call it test scene

objects and trees and let's open the scene so we use this test scene just to try out how we trees once we've created them and in the scenes folder let's

create a new folder and call this object and then inside that folder we'll create a new folder and call this tree so go

scene new scene other node search for sprite 2D and then click create we will rename this node to small tree and then

just save the scene go to the scenes folder objects trees and then save the scene so click on small tree and in the

texture let's add a new Atlas texture then go to assets gaming objects folder and in that folder you'll have a basic grass and biome things so let's just

drop that asset onto the atlas then scroll down and choose edit region and we'll just zoom in so we want this tree here let's just choose let's just choose

grid snap and we'll zoom in and we want to just take this tree here let's just close that and then zoom in and we have

our asset here now let's reposition the asset if we just click the up Arrow we can transform the Y position so we can

see that the Y AIS is increasing on the transform let's add another child node to the small tree so add child node then search for static body 2D add another

child node and this time search for Collision shape 2D and in the shape parameter let's just choose the circle parameter let's just reduce the size of

that and then just drag that and just position it over the base of the tree so we would like our player to collide with

the Collision shape for the static body 2D but not move through the shape so this is why we using a static body 2D because the player shouldn't be able to

move through that Collision shape so let's just check on static body 2D and we will keep the layer on ground so if we just look at the layer names once

more we have ground player and interactable let's now add the small tree to our test scene so in the test folder open up the test scene objects

tree scene and then in the game tilemap let's add a new tilemap layer so say add child node and search for tilemap layer and then add that layer in tilemap layer

let's rename this to trees and in the tileset let's just load the game towel set and open that click on the tileset and with the to set options selected at

the bottom let's then go to our objects and trees folder and let's add our scene so we can click the plus button here and

go scenes objects trees and small tree or you can click and drag it once we've added that go to tilemap and then on the

trees layer let's just click the small tree and let's just start to add those trees then let's add the player to the scene so we can just grab the player

just add the player to the scene and then just add child node and just quickly add a camera 2D then just make sure the player is below the tilemap

here and with the player set up let's test our scenes so go to debug and just switch on visible Collision shapes and then test the scene and as you can see the player cannot walk through the

Collision shape because of the static body 2D however let's just try and walk behind the tree and as you can see the player just walks over the top of the

tree and this is because y sword is not enabled however I'm not going to cover why sort in this tutorial I'm going to cover that in a future tutor tutorial

because I will show you how to perform wi sort on many different objects at the same time and why it is better to do it through a test scene because wi sorting

can be quite tricky the next step is to create a hit component and a Hur component the tree will have the hit component and when the player has the

axe that will be the hit component and as it interacts with the Hur component it will apply damage and then chop the tree down and produce logs let's go to

scene new scene other node and search for area 2D and create that and then rename this to H component let's save

the scene and in the components folder under scenes we'll save the H component here now attach a script and we'll save this as the her component GD script and

just create that let's now give this a class name and call this H component then add an export variable which is tool and then we'll use the data types

variables with tools and the eom tools.

nonon let's create a signal called on Hur then back on the HT component just select that and then go to node and choose area entered and then just

connect that so click connect here now to create the hit component go scene new scene other node and we want another area 2D so create that and then rename

the node to hit component let's save the scene and save that also in the components folder click save and then let's attach a script and we'll also

call this hit component GD scripts and create that script then we'll use class name hit component and then export another variable which is V current tool

and then we'll use the enom data types tools and then assign the tools n then add another export variable call this for hit damage and we'll give it a

default value of one so as you can see for the hit component we derive from area 2D and we also do the same for the her component you'll see the error

message here because it's asking us to configure a collision shape 2D however we are going to attach these components to other nodes and scenes and then we'll

attach the Collision shape there so we are deriving from area 2D and making something a little bit more customized able and reusable let's go to our player

scene and open the player scene and from the components folder let's now attach the hit component so if we just open this up here let's add the hit component

to the player first just make sure that the position in the transform is zero and zero for the X and Y and then we can

now attach a collision shape so add another child node and search for Collision shape and we'll create a small circle let's change the color so it

distinguishes the hit component shape from the players alternative Collision shape for interacting with the ground objects let's make this shape smaller

and then choose the hit component and let's add a different Collision layer so if we just edit the Collision layer names in here right tool and click close

And then edit layer names again and write object then click close so the Collision layer for the hit component should live on the two layer so the best

place to do that is to actually go back to the hit component here open the scene and then add it here if you add it on here you can then attach that hit

component and keep changing those layers but we want it on the default actual scene component here so we'll go in the Collision layer choose to and then turn

off one and in the layer mask we want it to interact with object layers so that is layer five so if you attach the hit component to any other characters or any

other NPCs you wouldn't actually need to keep selecting the layer and The Mask because we've created our own custom version of the area 2D and called it hit

component and this is one of the benefits of Godot and the nod structure you can create your own custom components which have predefined

settings and are extensible from the original n types so let's head back to the play scene the next step is to

reposition the Collision shape based on the direction of the player when we are chopping so when we are in this state we need to now modify and move where the

Collision shape is let's open up animated Sprite 2D and then let's find chopping right and then let's choose this animation here and just play that

so we need to move this Collision shape so it sits on top of the ax so let's just move that and if we look at the Collision shape value we have an x value

of N and the Y value is zero so now that we know the transform position for the Collision shape let's now modify this through the script so go to the state

machine node and in The Chopping State node choose the script and let's export another variable so say at export and we'll call this variable hit component

Collision shape which is of type Collision shape 2D then create the ready function and say hit component Collision shape. disabled and we'll set this to

shape. disabled and we'll set this to True by default and hit component Collision shape do position Vector 2

with X and Y a zero and scroll down to the onenter method and when the onenter to function is called let's get the hit component Collision shape and set

disabled to false to activate the Collision shape when we then exit we want to say hit component Collision shape and then set disabled back to true

and then also in on enter method when the player direction is facing right get the hit component Collision shape and

set the position to Vector 2 x 9 and y0 which is the transform position here now we can then reset this back to 0 0 which

is the starting position and when the player direction is facing left we can do the same thing except use minus 9 for the X variable so hit component

Collision shap do position equals Vector 2 - 9 and 0 and this inverts the X so we've got 9 for right and Min - 9 for

left so we just need to set the position for the play Direction facing up and the play Direction facing down so go back to

the player and change the animation again so we go choing front and then just play the animation and then just

position the Collision shape into the correct place so we've got X is zero and Y is three do the same facing up so

chopping back and we can say that X is z and y is - 18 let's just reset those and once we've reset the values

let's go back to our chopping State script and then update these values so chopping back and that just updates the position for the hit Collision shape so now

choose the hit component Collision shape and just rename this has hit component Collision shape 2D then choose the

chopping State node and we just need to assign this Collision shape to our export variable in the hit component then head over to the test scene we just

check again that visible Collision shapes are on go to the test scene and on the player node just make sure that we choose the acts as the current tool

and then let's click the test scene and then as we click the mouse we can see the Collision shape move and also as it turns red is active and then we've got

up and then down so what we now need to do is when we go to the tree and click to activate the tool it should then start to chop the tree let's just stop

this so go back to the H component and let's just finish the on area entered method we want to say V hit component

equals area as a hit component if tool equals and then we can say hit component and because we've made this as a custom component we have access to its

properties so we've got current tool then we can call the signal and emit hit component and then the amount of damage that that hit component can emit so head

back over to small tree and in this scene let's add her components so we'll go back to the components folder and then just add the her component as an

odd and then this is where we can now add our Collision shape let's add the child node and then for Collision shape 2D let's just create that but for this

we'll choose a rectangle shape and then change the color to distinguish it then let's just resize it for the tree and just save that let's just rename the

Collision shape to HT component Collision shape and then we just need to check the physics layers so we're not going to change them here because we've added that to the small tree we'll

actually go into the H component because this is the custom one click that and then let's just set the layers so we

have ground layer so this is object and we're going to mask the tool and you'll see that that is the inverse of the hip

component let's create another reusable component which manages our damage so go scene new scene we'll just use a standard 2D node for this and we'll just

call this damage component save the scene and choose the components folder which is under scenes save that and then attach another script and we'll just

call that damage component script and then create that so click the damage component script and then call this class name damage component add an expo

variable which is maximum damage and we'll just set this to one that's just the default add another export variable and we'll call this current damage which

is just set zero then let's add a signal and we'll call this Max damage reached and create a function we'll call this apply damage and we'll pass in an

integer of damage and we'll just return it as a void then we want to set the current damage and we do this by clamping the current damage damage with

the damage value that's coming in so that we don't end up with the current damage more than our Max damage then we

can say if current damage equals maximum damage then let's emit our signal now head back over to small tree and add the

damage component to our small tree and let's set the variable so the maximum damage for the small tree let's set that to three now we've almost finished the small tree scene what we just need to do

is link up the signals which we've got from our reusable components so let's just go small tree and then let's add a script let's save the script a small

tree and then create that so click the H component and damage component so they're both selected then hold control down and then add them into the editor

here so we've got two unready variables then add the ready function and then we can get the H component and then connect the signal so say function on hurt and

then it's hit damage with a rear turn type of void then once we receive the hit damage we just need to pass that into the damage component so we can say

damage component apply damage and just pass in the hit damage so on the HT signal just need to add the connect method and that will just connect that

up then let's complete our damage component signal so we say damage component Max damage reached and then

connect so we'll say on Max damage reach then create the function and here we just want to print and then Q3 to remove

the Cene I'm just going to go back to the H component and just update this method so just call it

it and go back to damage component and then go back back to the small tree script just modify that and then just make one more check for the h component here so let's just check the signal

because I did update that and then just also rename that back to H so that it's got the correct signal name now let's head back over to our small tree scene

and we've now completed the script let's go to our test scene objects and trees and let's just run our scene we'll leave visible Collision shapes on for the

moment and then let's just move the game window up and then we'll just hit the ax so one 2 3 and you can see that Max damage has reached we'll just do that

one more time for one of the other trees we say one 2 three so now what we need to do is to instantiate a log when the

tree has been chopped down so to create the log scene go to scene new scene other node and search for sprite 2D

let's rename the node to be log and save the scene go to the scenes folder objects trees and save the log scene here then in the texture choose Atlas

texture and just open that and then in the atlas texture let's just add a new texture so go back to our game assets here and under objects bring over the

basic grass biome things then in edit region with grid snap selected zoom in and then choose the grid around this log

here just click close And then let's zoom in on our Sprite and now we're going to create another custom component which we can

use to collect log so this can be then reusable so go to scene new scene other node and search for area 2D again and

rename this to collectible component let's save that we'll put this into the components folder under scenes and save then attach a script and save that as

collectible component script and create in the script we want to call this last name collectible component and because we may use this on multiple different

objects let's export a variable called collectible name and we'll use a type of string then select the collectible component node choose node and then

select body entered let's connect that signal to our script in the UN bodybody entered method we want to say if bod is

the player then we'll print a debug statement we'll say collected and then we will get the parent and then free the parent scene now the reason why I'm

using get parent is because the collectible will be added to another scene so with the colletible component selected go to the inspector and let's

just check the Collision layer now let's use edit layer names and we'll put this onto a collectible layer so just write collectible and then just close that so

collectible is now layer six so let's choose that and we want the collectible to be seen by the player so let's then look for the mask which is player and

that's number two let's head back to the log C and go to components and add the collectible component scene to the log

then let's add a child node and search for Collision shape 2D for the shape let's choose the circle shape and let's just make this a little bit smaller I'll

also make this green and for the collectible component I will call the collectible name log so you can write the text log in here so now that we've

created the log scene let's go back to small tree go a small tree script and then get the variable log scene use preload method and then load the log

scene then in the UN Max damage reach method we want to load and add that log scene and then Q3 but if we do that straight away here we'll get an error so

what we need to do is to use call deferred so that we instantiate and add the log scene on the next frame so call

deferred and then we use add log SC so say function add log scene and then say V log instance equals log scene then

instantiate the log scene and then we'll just cast that as a n 2D then we'll say log instance Global position and set

that to the global position of the tree node and use get parent ADD child and then the log instance so this will add

the scene to the parent of the tree node so now that we've finished the small tree script let's test the scene so with visible Collision shapes on let's just

run the current scene let's go to test scene objects trees and run the currency so one 2 3 and then the log appears so

you can see that the collectible component is attached and then let's collect that and then that disappears so let's stop that so now that we finished the small tree scene using

reusable components I can now make the large tree scene I'm now going to develop this and speed up the video so stay tuned and you can see the progress

[Music]

so now we can test the scene and we've got the large trees and small trees which are now added to our to M and then I can just start to a the tree and

collect the log now that brings us to the end of this tutorial on how to create tree scenes with reusable components so that you can apply damage

and chop the tree down and then use a collectible to collect the logs in the next tutorial I will show you how to make the tree shake using a Shader when

the player acces the [Music] tree I will show you how to create a Shader which uses the vertex function

which manipulates the vert of the pixels in the Sprite as you can see from the top the shake is applied and then at the bottom the trunk is a little more

stationary when the character approaches the tree and the player uses the ax tool it will cause the tree to shake first head over to the scenes

folder and in the test folder open test scene objects trees then in the characters and player folder just open up the player and click on the player node and just make sure the current tool

is set to axw then go to test scene objects and open up the test scene and then just start to access the tree and as you can see the tree doesn't

shake and it would be good if every time the axe makes contact with the tree we make the tree shake so let me just show you how to do that we go to scenes

objects and trees folder and open up the small tree scene click on the small tree Sprite here and then just scroll down to material and in the material let's

create a new material and we want a new Shader material then in the Shader property click entty here and then let new Shader and we'll use the type of

Shader here keep it on canvas item and then rename the Shader to tree shake and then create that now double click the

Tre Shake Shader in the files and then just chose Shader edits are here and you can see that in our Shad we have a Vertex function and the fragment function we're going to modify the

vertex function so that we shake the pixels from the top of the Sprite moving down towards the bottom and this will be better to produce a visual effect rather

than using an animation as we can manipulate the pixels in the Sprite in the Shader code let's remove these two functions we are only going to use the

vertex function because we are going to manipulate the vertex of each pixel starting from the top and then going to the bottom which will create the shade

effect so let's start by creating a uniform float Shake intensity variable and we'll set this to 1.0 then another

uniform float Shake speed and set this to a default value of 20 so add the semicolons and then we'll create a

vector 2 Shake equals Vector 2 and then a default value of zero and then just finish that statement then open an if

statement and say vertex doy is less than 0 0 so the reason why we're checking if vertex Y is less than zero

is because if you look at the Y AIS here for the Sprite the Sprite is sitting above the xais and as we move up the Y

AIS the values are negative for the Y AIS in good so we want to check if these pixels are less than zero so we can

apply shaking from the top down so let's call the shake property sayx equals and

then use the sign function then time multiply by Shake speed plus the vertex

doy multipli by Shake intensity then let's apply the shape property to our vertex and then say plus equals Shake

now that the Shader is complete we can see that the tree is shaking from the top down if you set the shake intensity to zero you will see that it stops so

let's just go back to our small tree and these two uniform parameters are our shaded parameters here so if we just apply that there and then just say one

you can see that it's possible to modify the animation and the shaking effect from the script which is what we will do next so let's modify the material in our

script let's first just reset the shake intensity property back to its default of 0 0 and then in small tree click the

script and in the onher method once we've applied the damage we can access the material property which is this here

use the function set Shader parameter and then from the Shader access the shake intensity parameter and we'll set this to

0.5 then let's use a timer so use an a waight then use get tree create a temporary timer on there a time out of 1 second then we can get the material set

Shader parameter again and set the shake intensity back to 0 0 so before we test the scene just go to player make sure

player current tool is set to ax W but also on the tree the H component is waiting to receive the ax wood to so

just set this to ax wood as well this can may be reset in the test scenes in a future tutorial we will be creating a tool bar which allows the player to

select which tool the character will have so that this is automatically selected with that set go to test scene object trees and then let's test our

scene and then for the small tree let's just act the tree and as you can see the shaking effect is being applied per second now all the trees are currently

shaking at the moment so we can stop that let's just cancel that then go to small tree and back to the Shader and on

the Shader for the resource select local two scene and then save that and then let's test the scene again so let's hit the tree and only the single tree is now

shaking we'll just do this one more time and then just stop that I am now going to perform these changes for the large tree and apply the shaker

[Music] now let's go to the test scene and let's test our scene as you can see the large

tree now have the same shaking effect so we can then just stop that window I would just quickly explain some of the changes I've made so I've copied the

code for un hurt as I have in my small tree and if you look at the large tree what I've done is I've moved the Sprite so that only a couple of pixels are

below the X AIS and this is because in the Shader we want to check if the vertex X is less than zero so basically

all of these pixels will move above the x-axis and I want these to be stationary and it will stop the trunk from shaking left to right so that we just get a

better effect from the top down then on the Shader I've remembered to click local to scene for the Shader that's applied to the large tree and then just

check the her component is also set to ax wood and that brings us to the end of this tutorial on how to use a Shader and apply a shaking effect to pixels using

the vertex [Music] function I will show you how to create rocks you can mine and then add them to your T map scene collection for easy use

in any scene we will also cover hit and hurt components to apply damage when using the axe tool and create reusable collectible components to gather the

stones so before we create the Rock scene let's create a new test scene so scenes test scene and then make a copy

of the objects and trees scene just duplicate that and we'll then call it objects rocks and then just click duplicate let's open the scene and then

F2 on here and we'll call it objects rocks just save that scene just go back to the testing objects trees just rename

that just save okay let's close the test scene objects trees and just keep this one open and we'll just remove this layer here so just right click and then

delete the layer so we've now got a test scene ready for trying and testing our Rock scenes out so just click save all scenes so let's just go to the trees

folder and then let's just load the small tree scene so we're going to create a rock scene which is going to be very similar to this as we've made these

reusable components so please check out my previous tutorial on how to create the trees and how to chop the trees let's go to scene new scene other node

and then search for sprite 2D then F2 and name this to rock in the objects folder let's create a new folder we'll call this rocks and then let's save our

scene and we'll just save that into our objects folder under Rock so save with the rock scene selected in the texture property let's create a new Atlas

texture and then open that and in the atlas property go to the assets folder and in game and objects let's drag over the basic grass and biome things let's

just scroll in and what we want is this rock here and this will be the stone which is generated once the his mind so let's go to edit

region and with grid snap selected let's just draw a grid around this rock and click close And as you can see now we have our Rock here so let's just move

this a little bit up then on Rock add a new child node and search for a static body 2D and then add another child node and search for a collision shape 2D for

the shape let's then pick the Circ shape and then reduce the size then click on static body 2D and just check that the Collision layer is

on one for ground and the mask is also on one for ground now let's go to our components folder under scenes and then

drag the Herz component onto the Rock and the tool which the her component receives will also be the axe then add another Collision shape so search for

Collision shape 2D and then create that Collision shape but for this shape we'll just change the color and make that a bit different and for the shape let's add a circle shape

so let's just make this a little bit larger so the first Collision shape is to stop the player from walking through the Rock and then the second Collision

shape is to receive the ax input so just click the her component one more time and then on the Collision layer we've already got the correct value set so

five is object and the mask is the tool and this is because we have created it as a component with those voles automatically set so this saves us time

and makes it a little bit more reusable so the next thing is let's take another custom component and we want to use the damage component and drag that onto the

rock then we will set the maximum damage to five this means that the axe will need to hit the rock five times before it will start to mine and create the

stones the final step will be to add a script to the Rock itself so attach the script we'll save this rock script in objects and rocks and just create that

file and we can actually just copy the code from small tree so let's just highlight all of the code from the small

tree script go to the Rock script and then just copy and paste that however in the onert we will take off the shake

intensity and the timeout then in the on Max damage reach we need to just modify these variables here so we'll take this

print statement off as well and instead of log scene we will add a stone scene and then let's just change this to be

Stone and here it will be rocked so we can see that this Stone scene doesn't EX exist so let's now create that scene

let's go to scene new scene other node and search for sprite 2D and then let's name this as Stone and then save the

scene in our scenes objects and rocks folder let's save that scene and in the texture property let's just create a new Atlas texture and then open that

resource and in the atlas property let's go to the objects folder in assets and game and just drag over the basic grass and biome things asset and just drop

that into there then click edit region and with grid snap selected let's just zoom in and choose our Stone now there's an alternative way to select assets

because this one is slightly off-centered so you can actually choose Auto slice and as you can see the stone has been Auto sliced and you can just

select it so that it turns turns White Once that's selected click close And then go to the 2D View and as you can see we've now got our Stone here and

when the player mines the rock the stones will be created from The Rock so we need to make this Stone collectible in the previous tutorial when we created

our trees I showed you how to create the collectible component so go into components here and then choose collectible components and just drop

this on to to your stone scene now we can then attach a collision shape in the shape property let's change this to be a circle shape and we'll just reduce the

size so that it fits around the Sprite and then let's just change the color to be green then click on the collectible component and for collectible name just

add the string Stone and if we just view the Collision layer we've already predefined this from inside of the collector

component scene so just close that and the reason why we are adding Stone to the cible name is because in a future tutorial I'm going to show you how to

collect objects such as the stones and the logs and then add them into your inventory so by reusing this collectible component and then giving each

collectible a different collectible name this will enable us to create efficient code and reusability so that later the invent entry panel will be easier to

create and then any objects that you wish to be Collectibles will be much faster to create for your game and will be all consistent too now head back over

to the Rock scene and then just go into the Rock script and we can see now that the log scene has been resolved here but what we just need to do is update this

to be stor scene then let's just modify our code here so so that it's consistent with the stone so now we use Stone instance and we still set the global

position and that's the same and then put Stone instance to add that as a child so now let's go back to testing

objects and rocks let's create a new layer here so say add child node and then search for tilemap layer press F2 to

rename the layer to rocks Al to 2D and then on the Rocks tilemap layer with the tileset let's just use quick load and

then load the game to set and in t set menu here let's just click scene collection and let's add our Rock scene

so go scene objects rocks and choose Rock scene and this should add it here into our collection then head over to to

Mark and then choose the rock object here and let's just paint a a couple of rocks and now we are ready to test the

scene so let's just go back to test scene objects and rocks and then let's run the current scene and then we'll say

1 2 3 4 and five and then that produces the stone and we can then collect that stone we can do this one more time two

three four and five and then collect that stone so now we can close the window in a previous shoo tutorial in the series I've shown how to create a

shaking effect using a Shader I'm going to use the same effect on this rock but change some of the parameters so first let's go to the Shader and this is in

our trees folder let's just rename this Shader and just call it shake then let's just move the Shader so click move and

duplicate to and then just move it into the objects folder because we'll share it between the rocks and the tree so just move that then just turn off the

two Collision shapes so that we can see the Rock and then scroll down to material and let's create a new Shader material and drag the Shader into the

Shader property then in our Shake intensity let's just increase this to 0.3 and as the axe hits the rock will

just shake the rock slightly so let's just Reet that back to zero and then just unhide the Collision shapes now that we've applied the Shader we just

need to remodify our uner component to go back to small tree and in the script let's just copy and paste the code

that's in the unheard method so copy that go back to rock and then just paste that information in but for the shake

intensity let's reduce this to .3 and for the timeout let's just reduce

.3 and for the timeout let's just reduce this to 0.5 let's head back over to our test scene and then run our test scene and when we hit the rock you can see

that the rocks are all shaking so let's just make a couple more modifications let's stop the scene go back to the Rock and then scroll back down to the

material inside the Shader let's just for the resource switch on local to scene and then head back to test scene

objects and rocks and then just test the scene again so we got 1 2 3 4 and five and then close up now that brings us to

the end of this tutorial on how to create rocks for the game which can be mined and produce Stones we have reused some of the components which we have

created in previous tutorials in this [Music] series I will show you how to configure yort in for T up layers and other game

assets you will then be able to make the player and NPCs move in front of and behind those assets in your top down game so in previous tutorials we have

created rocks trees and tiles in our tole sets so that we can then add them to our tilemap layers to allow our player

to move in front and behind the different assets in our scenes collection and to set we need to configure y

sorting let's begin by going to our scenes folder and then the test folder and let's make a copy of our test scene objects Rock so right click that and

click duplicate and then name the scene test scene town map layer y sort let's open that scene and we can just close this previous one here I'm just going to

rename the scene at the top and call that test scene tilemap layer y sword then for the rocks tilemap layer just right click this and we'll just delete

that okay then right click game TI map add a child node and just search for TI map layer and then just going to rename this to objects and in the tile set

property just quickly load our game tile set and with tilemap selected start to paint some of our new objects so we've

got small tree large tree and our Rock here let's now test the scene so just run test scene and as you can see the player can move over the tree so let's

just stop that so now click on the player node and open this scene and on the player character node at the top just scroll down and turn on y sorts

save the scene and then go back to our test scene and then on the object layer this is the layer which we want to affect with y sorting so that the player

goes behind the tree so then go down find why sort and just enable that then test the scene so as you can see it

still goes over so I'll explain why so when you have an object with Y sorting the parents must also be y sorted so

click game tilemap and choose why sort then test the scene again and then close that and because the

player is why sorted and the game town map is wi sorted then the root must also be wi sorted so just click on the root

node and then choose why sort enabled now let's test the scene again and as you can see now the player goes behind the tree so we'll

test that with our lodge tree and we can see that with our Rock Let's just close that scene so now

that we have wi sorted our objects here we can always add them to this layer if we just go back to the tileset and then click basic grass biome things we can

start to configure wire sort within a tile set itself however we have different tiles in here which could be considered wire sorted and other ones

which we don't need to Y sort because the player can just walk over them so things like small plants and foliage doesn't need to be wi sorted so on the

game tilemap let's just add another child node choose tilemap layer and rename this to undergrowth and we'll just position this

above grass then with the undergrowth to map nod selected in tileset choose quick load and then game tileset for this TI

map layer we don't need y saw enabled but inside our tile map we need to decide which tiles we are going to use as undergrowth so the player can walk

over anything that's on the undergrowth layer so let's choose these following to so we have this one and this one here these small flowers and then these four

at the bottom are going to be in the water and the player will not be able to access the water uh this small mush room and that should be everything for now

once you've done that let's just test the scene again and then on game tilemap let's create another child node choose tilemap layer node and click create and rename

this to overgrowth then move this above the undergrowth power up layer node and in to set quick load and choose game tow

set and then we'll add the large sprit which the player can walk behind so let's choose this one here and this one and then the mushrooms and the

flowers then on the overgrowth power map layer know let's scroll down and enable wi sort now we can test the scene and if we move the player the player does go

behind the larger Sprite so let's just try this again we're going to walk in front of the Sprite and the player is walking through the Sprite what we need

to do is add a bit of a collision shape just around the bottom of the Sprite with this one I'm not going to add a collision shape because the player could

walk through the sunflower as it's a lot thinner and for the small flowers and mushrooms there will also be no Collision Shades because the player can walk through them as they're still

considered smaller so just stop that so so back on the overgrowth towel map layer let's now add a collision shape to our tree click the towel set and we need

to add a physics layer to our with set so just click add element here and leave it on the Collision layer ground here and the Collision mask also on ground

then choose tileset and in the paint property let's just select our physics layer and then just click on the towel to paint it and then what we'll do we

just move these markers here so just let's click on half pixel snap and you can zoom in just hold control and zoom

in and we will start to move our markers let's just zoom in and then just move this up and then once you've made the adjustments here click on here to paint it let's go to debug turn visible

Collision shapes on and then let's test the scene so as you can see the small Collision shape here and then when we use the player the player cannot go

through the tree but can go behind the tree now if we just move the player up slowly you can see that the tree only goes over the

player or the player only just goes behind the tree quite late so what we need to do is to move the Y sort positioning let's just close this window

go back on the towel set if we then go to select go to rendering and for this rendering just click kidney yur origin

and you can see that you get a blue marker here and what we want to do is to just adjust that y saw origin and move it slightly down and I'm going to set

this to about eight so that when the player moves further up towards the tree it should go behind the tree at the right point so when the player's y s

position is higher than the tree's y s position it will go behind so let test the scene and go to debug just turn these visible Collision shapes back off

and then run the test scene here and then let's just move slowly towards the tree and as you can see now the player moves behind the tree at a better point

and that is because we've adjusted the wi sort positioning let's stop that so I'll do the same thing for the sunflower so just click on sunflower just move

that into view so we can see the blue marker and I'll also change that y saw origin so we say about eight for that as well then just quickly test the

scene and I can walk through the sunflower it just goes behind the player at the right point just close that and now I'm going to modify the rest of the tile set adding some Collision shapes to

some of the assets and modifying some of the Y sort positionings [Music]

[Music] and now let's test the scene so let's just run the scene again and then let's

just move behind some of our assets so we can't go through the tree stump and then the other tree stump and we can go behind the log and walk up to the log and then we've got our mushrooms and

then we can that and with the flower as well that's looking much better let's close this when configuring wi sort it is best to use a test scene and then

drop the assets from your towel set and also the scenes collection as you configure the wire sort if you do get any issues there is a lot less

components here to diagnose if anything goes wrong also later when we create the levels if you find in the levels why sort is not working for a particular

asset you can always come back to the test scene and just check if it is working there now that brings us to the end of this tutorial on how to configure

wire sorts for your different assets and scenes in the scenes [Music] collection I will show you how to create

a chicken NPC complete with animations and the state machine for the state machine there will be two states which is Idol and walk there will be different

W Cycles so that there is a little variation in the game between each of the chicken NPC characters I will also cover how to use a navigation agent 2D

with avoidance enabled and then we will use a navigation region 2D so that your chicken can move within a specified area in a previous tutorial I've shown you

how to create a tilemap and use wi sort layers so before we create our chicken MPC let's just create a duplication of this scene so let's just click on test

scene tilemap layer y sort and you can find this in the scenes folder under test let's just right click and duplicate and we'll call this test scene

NPC chicken and then just click duplicate then we'll close the testing tilemap layer wi source and just open up

the test scene NPC chicken and then F2 and we'll rename this as test scene MPC chicken and just save the scene now we

still got some remnants of our last test scene however we want to keep these same tilemap layers so click on undergrowth go to tilemap click the arrays tool and

then choose the square and then just click to remove those previous tiles click overgrowth and then just click and drag to remove those tiles and then the

last one is objects and just remove those trees and then we can save the scene again now we are ready to create our non-playable character chicken and

create a new scene so click scene new scene and then choose other node and then search for character body 2D press

F2 to rename and call this chicken then go to the scenes and characters and create a new folder and call this chicken then let's save our scene click

on scenes go to characters and in chicken just save the chicken scene here so we've now got the chicken scene here and we'll start to add our Collision

shape animations and state machine so let's add a child node and then search for animated Sprite 2D and then create that nod inside of sprite frames let's

create a new Sprite frames and then just activate that and then rename this animation from default to Idol and just

set that to be default onload then click the ad frames option and go to the assets folder and in the game go to characters and then choose chicken

Sprite click open let's just zoom in just hold control and mouse wheel to zoom and then let's just say horizontal is four but the vertical is two then

choose use the first two Sprites for our Idol animation and click add frames then let's just zoom in and press play okay this is now animating and we'll leave

the looping on for this so just click stop then just click back on the animated Sprite 2D node and then press the up Arrow key to sit the chicken fee

on the X AIS so this is now just sat on the xaxis at zero then go chicken ADD child node and then choose Collision shap and in the shape option choose the

circle shape and then let's just reduce the size of that and just move that up let's save the scene then click back on animated Sprite 2D and then let's add a

new animation let's just double click that and rename this to walk click add Sprite frames and then choose chicken

Sprite again open let's zoom in and then choose these four Sprite frames here and add four frames we'll leave it on looping again and then let's just play

that okay let's start in a previous tutorial I have shown how to use a state machine for a player character I will show you how to use a state machine for

our MPC so just click on chicken ADD child and then just choose node and create that F2 and we'll rename this to State machine then let's go to our

scripts folder and in the state machine folder let's just click and drag the node State machine script onto the state machine node then click on the state

machine node and use ad child node choose node again and we'll rename this node to Idol and then choose attach script we will call this idle State and

we'll save this in the characters and chicken folder so just create that then in the scripts folder and state machine folder just open the node State script

use contrl a to select all and then copy this code and go back to the idle script and we'll just paste that in copy node State and then replace this on the

extends node and then just delete that class and then just remove these two items here and this will set up our script to create the idle node State now

let's use some export variabl so say add export variable character and then we'll use this character body 2D and then at

export again variable animation Sprite 2D and then animated Sprite 2D then click on state machine and then just set

the initial node state to be idle so when the game starts the first state will be our idle State then click on idle and let's assign the export

variables and then animated Sprite 2D and choose our animated Sprite now the reason why we are exporting variables is because when we then do the cow MPC you

will be be able to reuse these two states so the idol and walk state are the same and this is where we get to use reusable States so that when you start

to create many NPCs it becomes faster because you can reuse lots of these nodes and components so when we then enter the idol State let's then begin

our animation so we can say animated Sprite 2D play and then just write Idol and then for on exit just stop the

animation now we are ready to start testing our chicken MPC so just go to scenes test scenes and open up the test

scene MPC chicken then go to the 2D View and let's add our chicken to the scene so go back to scenes and characters and chicken and then just click and drag the

chicken into our scene then to run the current scene just click this button here and we can now see that the chicken is on the scene and is currently in the idle State let's just stop the scene and

to confirm that our chicken is in the idol State let's go back to our state machine script load node State machine

and then in the physics process function reenable the print statement here so that when the state machine is running

we print this state to our output console once that is done just let's go back to our view and then run the current scene again and as you can see

the current state doesn't have an output here and this is because I've not set the current state node name as it's being initialized so I'm just going to

close the window go back to the node State machine script and copy this line here on line

48 and just paste that line on line 19 so when we set the current node State I also get the current node state name and that is on the initialize ofit let's

just test the scene again and as you can see it's got the correct State here so we can now debug the state transitions I'm just going to close the window and in the test scene I've put the chicken

under the game tilemap so I'm just going to move that back out of there and put that under the test scene rout node that will just fix that and then head back

over to the chicken scene and let's begin creating a transition to our walk state so click on state machine ADD

child node choose node click create and then F2 and call this walk let's right click and then attach a new script and we'll save this as walk State and we'll

save this in characters and the chicken folder click create open up the node State scripts again and let's copy the code go back to the walk State script

and paste that in we'll copy node State and change the node Parts here remove the class name so we extend the node State script and then just remove these

two items at the top and this will just set up the state script now to transition from Idol to war let's just go to our idle script and we need to

modify our on next transitions method here however we will leave the chicken idling for a time interval then when the

time interval has elaps we will move from idle to the walk state so in our idle State script create an unready

variable and we'll call this idle State timer use the timer and then let's create a new instance of our timer which

you can do that by just saying timer.

new and create a new export variable called idle State time interval which is of type fla and we'll set this to a

default value of 5 Seconds the next step is to override the ready function and get the idle State timer and then for

the wait time parameter just assign our idle State time interval then we need to create the timeout connection so we say

idle State timer do timeout and then connect that timeout signal and we'll say on idle State time out and then

create that function return avoid and for now just right pass and then because we've created the timer inside of our

script we need to make sure that we add this node to our scene so we can do that by just saying ADD child and just pass

in the idle State timer now create another variable so we say V idle State time out which is a Boolean and we'll just set this to a default value of fals

then in the on idle State timeout method we can just set this value to True once the timeout interval has been reached

then in our on next transitions we say if idle State timeout is true then transition Emit and transition to the

walk State then in the onenter method the idol State time out equals false so every time we go into our idle we always

reset the timer and then start the timer again and when we exit the idle State we can just say Idol say timer and then we'll stop the

timer then on the chicken scene let's go to our walk script and we'll do some more export variables here so we can copy and paste the two export variables

for the character and the animated Sprite 2D so let's just copy and paste those in then click the walk node and in the inspector let's just assign chicken

for the character and then the animated Sprite 2D as well and in on enter let's say animated Sprite 2D play and then set

the walk animation and then when we exit the walk State we just want to turn off the animation now let's head over to our test scene NPC chicken and let's just

test the scene and as you can see in the output window we've got current state idle and we're going to wait until the chicken goes into the walk State we can now see that current state is walk but

we also picking up the Debo message for our player which is currently in the idol state so let's head over to the state machine script go back to chicken

and then go to our state machine script and at the top of the ND state machine script let's add another variable or

parent ND name which is a type of string then at the top of the ready function say parent node name equals get parent.

name then copy the parent node name variable and inside the print statement just paste this as the first parameter comma and then add a space we can now

clear the output log using this button here and then let's test the scene once again so we've currently got now player

current state is Idol which is this Nord here and then we've got chicken current state walk so we now know that our chicken has transitioned from idle state

to our walk State let's just close the window now back in our chicken and walk State scrip we need to complete the ability for the chicken to walk between

two different points in our game so to achieve this we're going to use a navigation region 2D so back on testing NPC chicken let's add a child Nord

search for Nord 2D and then rename this to chickens and inside of here just add another child n and search for

navigation region 2D then in our view in navigation region 2D we have a property called navigation polygon so just create

a new navigation polygon and then start to draw polygon shape once we've created the polygon shape click bake navigation

polygon this will then set up a region which will allow the chicken to move within then I'm just going to click and drag the chicken and Pop That under chickens and then go back to the chicken

scene right click chicken ADD child node and then add a navigation agent 2D as a child so just create that and we'll just move that above the state machine no

then back on on the NPC chicken test scene click on navigation region 2D click on the navigation polygon and then for navigation layers let's just edit

layer names for layer one we'll call this chicken navigation then head back to the chicken scene and then just hover over navigation layer one and you can

see that it's already set to the chicken navigation head to the chicken and go to navigation agent 2D and leave the already on one which is chicken

navigation and what we're saying is that the chicken is associated with the navigation layer which is the chicken navigation now let's head back over to

the wal State script and let's begin by creating the ready function so override ready and then let's also create a

character setup function so I'll say function character set up and return void then inside the character to set up we want to do an await get tree and

await for the first physics frame now when we use navigation region the navigation agent needs to wait after the first physics frame and then starts to

process the next Target so we're going to create another function and call this set movement Target which will also return aoid then back in the character

setup let's call set movement Target then in the ready method meod use call deferred and we will call the character setup

method call deferred is a useful method to allow you to call other functions after the current frame has finished processing so call deferred will call

character setup during the idle time then when character setup is called we will wait until after the first physics frame this will allow for a smoother

setup of of our navigation agent before we start to move between different targets so at the top of the scripts let's add another export variable which

is navigation agent 2D and the type is navigation agent 2D then in the set movement Target function we will say VAR

Target position which is of type Vector 2 equals navigation server 2D dot map

get random Point function passing navigation agent 2D doget navigation Mark and the second parameter is

navigation agent 2D navigation layers and the third parameter is false on the next line let's say

navigation agent 2D Target position equals our current Target position then at the top of the script add a new variable called speed with a type of

float then export two new variables and we need a minimum speed which is a type of float and we'll default this to five

then a maximum speed which will also default to 10 then back in the set movement Target function we can say

speed equals and then use the Run f range function and pass in the minimum speed the maximum speed and what this will do

is it will set the default speed value and it will choose a speed between five and 10 so that each chicken that we add to the scene will all get a different

speed and this will allow for some variation with each of the characters now in the on physics process method let's write the code which actually

moves the chicken character so let's start with four Target position position which is a type of Vector 2 equals the

navigation agent 2D variable dot get next PATH position then say V Target Direction which is also a type of Vector

2 equals our export variable character Global position and then direction to the Target position so this will get the

facing direction that our character is facing towards the next step is to get our animated Sprite 2D and then use dot

flip H equals the target direction do X which is the axis value and if this is less than zero then we want to flip the

chicken then say character do velocity equals our Target Direction multipli by speed then character do move and slide

to process the movement of our character now we are not using Delta in our calculation because the character will

use the Delta time inside of the move and slide so all we need to do is to calculate the target Direction by speed and assign that to Velocity internally

Delta will be calculated for us then click on the walk State and for navigation agent 2D let's just assign

our navigation agent 2D and click okay now we are ready to test the chicken so click on testing NPC chicken and then run our test scene so the chicken is

currently in Idol and now the chicken is starting to walk but what we'll do is we'll enable some debuging so that we can see the line that the chicken is walking

along so in the chicken scene click on navigation agent 2D scroll down in the inspector until you see debug and then just cck click enabled let's head back

to the test scene and run again and as you can see we now have a debug line and the chicken is walking along however as you can see there's a thick staircase

effect and this is making the chicken bounce quite a lot up and down so let's just stop that there is a way to make that line much more sharper and what we

can do we can go to project project settings then go to window under display scroll down and for stretch mode change this to

Canvas items and for aspect mode change this to keep then scroll down further and in rendering choose 2D and in snap

turn on Snap 2D transforms to pixels and click close And then test the scene again as you can see the line is much thinner and

is reducing that staircase effect let's close the window so I'll just on the scene one more time so using canvas items in conjunction with a navigation

agent 2D can help reduce or eliminate the staircase effect due to the fact that it does have improved interpolation features so the movement can be smoothed

out between the way points the agent's movement can be interpolated to create smoother curves and transitions between those path points and it just resolves in a more fluid motion and that just

reduces the staircase effect now as you can see the chicken once it reaches the last way point we need to generate a new way point so let's do

that so head back to the chicken scene click on the walk State script and in the on phisit process we just want to check if the navigation agent 2D has

finished moving so we'll say if navigation agent 2D do is navigation finished then call set movement Target again and then

return from the function now let's test the scene again so just choose test scene NPC chicken again and then just run that test scene so the chicken is

now going to move to the first Waypoint then the navigation finished and generated another Waypoint as the chicken approaches the

second Waypoint a third one will also be created but as you can see the chicken keeps on walking and we are not going back to the idle state so let's just solve that

let's close the window so go back to chicken and then the walk State script and in our on next transitions method

let's copy the if statement so if navigation agent 2D is navigation finished then set the velocity zero and

transition to Idol then let's just test the the scene one more time so the chicken is now walking to our first Waypoint then the chicken current state is idle and we can see that in the

output window so the chicken again is walking to the second Waypoint it's currently walking and now the chicken is

currently in idle so that is currently working our next step is to consider many chickens in our navigation region

all at the same time and how will those agents avoid each other so if we click on navigation agent 2D there is a section under avoidance where we can

turn this feature on however our scripts will need to be updated so that we do manage our avoidance when it is enabled

and when it is not enabled so first head over to the test scene and with the chicken scene let's just right click and duplicate this scene let's just go to

our 2D View and let's just move our chicken into a new position let's just duplicate our chicken again and then

let's move the chicken again and let's just put a fourth one on there okay now let's run and test the

scene and let's just wait for them to begin moving now as you can see this cluster of chickens here are all colliding with each other and they are

not really performing any avoidance so let's just stop the scene and let's just modify the script and then enable our

avoidance so back on our chicken scene and then on the walk State script and in the ready method let say navigation

agent 2D velocity computed signal and then connect and we will create a function called on safe velocity computed so underneath the function on

physics process create a function called unsafe velocity computed with a parameter called safe velocity which is

a type of vector two and will return void then back in the on physics process method after animated Sprite 2D do flip

let's just return here and create a variable velocity which is a vector 2 equals and then just copy this code here

then say if navigation a agent 2D do avoidance enabled then say navigation

agent 2D do velocity equals our velocity variable here above else assign velocity to our characters velocity so just

replace that bit of code here then just tab the character. move slide so if the avoidance is enabled we then set

velocity to navigation agent 2D and this will then cause the unsafe velocity computed signal to be called and this

function will be called here so if we do enable the avoidance then what we want to do is to assign velocity to Safe

velocity which is calculated for us and then in here we will call character.

move and slide so if the avoidance is disabled we just sign the velocity as normal and then we also perform move and slide so now that the script is complete

let's go back to our test scene and then run our test scene so as you can see the agents here have just tried to avoid each other and and again you can see

them avoiding here and we can see the agents also avoiding again here too now as you can see the distance between the

agents is possibly too large so let just close the scene go back onto the chicken scene and on navigation agent 2D and if we just look at the Sprite here we could

probably reduce the radius to about five so back on navigation agent 2D let's just reduce the radius to five and then

let's test the scene again so as we can see the agents are avoiding each other yet the distance is much better for the avoidance now to finish off our walks

State script let's introduce some walk Cycles we can autogenerate some walk Cycles so that some chickens only move for two water cycles then go to Idol and

other chickens may move three or four or maybe five water cycles and then go back to Idol it will just introduce some more randomization for the chickens in our

game so head over to our chicken scene then go to scenes and characters folder and in the root folder create a new script and call this

non-playable character let's open that script give the class name as non-playable character and just extend

that from character body 2D then export a variable called Min wart cycle which is Type in and then export a variable

Max W cycle of type int then declare another variable called walk cycles and that is also type in now on our chicken scene node here let's just attach a new

script and in the scenes characters and chicken folder let's just save our new chicken script just create that then on the X end we will say non-playable

character now let's hop over back to our non-playable character script and in the MIM W cycle let's give this a default value of two and for the max W cycle the

default value of six and then on the chicken screen script let's override our ready function and we'll say walk Cycles

equals Rand ey range passing Min W cycles and Max W cycle now the Randy range function will return a value

between two and six so if we just go back to the non-playable character script we have set these default values here and we also need a current walk

cycle which is also type of in now let's head over to our W State script and where we export this variable here let's

just change this to be non-playable character and this will give us access to these variables here so in the W

State script we can now go to the on physics process method and say character dot current W cycle plus equals 1 then

in the UN next transitions method instead of saying if navigation agent 2D is navigation finished we can say

character. current W cycle is equal to

character. current W cycle is equal to the characters W Cycles so if the W Cycles is set to three as we go through

each wart cycle once current W cycle equals three it will then go into Idol let's set a break point here on line 34

let's set a break point here on line 9 55 let's go to our test scene and let's just remove these three chickens so that we've only got the one chicken in the

scene now let's just test our scene as you can see the chicken is currently in the idle State then if we click remote here and choose our chicken scene we

have generated an automatic number for water cycles which is four and our current water cycle is zero so press F12 we'll just remove the breake point here

and we'll just reset it on here so now the chicken is moving and the chicken is now hit it's navigation is finished so if we look again in the remote and then

click on chicken the current water cycle has now been incremented to one so let's press F12 again so the chicken has hit the second W cycle and the chicken is moving and the chicken's hitting the

next W cycle so we're in current W cycle 3 and now the chicken is going to hit it again in and we've now got a current water cycle of four so we just F12 that

and we can now see that on the next transition has been called and we're going to now transition into idle just F12 that so now the chicken is currently

in the idle state but what we need to do is to then reset the character current water cycle back to zero so let's just

stop that when we always enter the state let's make sure that our current W cycle is zero so in the under enter method we'll just say character. current water

cycle equals z here let's go back to our testing NPC chicken and then let's just duplicate our chicken so I'm just going to put manyu on here for now and then

I'm going to go back to chicken and on navigation agent 2D I'm just going to turn off the debug for the navigation agent then go back to test scene NPC

chicken and then let's run that career Tess so we've got a couple of chickens in idle here now some more in idle again here and another Chicken in idle here

and another one here so we've created a randomized effect for our chickens let's stop the scene and now for our final Improvement for the walk State script we

are using Target direction to flip the Sprite based on which direction the character is moving in however when we use avoidance when a character is

avoiding another character it may temporarily want to switch direction as it avoids and then switch back because it is going to the Waypoint which is

intended so copy this line and then paste the line line just under the if statement here and then copy the velocity parameter and paste it over

Target Direction then copy the line again and in unsafe velocity computed let's just paste that and then copy save

velocity and paste it over the velocity parameter and that will resolve flipping our Sprite now that brings us to the end of this tutorial on how to create a

non-playable character which can move freely using a navigation region and navigation agents we have also looked at avoidance of other non-playable

characters within our navigation region our non-playable character is also using a state machine and can move from the idle State into walk States and have W

Cycles which gives the characters just a little bit of variation on how they are moving around in your game [Music]

I will show you how to create a cow NPC with animations a state machine some states and a navigation agent 2D so that the cow can move freely within a navigation

region so before we create the test scene for our cow MPC I advise that you watch the tutorial previously on how we

created the chicken MPC I've gone into detail on how we created the chicken character the state machine and the different states I've also covered how

to add a navigation agent 2D and then allow the chicken to move within a navigation region now creating the cow MPC is almost identical so there will be

parts of this video which I will speed up during development this is because the cow MPC has been designed to be exactly like the chicken MPC however

there will be some parts that are slightly different so just stay tuned but I am highlighting is how you can make reusable components so that it's

easier to add new NPCs to your game so let's begin by going to scenes and test and duplicate the chicken NPC scene so

right click and duplicate this scene and we'll call it NPC how then load the scene and then let's just remove these chickens here and

we'll rename this scene the cows rename the test SC and just save that then on the navigation region 2D let's just make some slight modifications just click

bake navigation polygon and on the navigation layers go to edit layers and you can see layer one is for chicken navigation so let's add a different

layer for our cows we'll call that cow navigation just close up and then just set this to layer two then go to scene new scene other node and choose

character body 2D let's rename this to c and then save the scene so go to scenes characters create a new folder for this cow and then save the scene in that

folder I will now speed up some sections of this tutorial because creating the cow MPC is identical to creating the chicken MPC which I've covered in the previous tutorial however there are some

sections which will be normal and I will talk you through those slight changes between the two NPC characters

[Music]

[Music]

[Music] [Music]

so for the cow MPC I have now created an animated Sprite 2D which has two animations idle and walk they are the same as the animations in the chicken

MPC this allows me to reuse our states which we created for the state machine so I've moved the States from the

chicken folder into a global MPC States folder so when I've then created the state machine for the cow if I then click on the idle State I can use the

same animations this allows us to then create States and reuse them on other NPCs now let's add a navigation agent to

2D so go to add child node and search for a navigation agent 2D and click create let's just move this above above the state machine and in navigation

layers choose the cow navigation layer then scroll down and turn on avoidance enabled let's go to the scene and from the center point let's just see how many

pixels there are so roughly there's about 10 to 12 so we can leave the radius for now at 10 I am now going to

add some cows to my test scene

[Music]

[Music]

now I need to actually update the cow script as we've done for the chicken script so here we need to add these things here so let me just copy this

code and we'll create a cow script we'll save that to the cow folder then copy and paste that information here and for the idol and what states make sure that

we assign the correct nodes to those properties so now the cow is visible and then before we test the scene again let me just check that we've

assigned initial n state so let's just set the state machine to first start with the idal state so just check that all the export variables are now

assigned to and we have the script so the extends non-playable character this is why we are able to now assign the cow here and now we ready to test the scene

again so as you can see the cows are now moving between Idol and the W cycles and we have reused many of the components which we have created for the chicken

[Music] NPC I will show you how to create different Navigation regions so that you can group different NPCs into different

areas each of these NPCs have their own navigation agents with different parameters to enable them to have avoidance and to also move across the

path and to reach the desired Target so I'll begin by creating a new test scene so go to scenes folder test and then duplicate test scene NPC chicken

duplicate that and call test scene NPC and navigation let's open that scene let's just rename the node to call

that test scene NPC navigation just save that then I'm going to just remove the camera from the player just so that when we load the test scene we can just see

the full screen viewport and under the chickens node I'm just going to remove the navigation region 2D and all the chickens too so let's now add our fences

to our tilemap let's click objects and then we'll use the game to set so click on game tileset so that it opens and then first let's add a new terrain let's

add an element and we'll call this fences and we'll just save that with the default color here then click on to set and go to assets to set and find the

fence's PNG and then just drag that into the tile set so for this we will use all the tiles so let's just click yes for that and then we'll just zoom in and

then let's just select the first tile click on paint and then the first thing we want to do is to set the terrain so we'll say the terrain is set zero and we

want to choose fences so choose the first option and then we'll start to paint if the color is difficult to see you can always change the color and make it a little bit easier so I'll choose

something a bit brighter and then I'll just paint these tiles [Music] here so that completes connecting our

terrain so that when we then draw the fences we'll draw the pattern correctly and we'll test this out on our test scene so the next step is to paint the

Collision shapes onto the fence poles so that the MPCs and player can't walk through them but in the paint properties choose physics layer zero which if we

look at our pile set the Collision layer is already on ground so the physics layer will look here which is our first

layer here and it will choose the ground option for one let's paint the first tile then choose half pixel snap to allow us to easily set the markers so

we'll just start to pull the markers in then once you're happy just click the towel to paint then follow the steps for all of the

[Music] tiles now we can head over to town Mar and just look at terrains and there should be a fences terrain now what

we'll do is let's just zoom in on our tiles and let's just draw our first chicken pen so I'll just click the line here and with fences selected I'll draw

a line here and then I'll just move the player to down here so let's just view the Collision shapes so just click Collision shapes on for debug and then

let's just test the scene you can then tweak the Collision Shades if you wish but I'm just going to leave it for now now under the chickens node let's add a

child node and search for navigation region 2D then in navigation polygon choose new navigation polygon for

navigation layers choose chicken navigation which is layer one then open up navigation polygon and start to draw the points for the

navigation and then bake the navigation polygon let Let's test the scene again but first go to the debug menu make sure visible Collision shapes is on and also

turn on visible navigation Let's test the scene as you can see we've got our navigation region and the fences with Collision shapes however we would like to subtract the Collision shapes from

our navigation region let's close the window so in navigation region with navigation polygon on make sure the porse Collision mask is selected for the

first option which is ground for post geometry type we can leave this as meshes and static colliders then for the source geometry here for this property

choose group explicit and then copy this group name here then click on objects go to node and we can add this name as a

group and then just turn on global and click okay so now this toap layer belongs to this navigation Polygon Group then go back to to navigation region and

click bake navigation polygon again and as you can see using group explicit we've included those tiles and the

polygon has rebaked and subtracted all of the cision shapes now let's start adding our chickens back to the scenes so we go scenes characters and chicken

folder and then drag the chicken scene into our game then right click and duplicate the chicken and we'll keep duplicating waiting until we've got many chickens in the

sea now that we have many chickens in the scene let's just test the scene again and let's just observe some of the results of the chickens moving around now as you can see some of the chickens

are starting to Cluster around the edges and they're getting a little bit stuck here and this chicken is stuck here so let's make some modifications to our navigation agent 2D to try and prevent

some of this Behavior happening so let's head over to the chicken scene and choose navigation agent 2D and for the path desired distance let's just reduce

this down to 10 and this is the desired distance that the chicken will move away from the path for the Target desired distance we can just reset this back to 10 and that is the threshold distance

that the target is considered to be reached so we'll just reduce that as well then for path PST processing instead of corridor funnel we'll choose Edge centered and for the

meantime we'll just keep the avoidance enabled then on the chicken let's create a new Collision layer and we'll call this MPC and just place the chicken on

the MPC layer and for now we'll leave the mask to be ground now let's head over to the test scene and let's just run this again so now that the MPCs are

on their own Collision layer they can now move closer together also the postprocessing path is now set to Edge centered which means as the path has

been generated with these red debug lines instead of being on the edge of the navigation region they're now in the center so this is helping the NPCs to

not stray too far away from the desired path therefore we don't get them clustering on the edges and getting stuck against the fence's Collision shape now we can create the pen for the

cowls so just close the window so click on objects tilemap and [Music] fences and ADD child node choose node 2D

and rename to cows then add another child node choose navigation region 2D and then create a navigation polygon for

the navigation layers choose cow navigation and then draw the polygon once that's complete we can then bake

the polygon and to subract the Collision shapes go to Source geometry mode and then choose group explicit and then bake the navigation again now let's add our

cow scenes so just go to scenes characters and cow and then just drag the cow onto the scene let's open the Cal scene click on

the character and then just scroll down and for Collision layer choose MPC and then turn off that ground layer here

then click navigation agent 2D and just scroll down and turn debug enabled on then head over to the test scene and run the test scene so as you can see the

path that's generated is not Edge centered so we need to just modify that so back in the Calene a navigation agent 2D change path post processing to be

Edge centered here now let's run the testing once again and as we can see we now have Edge centered here which is much better let's close that to go back

to chicken let's just turn off our debug off then in cow the navigation agent let's turn debug off again and in debug here let's just turn off visible

collision shetes and visible navigation and then we can run the test scene now that brings us to the end of this tutorial on how to create multiple NPCs and different different Navigation

regions with adjustments to navigation agent settings so that the agents can move freely around those [Music]

areas I will show you how to create a tools panel UI complete with a theme and how to style the different controls the tools panel will allow the player to

select different tools such as the axe to chop trees the tilling tool to to farmland and the watering con the water crops you can then Advance on the tools

panel UI and add your own tools in the scenes folder create a new folder and call this UI then go to scene

new scene click user interface and then just F2 and call this TOS tunnel and let's save the scene into our new UI

folder then go to the assets folder and create a new folder in here and call this UI now we will download the assets which we will require to create our

tools panel UI before we get started we need to download the Sprout lands UI expansion pack which can be found on itch.io by cot nuble I will leave the

link in the description below so just click download now and then unzip the file to get the UI assets once you have downloaded and unzipped the Sprout lands

UI Park just go into the pack and under Sprite sheet just drag the Sprite sheet for basic pack into the assets and UI

folder then in the mouse Sprites folder copy triangle Mouse icon one and drag that into the UI folder and in the

dialogue UI folder under imot folder just copy the t-mo basic IMO Animation Sprite sheet so we've just copied three

Sprite sheets over into our Assets in UI folder now that we have these three Sprite sheets in our game let's just format the name so that they are better

for our project structure so F2 the first one and call this basic UI Sprites for the next one we'll just call it emotes and for the third one we'll just

call this mouse uncore icon now click on the tools panel control scroll down until we get to theme so click on new

theme right click and save as and in the scenes UI folder let's call this gamecore UI theme and just save

that then click on the theme resource and it will load the theme panel so now click this plus button here and usually you would choose your control which is a

default control and then style it however I'm going to show you how to create different styles for the same type of control so we may have many many

buttons which will have different styles and this is the same case for the panels so in other software Frameworks these are known as style classes or style

resources so first of all in here we'll type dark wood pel and then just click add type and as you can see there's no

control for this so click this last option here and in the base type add and search for panel container select that option and then just set that as the

base type so what we are creating here is a Darkwood panel Dow class which is applied to the type of panel container then back in the tools panel there is an

option called type variation just click edit here and type dark word panel and just click the take so this will apply

this style class to the tools panel and here this is where we can have different styles for the same type of control and then just apply that type variation to

it so click back on the tools panel node right click and then change the type and search for panel container so just change that type and make sure that it

matches the type in our theme so let's now style the panel click this button here to style it and then click empty

and then new stylebox texture and then click the style texture to load it in the inspector for texture click empty again and then choose new Atlas texture

and open that and for the atlas property bring over the basic UI Sprite and then click edit region and then for SNAP mode

click Auto slice and zoom in and choose this Sprite here click close then just close that option and scroll down and you'll see an

option call sub region choose edit region and then from snap mode choose pixel snap and then with these black and white bars just start to bring this in

for the frame and you can see it will start to modify the panel in the scene so bring that down to here and then we'll do it from the right hand side and

then also from the bottom so bring the boys in so that we frame this section here and then click close And as you can

see we now have our styled so just to quickly recap on the style box texture choose Atlas texture and when you open

the resource you have an edit region inside of the atlas texture resource that will help you first pick the actual Sprite then collapse the resource and to

do the sub region is the edit region here now to add the tool buttons let's go to tools panel add child node and search for margin container this will

help just put a margin around the buttons then add child node again search for hbox container create that this will lay out the buttons horizontally and

then for the first button ADD child node and search for a button and just create that then click on button press F2 and then let's rename this to Tool ax then

scroll down to custom minimum size and just set the X and Y to 26 so this will just change the size of the button then click on tools panel and for the anchor

preset choose top left let's just zoom in on this and as you can see our button now is just fitting inside of the panel so now let's modify the style for margin

container and because we have the theme assigned to our theme property at the root node we don't have to assign theme

to every single child node so click on tools panel to access the theme and then in the theme click the plus button here again and search for margin container

and we're going to apply it to all the margin containers without using a style class so this is the default style so click add type then choose this option

here click plus and then write 10 plus again and then 10 again and then 10 for the last option and now we can sty the button so with the game UI theme Open

click click the plus button here and then write to all button and then click add type click this option here at the end and then the plus button and then

search for button and then add that as the base type then click on tool ax button and we'll scroll down and under theme for the type variation click the

edit icon here and then write tool button for the style type and then just click the tip box let's just go back to Theme by clicking on the tools panel and

then click this option here to add the style boxes so for normal click the plus button here and then click on enter and then choose new style box texture click

on the resource and for the texture click the empty option and choose new Atlas texture open up the atlas texture resource and then drag the basic UI

Sprite into the atlas property then we can choose edit region and choose Auto slice and then zoom in here and we want to choose these buttons here but we'll

choose this one for normal so zoom in and then click close just close the atlas texture resource and then scroll down to sub region click edit region and

then choose pixel snap and then just start to bring in the bars so that we frame the button and once we've got this Frame here so that we can frame the

outside of the button edges then we'll have this content in the middle so just click close here once you're finished now for the next style right click

choose copy to copy the normal style let's scroll up until we find Hover click the plus button then right click on empty and then choose paste but then

right click again and say make unique recursive then what we need to do is to make all of these Styles unique otherwise they are shed which which means when we modify it in one place it

will then modify it in the other place so make these resources unique click okay and then click the style box texture again and as you can see it's

already preconfigured however because we've made it unique the texture resource here is also unique so let's now just click the

atlas texture here and let's click edit region again zoom out and choose Auto slies but then pick this option here for

the hover style so close that and then just close the resource and then click edit sub region and as you can see the sub region is already created for us so

it saves us from having to create sub regions again so just click close there now let's test the scene to just see the effect of those two Styles so just run

the current scene and then just hover it over the button so so we can see the style is starting to change so I'm now going to just head back over to the theme and then I'm

going to copy the style from the hover option and then scroll down until you see press click the plus button and right click and choose paste then right

click again and choose make unique then say okay then open up the Press style then for the texture open up the atlas texture and then choose edit region then

zoom out and with auto size selected still let's choose this lighter colored option and then choose close and then just save all scenes then we should just

be able to run this scene again so hover and then when you click the mouse you can see that it's highlighting but we now have a bar around it so this is the

focus style so let's just stop that so click back on theme then copy the Press style scroll to focus just create a new style and

right click and paste that style then right click again and make unique and click okay then let's run the test scene again so we've got hover pressed and

focus as you can see once it's been pressed it has focus and it keeps that pressed look let's close that scene again so go back to tools panel and then

Open the theme again let's just copy the focus sty style and then for disabled click a new style right click choose

paste then right click make unique recursive and click okay then choose the disabled style and open up the Atlas

Resource choose edit region and for the disabled button choose this last option which is the Gray colored option and then click close And to test the

disabled style for our button choose the tool a button and then filter properties write disabled and then for this option

just temporarily switch it on and as you can see the disabled style is applied so we can just revert that and that just tests the disabled style box texture for

us now we're ready to apply an icon to the button so click on tool a button and in icon for the texture choose new Atlas

texture and then just open that then go to assets game for and objects and then drag on basic tools

and materials to the atlas then choose edit region and this time choose grid snap and then just drag the grid over the ax tool and then just click close

And this completes the ax button so right click and duplicate the ax button then F2 and we'll call this

toing and now we've duplicated the button but what we do need is a new icon so right click on the icon Atlas texture

and then say make unique recursive click okay then open the resource go back to edit region and this time drag the grid

over the tilling tool and then click close so I'm going to modify the margin container that's around these buttons now if I look at the style I have the

default style set to 10 so I'm actually going to leave that as it is what I'd like to do is override this on just this control here so I'm just going to click

margin container and then scroll down go to theme override and we can override the margin values here so let's turn these all on and then set a value of

four for each of the options and as you can see that margin is much better now let's add the next tool so right click tool tilling duplicate it F2 to rename

and call this water Inc right click the the icon resource and say make unique recursive open the resource edit region and then choose the watering can

option right click the tool watering can button and then duplicate that again F2 and call this tool corn but for the icon

let's just create a new Atlas texture open that and in the assets game objects folder bring over the basic plants and just just put that into the atlas then

click edit region use grid snap for the snap mode and then choose this seed bag

here close then duplicate the tool coin button again F2 and call this tool tomato then right click the resource for

the icon and we can just make this unique and recursive open that edit region and then just choose the tomato all seeds and click close here and then

we can save all the scenes and as you can see the icons some of them are just off center so starting at the top with tool a scroll down until you get icon

behavior and for Icon alignment choose Center for each of the two [Music]

buttons then finally for the Tomato icon I'll just choose Center for that to so now that we've created the tools panel UI let's create a game screen which will

overlay the game so go back to our UI folder let's go scene new scene and choose other node and search for canvas

layer and create that and rename this and call it game screen then save the scene and go to scenes folder UI and

save it as the game screen then drag the tools panel into the game screen then click on game screen and add a child node and search for margin container

then Nest the tools panel inside of the margin container then click on margin container and scroll down and for the

theme just click and choose quick load and then select game UI theme and as you can see it's automatically added that 10

pixel margin from our theme so that's correct then for the anchor preset choose for RCT and now let's position the tools

panel inside of the margin container so click on tools panel and choose shrink Center and then vertical alignment shrink end and that will position the

tools in the bottom of our game screen our next step is to create a test UI so we'll go to scenes and test and let's just create a another test scene which

will then overlay the game screen onto and we can start to test the UI so click on test scene player and then just duplicate this test scene and we'll call

this test scene Game screen UI and just duplicate that let's open the test scene Game screen UI then go to scenes and UI

folder and then just drag the game screen onto our test scene and as you can see the tools are now overlay onto to our game so now that our game screen

is ready let's go to tools panel and let's connect the buttons up so that we can use the ax tool for the player then the player can use the tilling tool

watering and then plant the seeds so in tools panel right click tools panel and then attach a script and we'll save our script in the scen UI folder so click

create here then click and highlight all of the tool buttons and holding control click and drag them into our script this will then create us five unready

variables so we'll have the tool ax button tool tilling button the watering can corn and tomato Button as well and now let's link up the Pressed events

from each of the buttons so click on tool act go to node and then click press click connect and then click connect

here and it will add as a signal connection for the press action so when the player presses the tool act button we want to then set that tool on our

player and to do this we'll need a global script so go to the scripts folder and in globals let's right click and create a new script call this tool

manager and then click create and open the tool manager script then head over to project project settings and in globals C the Open folder and open the

to tool manager and then click add leave this is enabled and then just click close so now that we've added the tool manager as a global script this will act as a Singleton which will appear for our

game scenes and then we can access this from anywhere let's just start to add some parameters so we'll say voice selected tool which is a type data

types. tool and then we'll assign it the

types. tool and then we'll assign it the non variable as a default then let's create a signal and we'll call this tool selected and we'll pass in the data

types tools so in a previous tutorial I shown you how to create this enum type and we've created some values in our enum which is none then it's for aing

the wood tilling the ground watering crops planting coin and planting tomatoes then back on our tool manager script let's create another function and

we'll just call this select tool we'll pass in the tool and we'll return void and then what we need need to do is just call the signal and emit the selected

tool and then just set selected tool to be the tool which is passed into the select tool function so now our tools manager script is complete let's just

head over to tools panel script then let's get hold of the tool manager then choose the select tool function then from our eor we can just say tools and

then pass in the axw parameter so when we select this tool let's now assign that tool to the player let's just go to our characters folder under scenes go to

the player folder and open them player scene open the player script and as you can see we have a current tool which uses the data types enom let's override

the ready function and then say tool manager do tool selected so this is the signal and then connect our signal and then just say on to all selected then

let's create that function so we can just copy this and then just say to all data types. tools and then return void

data types. tools and then return void then Set current tool the tool that is being passed into our

method and then let's also set the current tool on our hit component so click the hit component hold control down and drag that into the script then

copy hit component and just say hit component component current tool equals tool then on the hit component let's just reset our current tool so that it's

always nonone to begin with let's go back to tools panel and in the script let's just connect the tool tilling to

go to node press click connect and then click connect here let's copy our code from the previous tool X press method

and just paste that here and then for tools. X will change that to be till

tools. X will change that to be till ground and go back to player choose the player node and then just reset the current tool here also to be known now

before we test the scene let's just print a debug statement so we'll say to and then pass the tool value in so we'll get an integer for the tool so for our

ax it'll be number one and for tail ground it will be number two now let's head over to our testing game UI and then let's just run that scene let's

just face right and then click the axe tool and then when we click it the axe animation is present and then let's just check the output so this is tool one

let's just choose the next tool so it's now switch to 202 and let's just click and we can see that we have the tilling animation so we've now successfully

linked up these two buttons I'm now just going to clean up that debug scripts from here and then back on the two to panel I'm just going to link up the other buttons

[Music] here so now I've completed adding the other press signals and then updated the

tool manager select tool to pass in the correct data type tool so now that we've added all of the extra pressed events let's go to the test SC and let's just

run this again let's choose the ax that's the ax animation filling now there's no way to unselect the tools so let's just pop in some code which will

allow us to deselect the tool so we go back to the nons go head to tools panel and then the tools panel script and then add a new action to the input map so

we'll go to project project settings and in input map for add new action we'll call this release tool and just add that then click the plus button here and then

just press the right Mouse button down and then click okay and close that then back in the tools panel script let's

override the unhandled input event and then say if event a action pressed release tool then get the tool manager

select tool and then passing data types do tools do non to release the tool then call tool x. relase focus and then we'll do that for the rest of the

[Music] buttons this will allow us to release the button focus when we've clicked the right Mouse button so let's just add a

break points here and then let's run the test scene choose the ax tool and then click the left Mouse button to perform the action and then we want to release the tool so just click the right Mouse

button and that is now hitting the break point which will then choose the non-tool and release Focus so press F12 let's close the window let's remove the

break point and test the scene again so we can choose the ax tool waltering C and then right click and it releases let's choose the tilling tool and we can

now till the axe tool and then release so that brings us to the end of this tutorial on how to create a toolbar with many different Tools in it in the future

tutorial I will show you how to till the land then plant corn and tomatoes and then water those crops so that they begin to [Music]

grow I will show you how to create many different collectible types using reusable components you will then be able to easily add more Collectibles to

your game so let's begin creating some more collectibles in a previous tutorial I've shown you how to create the log collectible and this collectible

component is reusable so I will reiterate how I've created that and then we will attach the collectible component onto some new collectible items and that

will prepare us for the next tutorial where I will create the inventory panel and show you how to update the inventory panel when the player collects those

items so go to scene new scene other node and search for sprite 2D then rename this to egg and then go to game

objects and we have an egg item so just drag that into our texture and then let's zoom in then in the scenes folder go to the components folder and for the

collectible component scene just drag that onto our egg item so let's just have a look at the scripts that we've created for the collectible component

now the collectible component if we just open that scene this is a type of area 2D so we can just check that item so we

created this area 2D and then attached a script and the collectible component has a class name called collectible component which then derives from our

area 2D I've then added an export variable for the collectible name so that every time we add this collectible component to a different type of

collectible we can just modify that collectible name and this makes this component reusable then in the ND I've

connected the body entered signal and I check if the body which collides is the player and then I do a print statement

just for some debugging and then we can free this item from our game let me just modify this print statement because we're going to do some more Collectibles when the play you collects them we just

want to see which ones have been picked up so we can just say collected and then collectible name then head back to the egg scene and let's just save that scene

so go to scenes folder objects and then just save it as egg scene let's go back to the 2D View and then click collectible component ADD child and look

for Collision shape 2D then for the shape let's just choose the circle shape and then just reduce the size so that it covers our Sprite then back on collectible components let's just call

this egg then go to scenes folder test scene let's create a test scene for our Collectibles let's choose the test scene player right click and duplicate and

call this test scene Collectibles and just duplicate that scene let's open the scene and then zoom in let's go to our

objects folder let's first drop the egg onto the scene then go to rocks because we created in a previous tutorial our Stone collectible so as you can see it's

set up in exactly the same way as the egg collectible except we assign the name stone for the stone collectible and if we just look in our trees folder

we've done the same for log and that collectible is called log so let's go to our test scene again and just drop these Collectibles onto our scene so we've got

our log and then our Stone let's just rename this test scene here and call that test scene Collectibles and just save the scene now let's run our current

scene and then let's just check the output here so let's just pick up the egg so we say collected egg log and stone let's create another collectible

for milk so go to scene new scene other node search for sprite 2D create that F2 and rename this to milk and in the

texture let's just go back to our game and objects and drag in the simple milk and grass item let's just zoom in on this now for this Sprite we only want

this item here so let's just pull this up and because this item is the second frame so frame 0 1 and two we need to set the frame here however the first

thing is to say how many horizontal frames do we have so we've got four then in the frame option choose two and this will then set our Sprite now we can add

our reusable components so go back to components folder and then drag the collectible component onto our milk Sprite for the collectible name let's

just set this to be milk and then add a child node and search for a collision 2D then for the Collision shape 2D for the shape let's just choose a circle shape

and then just resize that we can now save that scene and we want to save the scene in the scenes and objects folder so click save head back over to the test

scene and in the objects folder under scenes let's just drag our milk onto our scene then we can test the scene again let's just look at the output again so

let's go to the milk item first so we've got milk egg log and stone so for the Corn Harvest collectible go to scene new scene other

node search for sprite 2D and rename this to Corn Harvest and go to objects under game folder and then choose basic

plants and if we zoom in we want to choose this Sprite here so for our horizontal frames we have six frames so

choose six and for the vertical frames there is two then we can just move the frames until we get our Corn Harvest frame then

head back over to components and attach the collectible component and for the collectible name we'll call this coin and right click and add another child

node and search for Collision shape 2D click create and for the shape we'll choose new circle shape and just resize this then let's save our scene and in

the scenes and objects folder right click choose new folder and call this plants then save the scene as Cor harv and then for our final collectible let's

go to scene new scene other node search for sprite 2D create that and then F2 and call this tomato Harvest then in

texture go to assets game objects and then choose basic plants and let's just zoom in on our Sprite let's go to the horizontal frames and let's just set

this to six and then the vertical frames is just two and then let's just increment frame until we find the [Music]

tomato and that now sets up our Sprite then on the Tomato Harvest let's go to components and then drag over the collectible components and then for the collectible name let's just call this

tomato then right click and add a child and search for a collision shape 2D and for the shape choose circle shape and just resize that now let's save the

scene and we'll save it in the same folder as Corn Harvest so under scenes objects and plants and save that scene let's head back over to the test scene Collectibles and go to the scenes folder

under objects and plants and let's add the Corn Harvest collectible and the Tomato collectible then let's run and test the

scene now as you can see as we move to the egg we have wi sort enabled on our player so the the player is sitting behind the collectible so let's first just collect these make sure that we've

got everything correct so he've got egg Stone tomato corn and milk and let's fix that wire sorting in a previous tutorial

I have explained y sorting in detail so you may wish to view that from the playlist however I'm going to go through and let's adjust the Y sorting on our

Collectibles to fix this issue so to fix the wi sort issue let's just look at our test scene I would just organize these

then let's open first the egg scene and scroll down on the Sprite node until you see ordering and just turn on why sort

enabled and save that scene then open the log and on the Sprite 2D again go back down into ordering and turn on wi

sort then Stone scroll down and make sure W enabled is on back to test SE open up the milk scene ordering turn on

sort enabled back to test scene then to Corn Harvest click Sprite 2D ordering turn on wi sort and then finally for the

Tomato Harvest let's just open that scene too and let's just enable y sort on this so once you've Ena wi sort on all of the Collectibles what we then

need to make sure we have is the parent node must also be WI sortable as well and to check the player the player is also y sort enabled and the Zed index is

the same for everything so let's just go to test scene Collectibles and enable why sort on that parent node now let's test the scene and let's just move

towards the egg and as you can see the player is now in front of the Collectibles and that's the desired effect that we need so that completes everything for the Collectibles now that

brings us to the end of this tutorial on how to create many different Collectibles and use reusable components in the next tutorial I'm going to show you how to create an inventory panel and

when you collect the Collectibles we will then update the [Music] inventory I will show you how to create this inventory panel UI complete with

theming and styling an inventory manager will manage the collectibles which have been picked up by the player and then displayed in the inventory items Now to

create the inventory panel go to scene new scene choose other node and search for a panel container and create that and we'll just rename this to be

inventory panel and let's just save that scene to go to scenes the UI folder and we'll save it as the inventory panel select the node and in the

inspection so let's just scroll down to theme click on empty and then just choose quick load and choose the game UI theme which we covered in a previous

tutorial open that select the theme file and we still have our Darkwood panel so in the type variation for the inventory

panel as you can see we have a base type of panel container in the type variation click the edit button here and type dark

w panel and then just select the tick box on the inventory panel let's go add child search for margin container and then add child again and search for vbox

container and to create the inventory items let's add another child search for a panel container again and then rename this to logs then click back onto

inventory panel and in our theme let's add a new item write the word inventory item panel and just click add type to

add a custom type and then in this option here let's just add a base type and the base type will be our panel container then let's just choose this

option here and then we'll add a new style so click on empty and choose new style box texture and then click it to activate the stylebox texture then on

our texture property choose new Atlas texture and then just activate that and then go to game UI and then just drag

the basic UI Sprites into our out seure and scroll down to edit region and then choose Auto slice and then zoom in and

select this option here click close then edit sub region and just choose pixel snap and then just drag the bars in and then click close And then once we've set

up the texture click back on log and then scroll down and for the type variation just click edit and write inventory item panel and then just click

tick and as you can see it's just starting to apply the panel here so click on logs ADD child node and search for texture rep then for our texture

here choose new Atlas texture and open that and then go to assets game and objects and bring over the basic tools

and materials right open that and then choose edit region and then choose grid snap and choose this log item here just

draw the grid square and then click close And that will create us our log icon then add another child node and search for a label and rename this as

log label and just pop a zero in the text field now we need to fit the icon and label in this panel space so click

on logs and for custom minimum size let's give a width of 26 and a height of 32 now we need to position the icon so

that it's at the top of the panel so click texture and choose Center and then choose vertical alignment shink begin

and that will just reposition that icon then for log label we want horizontal alignment center and then vertical alignment bottom the next step is to

configure a font so that it renders better under the icon and is more pixelated for this game so head over to the assets folder and in the UI folder

create a new folder called fonts and now we will download a font which is more pixelated and will render better for our inventory counter so head over to damang

g.com and download the ZX P font you can do that by just clicking this down downlo link here and I will leave the link for this font in the description

below once you have downloaded and unzipped the ZX P file go into the folder and then into PC folder and then

take the ZX p. ttf file then drag that into the fonts folder which we have created under our assets folder I'm just going to rename this file so that it's

organized in our project I'm just going to say lowercase z x _ P then I'm going to right click and add a new resource

then search for font and what we want to create is a font variation so create that font variation file and we'll call

this ZX p and leave variation on the end so just save that then open this file and drag in the original ttf file so

drag the ZX P file over into the base font here so the font VAR a resource will allow us to make some slight

modifications to our original font so we are going to use that for our label and then I'll come back to this resource and make some slight changes so let's click

back on the inventory panel click game UI theme and then in the theme let's add another item type type inventory label

and then just click add type on this option here let's just choose label as our base type and set that then choose this

option and then click add here to override our font file then choose the ZX P variation and drag that into our

font file here then on the option next to this we want to just reduce this to eight but first let's just go back to log label here scroll down and in tyght

variation click the edit button and then type inventory label which is that item type which we've just created in our theme click the tip box and as you can

see this is now updated to reflect that new font file go back to the inventory panel and the font is currently at 16 and then let's just modify the font size

so choose that option to edit the font and then just reduce this down to eight so as you can see eight has better

clarity if we go to 10 it starts to look blurred so we go 8 16 then 24 so it's in multiples of eight and the pixel font

has been designed to be an 8 by8 pixel font so what we're going to do is just use the size for 8 pixels now that we have set up the inventory label style

let's just click back on log label and let's just test a few numbers so we'll try 100 and as you can see that now

makes our item panel stretch so let's go back to our ZX PM variation and let's make some modifications to our base font

so for extra spacing in the glyph we can reduce that and bring in those values so I'm going to put that at minus three and

then i' like the text to sit actually in this red box or bring it up a little so in the top let's just increase that and

we'll leave it at Value two so as you can see the variation font resource allows us just to make those little tweaks that we need to make for our font

and that can be really useful let's now just adjust the margin container so that we have a nicer border around our inventory item so click on margin container and the default margin will be

set to 10 because that's already on our theme but we don't want to modify it there let's just do it on the theme overrides here so let's just turn on

margin left top right and bottom and then just set the value four for each of those fields C back on log label and

let's just reset this to zero and now we can begin duplicating this panel item so right click on logs and click duplicate

and rename this to Stone then rename the label to Stone label and then for texture re let's just reset that click

empty new Atlas texure and open it then go to game under assets objects and bring over basic tools and materials

click edit region and then with grid snap already selected just draw a grid around the stor item and then click

close And then save the scene so click Stone and then duplicate that scene let's Ren name it to Corn let's rename

the stone label to Corn label and on texture rect let's reset that new Atlas texture and then for the atlas texture

go to assets game objects and bring over the basic plants then edit region and for grid snap selected let's then just

choose this coin icon here let's close that then for the Tomato let's just duplicate that again rename this to

tomato and then the corn label to Tomato label then choose texture R reset the texture choose new Atlas texture and

then bring over the basic plants from the game objects folder under assets just set that onto the atlas property edit region again and then choose the

Tomato here under using grid snap mode pause that so just bring this up a little and duplicate the Tomato scene rame this to egg and for tomato label

we'll rename this as egg label prot texture rect reset that choose new Atlas texture and then for the atlas texture just bring over the egg item and for the

final inventory item choose egg duplicate the scene and rename this to milk then for egg label we'll call this

milk label choose texture re reset the atlas texture choose new Atlas texture again open that and then bring simple milk and grass item into the atlas

property here choose edit region and using grid snap choose this Sprite here and click close And then just save the scene so now that we have completed our

inventory panel UI let's head over to our game screen open up the game screen and then drag the inventory panel into

the game screen then to position the panel choose anchor preset and then Center left we can now create an inventory manager so that when the

player collects the Collectibles we can then update our inventory items on this value here so first let's head over back

to scenes then to the test scene folder and duplicate the test scene Collectibles scene so duplicate that and we'll call it inventory management and

just duplicate that scene and before we open the test scene I'm just going to move the inventory panel inside the margin container so now we've got the

correct margin around the panel but now we need to adjust the positioning of the panel so for horizontal alignment choose this option here for shrink begin and

then we need to vertically align the panel as well and that will just fix the layout now head back over to the test scene folder and open up the inventory

manager test scene let's just rename this scene here and call that test scene Inventory management then go to the UI folder and just drag on the game screen

then go to the scripts folder and in globals right click create a new script and call this inventory manager to

create that script open the script and then in Project settings go to globals and then open up that Global script so

just add the invent rate manager open that and then just add that as a global script and then close the window and in the script let's create a new variable

and call this inventory which is a type of dictionary and then we can just instantiate the dictionary then create a new signal and call this inventory

changed then add a function called add collectible and pass in collectible name which is a type of string and we'll

return a void then we can say inventory do get or ADD and then pass in the collectible name so what we are doing is

adding the collectible name to our inventory dictionary then we can say if inventory collectible name equals n then

inventory collectible name equals one so if we have nothing in the inventory which matches our collectible name then we're going to instantiate the item and

then just add the value one and we say else inventory collec name plus equals 1 so then we're going to keep incrementing

that value once we already have something in the inventory with our collectible name in it and then after that we can call our signal now let's

start to add our Collectibles to the inventory so go back over to components and we've got a reusable component for the collectible item so open up the

collectible component and then in the UN bodybody entered method what we want to do is call our inventory manager and call add collectible then we can pass in

the collectible name so before we test the scene just go back to scripts and globals and open up the inventory manager and put a break point here where

inventory. getet or add then let's head

inventory. getet or add then let's head over to the test scene and let's just run our test scene now we can get the player to pick up one of the items so

we'll just pick up this Stone here and as you can see the break point now gets called in our inventory manager script so first let's just check and hover over

our inventory so at the moment there is nothing in the inventory so let's just add our collectible name which is Stone and as you can see Stone has null for

the counter so let's just check what happens here so if we're checking for null then what we want to do is add one to the Collectibles so inventory now has

stor and has a value of one so this is working as expected so let's just stop that and now this method is being called let's link up our signal here to go back

to the inventory panel and for our inventory panel UI scene choose the inventory panel and attach script we can save the inventory panel script under

cingi and click create and let's first override the ready function so go ready void and then get our inventory manager

then connect the inventory change signal and call this on inventory changed let's create another function on inventory changed and we'll return avoid and when

the inventory changes let's then get the dictionary from the inventory and then check if we've got any items in there so the first thing we'll do is check for

logs so just open up the logs panel choose log label and hold control and then just drag the log panel into your script so that we get an unready

variable then in on inventory changed we can say V inventory dictionary equals our inventory manager do inventory then once we get the inventory from our

inventory manager we can say if inventory do has and then we look for that collectible name and if we have a

log in the inventory then we just need to say log label. text equals string inventory and then the array item from

the dictionary which will get the value and just pass in log so before we finish this function let's just test picking up

multiple logs so go to test scene objects trees and then the log scene We'll add two more of these items to our SC

then let's run the scene and then we'll move the player and as you can see we've just incremented that value that's the first scene and first collectible that's been

added to the inventory let's just check if this now increases to two and that increases to two and then three but now if I pick up the egg we haven't completed the code for that method so

let's just close the window and finish the rest of that method so head back to inventory panel and then the inventory panel script and I'll just finish off this [Music]

method so I have now added the rest of the labels from the inventory panel so we have log Stone corn tomato egg and

milk and in the inventory change function we now check the inventory for each of those items and that just completes the rest of that method we can

now test the scene and test each of those Collectibles so just run the test scene and now we go to egg so we have

one item here milk one item corn is one item tomato and stone and our three logs let's close that window and that brings

us to the end of this tutorial on how to create an inventory panel you I and then allow your player to pick up Collectibles which are then added to your

[Music] inventory I will show you how to create a day and night effect for your game complete with a Time manager and a UI

for the player to interact with so let's start by creating a new day and night UI panel so we'll go scene new scene and then choose the user

interface option and then just press F2 to rename that and we'll call it day and night panel and then let's save that scene so go to scenes and in the UI

folder we'll just save the panel here click save and then on the date and night panel scroll down and on the theme option here just go and click load and

then load the game youi theme resource click open and then just hop over to our 2D view then in the the theme option just click to open the

theme and then let's add a new style type so we'll click the plus button here and call this day and night counter panel and click add type and then we'll

choose this option here and then just change the base type and then search for panel container and then set that base type now that we've set our theme on the root node let's add another child node

and search for panel container choose this option and then and click create and then in the panel container just scroll down and for type variation let's

just set that so click the edit button here and type day and night counter panel and that will set the style and click the take then let's head back to

the theme by clicking the root node and then choose the theme option here then what we want to do is to update the panel and then for the panel option

click the plus button and then click empty and we want a new dibox texture and click that and then for the texture say new Atlas texture and then open that

resource then go to the game assets folder and in the UI folder bring over the basic UI Sprites and just drop that into the atlas property and then click

edit region and zoom in on the asset and we want to take this selection here let's just choose pixel snap and just

draw a box around this asset here so we just want this top half here and then click close we'll just close the atlas texture down and then we have another

edit region under sub region so just click edit that region and then with pixel snap selected just bring in these bars here and as you can see it starts

to update our UI control to bring the next bar in until we frame our panel and then click close we just zoom in we can now see we've got our panel here so for

panel container let's just rename that panel and call it day panel and then let's add another child node and search for margin container add another child

node and search for label in the label just type day Zero for now and this just puts in some text for us for the meantime now let's just adjust the

margin container a little bit more because it's taking the 10 pixels automatically from our theme which we've defined earlier here so back on margin

container let's override those margins so we say margin left top right and bottom and then set three pixels for each this just improves the margin

around our text for this particular panel let's just head back to the theme and let's now style our label so click the plus button here to add a new style

type and we'll call this day and night label for the base type let's just click the plus button again and choose label as our base Bas type and then just set

that base type then click the option here for our fonts file and then let's add a different font so let's just override that item and then let's set

the font file here so if you go back to our game folder under assets and then just into the UI folder we've already

set some fonts in there so now let's add a new font so head back over to the Sprout lands UI pack and in the basic pack there is a font folder which

contains a pixel font in there so we're going to use this font for our day and night label so just click and drag that over and I'll be leaving the link in the

description for the UI pack once we have the font we can then drag and drop that into our font on our theme so just click and drag the font

into our theme here and then click back on label and just scroll down until you get to theme and for the theme variation let's just edit that and type

day and night label and let's just accept that so as you can see the font has now been updated on our label let's just make an adjustment to our font size

so just click back on the roots n and then get to the theme and choose this option with our day and night label chosen here and then just change the

font size so let's just click the plus button and then just let's up the font size until we get better Clarity so if we keep going further you'll see that it

goes blurred and this is because the font has a specific size now let's just adjust the size of the day panel scroll down till we get to transform and size

and just change the Y to 26 and this will just adjust it to make it fit a little bit better with our te then click the day panel and let's just duplicate

this panel F2 and rename this to be time panel then click the down arrow key just to adjust the new position of our time panel then in the label just write a

time in there so we'll use 12:00 and then let's adjust the width of the panel as well so let's just go back to day panel and let's make the size on our

xais data and we'll do the same for our time panel as well then let's align the text in our label so click label and

then just click print center and then just do vertical Center as well and then for the label in the time panel let's just do the same so we'll just click this option here and then horizontal

alignment shrink Center and vertical alignment shrink Center as well we are going to add three buttons to our day and night panel which will allow the

player to artificially speed up the time so we'll add a normal speed a faster speed and the cheater speed so click on the day and night panel and add a child

node and search for control and add a control node add another child node and search for button and add a button node let's just rename the button node and

call this normal speed button then click on the control and let's just reposition this control so under transform position and Y let's just click in there and then

just modify this so I'm just using the arrow key to move that down and just going to position the button underneath the time panel then let's go to our theme and let's just add a new style

type in our theme so click the plus button and call this day and night button and just add this new type and then just click this option here to set

the base type and search for a button and then just set that base type so before we sty the button let's just now go back to the normal speed button

option here and scroll down until we get to our theme and then type variation just let's edit that and let's just write there and night button and that's

the style and just accept that then head back to the theme and choose the styes option and then scroll down to the normal style and click the plus button

and click empty and choose new style box texture click on the style box secture and in the texture let's create a new Atlas secture and open that and then

back in the assets and UI folder let's bring over the basic UI Sprites and just open that and then when we get to region

choose edit region assume alt and we are going to choose this section of Sprites here so choose Auto slice and pick this

option here and choose clause and scroll up and just collapse the atlas texture and scroll back down to sub region and choose edit region let's just scroll in

and then change snap mode back to pixel snap and just bring in the bars to frame the button once the button is framed then just

click close And as you can see we now have the button style here now click the button and let's just resize this button

so if we go to the transform and size for X use the value 26 and for y use the value 18 then click back on our theme

and let's now style the other properties here so for normal right click the stylebox texture and click copy here and

then paste this into the hover style so just click the plus button to enable hover style but right click and paste then right click again and make unique

recursive and with all the options selected click Okay now click the style box texture and this will create new instances of all of our textures so open

up the atlas texture and in edit region let's zoom out and for SNAP mode choose Auto slice and then choose this option here and

click close then scroll down to sub region and as you can see this is already now set up for us so we can just click close on that go back to our style

and just right click and copy the H style then scroll down to press and just activate that and then just right click

and paste that style in but right click again and also make that unique and click okay then activate the style so we load it here and then open the atlas

texture and choose edit region again and scroll out and with auto slice still selected just choose this option here and click close And then we can just

collapse the atlas texture then copy the Press style then find the focus option and then just let's add and override the

option right click on empty paste right click again and choose make unique and click okay for that then activate the

focus Style Open The Atlas texture scroll back down to region once more and then zoom in and choose the same ti so focused and pressed will use the same

thing so we can actually just say close as it's already selected and for the final property right click Focus copy the the style and for disabled let's

activate that right click the empty option paste right click again and make that unique and then click okay let's open that style activate the atlas

texture and then go to edit region scroll out and we'll choose this option here so with auto slice already selected just choose that tile here and click

close And that will set up the disabled style so for buttons it's always good practice to create styles for pressed normal hover focus and disabled so now

let's test this panel Ur So with the day and night panel selected just click run Curren scene to test it and we've got the day panel time panel and let's just

check that our button is activated so I can see the hover State and then let's click it and it highlights so I'm holding the mouse button down and that's pressed and then when I move the mouse

away I still got my forus style which is the same as pressed now let's overlay a texture on this button so click normal speed button

and add a child and search for texture R and then in the texture choose new Atlas texture and open that and then bring over the basic UI Sprites from our

assets and UI folder and just drop that into the atlas then edit region and zoom out and with auto slice selected choose this Sprite here and just click close

And now let's resize the texture so click texture W scroll down and in size for X 27 and for y choose 12 let's just

zoom in and then in the anchor preset choose the center option now the normal speed button is complete so let's just duplicate that button and rename it the

fast speed button then on the fast speed button let's scroll down the transform and in the X position let's just reposition that button

and we'll leave the value at 27 then for texture the x is 9.5 so let's just change that to an integer value of 10 and then let's just go to texture rect

back on the normal speed button and just check that so we'll just make that 10 as well then for texture re here let's just duplicate that and then let's reposition

the arrow so just scroll down on texture Rec two and in the X position let's just reposition that and then click on text direct and just

reposition that as well so that then centers those icons for us then click the fast speed button and duplicate this button again let's rename it and call it

cheetah speed button and let's then duplicate texture two and let's adjust the position on that so texture two

let's just scroll down until we get to our transform and in position let's just move that down a little texture R let's just increase

that and then keep increasing the positions until we get them relatively Center then once you've centered and adjusted the positions of the textures

what we need to do is then just reposition the button so click back on the cheeter speed button go back to transform and in position let's just move

that now click on the control which contains the buttons and just resize this so let's just increase the X

parameter until we get to 80 and then reduce this down and that will just wrap our buttons this now completes the UI for the day and night cycle so let's now

create a test scene so that we can then add this UI to to our game screen so head over to the scenes folder and in test folder let's create a copy of our

game screen test scene so right click duplicate and call this day and night cycle and just click duplicate for that let's open that test scene and then

let's just rename the scene here and call it test scene day and night cycle and now we can add the day and night panel to our game screen so just open the scene and then just go to scenes and

UI for folder and then just drag the day night panel into the margin container so we just need to reposition this so let's just go to the Anchor Point and choose

horizontal shrink end and vertical shrink begin now let's just zoom in on our U and as you can see the panel is just cut off from the right hand side of

the viewport so let's just head back over to the day and night panel and then just click the root node and just make sure the an Anor point is the top left

so that we have this anchor points here then click on the day panel and go to position and on the X AIS let's just

reduce the position so that it moves into the negative X AIS and we'll do that at minus 80 so we'll just zoom in

and we just line up this pixel line here and do the same for the time panel so position on the X AIS will be minus 80 and then for the control option here

which contains the buttons let's just go to the transform and for xais do minus 80 on here so we've just set that let's save that and then go back to game

screen and you can see now that the day and night panel is correctly positioned and the Anchor Point is in the right place then head over to test scene day

and night cycle and we'll have our panel here so let's just run the test scene and this has now set up our UI correctly here we now ready to create a global script with the day and night cycle

manager to go to scripts and globals right click and create a new script and call this day and night cycle manager and click create open the script and

then go to Project settings and under globals let's just add that Global script open the scripts folder in globals and then choose day and night

cycle manager and open that and and then add that script and just close that and in our script let's begin creating some constant variables so say minutes per

day which is an integer value say 24 multiplied by 60 do another constant variable minutes per hour type of integer and equals

60 WR another constant variable which is game minute duration which is a type of float equals to and that is short for

two multiply by pi divided by minutes per day then we'll do some default parameters so we'll have a v game speed which is also floats and we'll just set

that to five and say our initial day which is a type of integer and set that to one and variable initial hour integer equals 12 variable initial minutes

integer equals 30 we will lack another variable called time which is float we'll just set that to zero and another variable current minute which is an

integer and set that to minus one or our current there which is an integer and set that to zero then we'll create some signals so we'll say signal game time

and then passing time our next signal is called time tick and we'll pass in day which is in hour which is integer and

the minute as well and for another signal we'll call it time tick there and pass in dat as well and create a

function call set initial time and return void and save all initial total minutes equals initial day multi by

minutes per day plus initial hour multili by minutes per hour plus initial minutes and that will set up the initial

total minutes now let's calculate the initial time so say time equals initial total minutes multip by the constant game minute

duration then just above this method write function and override the ready method and then just call set initial

time then override the process method so function process then say time plus equals Delta multili by game speed

multiplied by game minute duration then let's get our signal game time and emit time and then we can subscribe to this signal then in our process method we

need to recalculate the time so create a new function and call this recalculate time and say for total minutes which is

int equals integer time divided by game minute duration then for current day minutes which is an integer say total

minut modulus minutes per day and for our integer current day minutes divided by minutes per hour and for minute which is type

integer current day minutes modulus minutes per hour now that we are recalculating the time we can now emit

some of our helper signals we'll say if current minute is not equal to minute then current minute equals minute time

tick emit day hour and minute and say if current day is not equal to day and just modify this here then

current dare equals dare time tick dare do imit and then pass in Dare that finishes the recalculate time function so back in the process method let's just

call that method here now that our script is complete let's go back to the day and night panel and update the labels for our our day and our time here

let's just go back to the time panel and just reset the time for midnight and then for the day and night panel let's attach a script and we'll save that in

the CI folder so for the first label let label and just rename that and call it day label and for time label we'll just rename that as well so click and drag

the label and whole control and create an unready variable for the day label and do the same for the time label then override the ready function and let's get our day and night cycle

manager and connect the signal and we'll create a function called on time tick we'll say function on time tick and passing D which is an integer a which is

an integer and minute which is an integer as well and then just return void then get our day label and say text

equals day space plus and then use the string function and pass in our day then get the time label text equals open

quartz and use 02 D for the format percentage 0 to D and just add the percentage on the front of this so this

is a string form matter which will convert the integers to string and then use percentage and then pass in our two

variables then let's create some export variables so set export for normal speed which is an integer and set this to five

then I export for f speed which is an in and set this to 100 and then export for cheeter Speed and set this to 200 and

click on normal speed button in in node let's choose the Pressed signal and just connect that just click connect then say day and night cycle manager. game speed

equals normal speed then click the fast speed button choose the Press signal and connect that to click connect then copy this line and set this to fast speed and

for the cheater speed button choose press connect the signal click connect and copy this line once more so now that the script is complete

let's head over to test scene day and night cycle and just run the current scene as you can see the day and night cycle manager is now updated in the time

in the UI so let's just speed this up we're using the fast speed and the time is now incrementing and we should get a change in the day so we've just gone to

day two and then we can make this even faster so as you can see we've now linked up those buttons and with those export variables you can change those

speeds let's just close that our next stage is to create a day and night cycle component which will modulate the canvas to give a trans transition of color

between day and night so let's go to scene new scene choose other node and search for canvas modulate and just

create that rename the node to day night cycle component then save that component and place it into the scenes and components folder and we'll just call it

day night cycle component and save that so just go to the components folder then right click and attach script and just save the day night cycle GD script in

that same folder let's open the script and let's give this a class name so we're going to make a custom component for this and we'll derive from canvas modulate so we'll give the class name

day night cycle component then create an export variable called initial day which is a type int and a default value of one

now we're going to make this a Setter so call set and then I'll use initial dat and just show this to ID then say

Initial D equals and the value that's passed into the seter then I'll call the DAT and night cycle manager and set the initial day to the value passed into the

setter and I'll call the manager again and set initial time I'll do another export variable and call this initial hour and set the integer to 12 then set

and pass in the value i h for initial hour and say initial hour equals and then the value then I can say day and night cycle manager do initial hour

equals and the IH value then we can set the initial time then I'll exploit another variable which is initial minute

integer and default value of 30 then set and pass in the variable I am then say initial minute equals I and call the day

and night cycle manager set initial minute to IM and then call set initial time again then export another variable

and call this day night gradient texture and we'll use a gradient texture 1D then override the ready function and call D

night cycle manager. initial day equals the initial day then day and night cycle manager. initial hour equals initial

manager. initial hour equals initial hour day and night cycle manager again.

initial minutes equals initial minute then finally day and night cycle manager Dot and then set the initial time function then let's register to the game

time signal and just connect that and we'll call the function on game time let's create a new function we'll call it on Game Time passing time which is

float then we want a variable called sample value equals 0.5 multiplied by then say sin time

minus pi ultip by 0.5 + 1.0 then we want to set the color variable inside of the canvas modulate

so this is a property of this component so say color equals then get the day night gradient texture access the gradient property and then there's a

method on there to sample the gradient and pass in the sample value so the oname time function will'll use the time from the day and night cycle manager and

then use a sine wave function to oscillate the value between zero and one then the sample value will be used to sample the color from the gradient

texture which will give the effect of a day and night cycle so let's head back to the day night cycle component and in the day night gradient texture let's

just create a new gradient texture 1D and for now I'll just leave that to black and white go back to the test scene day and night cycle and then let's

add our day night cycle component to our test scene so we'll just drag that component onto our scene let's go to the 2D View and then

let's test the scene let's just speed it up and as you can see the time is affecting the gradient and we are getting a day and night cycle so let's

just stop that so go back to the day and night cycle component and modify the gradients here so open up the day and night gradient texture then just put a

color marker here and we'll set that to White so we'll say this is the night and this is our day so if we adjust this more to the left we'll get less of

nighttime so I'm just going to put it roughly about here and then I'm going to go and select some colors I've finished adding the colors and you can modify them let's go back to the

test scene and then let's just run the test scene again and let's just speed it up and as you can see as we get later in the night we've gone to nighttime then back in the morning and we've got Dawn

we'll just slow it down roughly in the night so as you can see it's darker and then it's coming back into Dawn and we can just close that so back in the day

and night cycle component you can make adjustments to the color bars to get the desired effects for the time of day and one last thing to test on the day night

cycle component is let's just modify the day so we'll set this to 6 the initial hour to be 2:00 p.m. in the afternoon and then 18 minutes past the hour let's

go back to the test scene and then let's run that and as you can see we have changed the day and we've got different time as well so you can customize this

for your game and that brings us to the end of this tutorial on how to create a day and night effect for your [Music]

game I will show you how to create crops and grow them using the day and night cycle as each day passes the crop will grow and then you'll be able to harvest them so let's begin by creating our

first crop scene so go to scene new scene and add a 2D scene then rename this to coin then add a child and search

for sprite 2D then head over to our assets folder and in the game and objects folder we want the basic plant so we just double click that and we're

going to use these crop assets here so back on Sprite 2D just drag the basic plant into here and then just zoom in

onto our Sprite and then for horizontal frames set six and for vertical frames set two then for frame just increment this value to one then head over to the

scenes and components folder and grab the H component and just drag that onto our corn scene then for the option on

the tool choose water crops then add a child node and search for Collision shape 2D in the the shape choose rectangle shape and then we'll zoom in

on the Sprite and just make an adjustment on here and that will set the Collision area so we are using the hurt component to receive the hit from the

player tool and by setting the water crops tool when the player goes to water the crop we can receive that event and then start to process the growth cycle

so back on corn say add child and search for GPU particles to and rename this the watering particles

I'll just move the particles to here and in the inspector under process material let's create a new particle process material then open the material then

scroll down to angle and for the minimum value CH minus 180 and then the max value 180 then for angular velocity is

minus 300 for the minimum value and then for the maximum value 300 then for orbital velocity we'll have

minus1 and one and in accelerations let's have minus 10 on the Y AIS so that the particles are moving

upwards and then we've added some angular velocity so that the particles turn and spin then scroll down to color and let's just modify

this and just choose blue color just for the water then scroll back up to the process material particle let's just close that and then in the amount property let's

increase that to 16 then click on the Sprite and let's just move the position of this Sprite so scroll down to transform position and on

the Y AIS let's just increase that and position that here and then do the same for the h component so we'll just go back to transform position Y and just

move that as well so now save the scene and go to the scenes folder objects plants and save the scene as coin then click the water ring particles and drag

that into the scenes objects and plants folder and save the watering particles as a component in there then just delete it from the scene and then just reab up

and then just save the scene again then go to cor again ADD child node and search for GPU particles and then create

another particles child nod then rename this nod flowering particles and then just drag that above the hurt component and to view the particles better just

turn off the hurt component for now just so we can see the colors a little bit better then click on flowering particles and then in processed material let's

create a new material and choose new process material here and then just open that let's also just turn off the watering particles so we're just

focusing now on our flowering particles then scroll down to angular velocity and

choose - 180 by 180 orbital velocity is min -1 and 1 in gravity for the Y choose Min - 100

and for color we'll just keep this white for now let's just scroll up and just collapse the particle process material and in lifetime change this to

0.6 we just move this into a better position for viewing and speed scale will change to 0.4 explosiveness to 0.5

and Randomness to 0.5 then reduce the amount of particles to six now that we finish the flowering particles let's also just drag that into our scene

objects and plants folder and then save the scene in there just delete the flowering particles from the scene and then just drag it back on to the corn

scene and just reposition it now we can turn back on the watering particles and the H component now let's create a test scene for our crops go to scene and test

folder and make a copy of the test scene day and night cycle so let's just duplicate that and we'll call it the scene drops and just duplicate then open

the scene and the day and night cycle component let's just disable that for now zoom in on the scene and then go to objects and plants and just drag the

corn item onto our scene then let's just run the current scene and that just tests our scene item there so we can just close that then head back to coin

and we'll create a growth cycle component which will manage transitioning the Sprite and manage the growth of the crop so we'll go scene new

scene other node and just choose node and create and just rename this to grow cycle component and then save the grow

cycle component into the objects and plants folder then let's attach a script and you can save that also in that folder too and in the grow cycle script

type class name grow cycle component add an export variable our current grow state which will be a new data type so

let's create that data type first so head over to scripts and globals and then just open the data type script and in this script let's create a new enom

called growth States the first enom is seed and germination vegetative reproduction maturity and harvesting now

the reason why I've chosen these enums is if we go back to the objects folder in the asset and just open the basic plants if we just scroll in on the asset

each enumeration will match the Sprite frame so we've got seed germination vegetative reproduction maturity and

then the Harvest at the end now let's head back over to the growth cycle component and inside the script we can now say current growth state is of type

data types do growth States equals data types do growth States and then we'll use seed as a default value for the next

parameter use export range with a value of between five and 365 for the days and use variable days until Harvest and use a default value of seven then we'll

create some signals so we'll have a signal for crop maturity and a signal for crop harvesting then some more

parameters so far is watered which is a typ bol a variable for starting day type int and another for current day which is

also type in then let's override the ready function and let's get the day and night cycle manager and then get the

signal time to tick day and then connect that signal let's create another function called on time tick day passing

the day and return void and then say if is watered then if our starting day is equal to zero and set the starting day

to the day that's being passed by the signal then let's create another function and call this growth States and pass in the starting day which which is

an INT and current day which is also an INT if current Gross State equals our

data types do growth states do maturity then return so what we're doing here is when the growth states are being Traverse once we get to the maturity

State we just want to come back out of this method then variable number of state and just set this to five then

variable growth there's PA equals current day minus the starting day modulus number of states so if we go

back to the data types the number of states are these so that's 1 2 3 4 and five go back to growth cycle component

script then create another variable State index and say growth days past modulus number of states plus one then

set current growth State equals the state index so the current growth state is of type data types Gross State and

the index value will set at enom value then let's get the current Gross State from the data types keys and just print

that as a debug statement and we can say current grow state is name and then State index and pass in that state index

as well then say if current grow State equals data types grow States and maturity then call the crop maturity

signal and emit that that completes the growth States function so just scroll back up to on time tick day and let's

just add this method and then just pass in starting day and there then let's scroll back down and add another method and we'll call this function harest

State and then just PA in again the starting day and current day so we'll just do that and then say if current growth State equals data types growth

States and harvesting then return from this method and say for days past equals current day minus the starting day and

modulus days until Harvest which we've defined in our export rate range then say if days past equals days until

Harvest minus one then current Gross State equals data types. grow states.

harvesting then we can call the cropped harvesting signal and emit that then we can go back to the on time tick day method and after the growth States

method just call the Harvest St method and pass in starting day and day let's scroll back down we've got one more method to complete to create a new

function called get current growth state but return from this function a growth States from the data type so we will

return the current growth State and this is what we set in our growth States method so that completes the growth cycle component script and then head

back over to the coin scene and in the scene objects and plants folder just add the growth cycle component to this scene and I'll just position that above the H

component now click on the coin scene right click and attach a script and we'll keep it named as coin and just create that in the objects and plants

folder and the first variable will be V corn harvesting equals and then preload the Corn Harvest scene here and we've created this Corn Harvest scene as a

collectible in a previous tutorial then select Sprite 2D and just drag that into our script and then hold control to create the unready

variable and do the same for watering particles lowering particles the growth cycle components and our H component

then create another variable called growth state which is type growth State and then just set the default value to be growth States seed then override the

ready function and then just say watering particles emitting equals FAL flowering particles emitting also equals

false then grab the H component and then connect the H signal so create the function on HT and inside that method we

can say if not gross cycle component is watered then watering particles emitting equals TR

then use an await and call get tree create a timer of 5 Seconds and then just register that timeout signal then

after the timer as itats we just want to then set the particles back to false to stop emitting and then for the growth cycle component just set is watered

equals true then back in the ready method get the growth cycle component and for crop maturity connect that signal and create a function called

onrop maturity so after the H method we can say onrop maturity get the flowering particles and just set emitting to true and this will just activate those

particles to show that the maturity has happened in the gross cycle then just scroll up and after the ready method let's override the process method and

let's get the growth State and grab the growth cycle component and get the current growth States from that component then get our Sprite 2D and set

the frame to be the growth State and say if growth State equals data types do grow states do maturity then grab our

flowering particles and set emitting to tr so now that we have completed the coin script I would just explain a little how the coin script the growth

cycle component work together so as you can see in the ready method we are registering to the Hur component signal

and the growth Cycles component signal when the player is using the watering can and approaches the crop as they water the crop the hurt component will

first be called in the unhe hurt component we then tell the growth cycle that the crop is currently watered and then then we emit watering particles so

we can show the player that the crop has been activated then in the growth cycle component the day and night cycle manager will always constantly be

communicating with the growth component to give it the current time of day when the crop is watered then the the growth

cycle component will start to go through the growth state so until the crop has been watered nothing will happen and as you can see we first go through the

growth State we calculate the growth dayses that have currently passed and then set the state index which we then get later to modify the frame on the

Sprite so the growth states have been separated from the last state which is the Harvest State because you can set a different number of days for the Harvest

State now the growth state is fixed because of the number of frames on the Sprite however the Harvest it can be several days later so I've separated

that to give a little bit of variation because you may have crops with different Harvest days then you get the current growth State here and that just

enables to update the frame I've just noticed that the current growth State on default is set to seed however that should be the first frame and we should

really set that to germination so just update that now let's test the scene again but first go to debug settings and just turn visible Collision shapes on

and then go to testing crops and then 2D and then just run this current scene and just click the watering can and just use the left Mouse button so at the moment

this white Collision shape is stationary so let's use the axe and we've only configured the hit part for the axe

so let's configure it for our watering C so let's head over to the player scene to go to scenes player open up the player scene here and then select The

Chopping State script and just scroll to the top so we'll need to take the hit component Collision shape let's copy this line here and then head to the

watering script and at the top just PA that in then back to chopping and just take the ready function as well and back

onto watering and scroll down and copy these lines here then back in the chopping scrap in the onexit method just copy that last

line there now that we've completed the script just select the watering State and assign the hit component Collision shape just choose this option here and

click okay okay then head over to test scene select 2D and just run the current scene choose the watering con and then just hit with the left Mouse button and

we can see now we've got that working we've got down up right and left and then let's go to the crop and as you can see that's now activated the water

particles let's just stop that let's turn off the visible Collision shapes and then let's run the scene again turn on the watering C and then let's water

the crops now let's speed this up so watering is now stopped and we are now transitioning through the days so we've gone to the next state and as you can

see in the output window we've got the germination retive reproduction and then the next state is maturity and we're now showing the flowering

particles and now the crop is in Harvest so we can pick up that collectible and as you can see the inventory panel has now been updated and we've collected the coin so just stop that now that we've

finished the coin scene let's just rename this scene here and call it test scene crops let save that and now let's

begin to do the same for our tomato scene to go scene new scene a new 2D scene and rename this to tomato and then

save that scene and just save it under scenes objects and plants and now I'm going to do the exact same thing as I've done for Corin so I will

speed up the development and then stop it at points where there will be slight [Music] differences so once you've set the

horizontal and vertical frames just increase this until we get to the seeds for the tomato

[Music] then set the water crops for the her component and then add child and attach

a collision shape and now that we've got the correct frame here just increment that one so we get the germination Sprite then for Collision shape create a

new rectangle collision and just reposition the [Music] Sprite then click on the Tomato node and attach a script and just save that

script in the objects and plants folder then head back over to the coin scene open up the coin script and then just copy everything from inside this script

go back to the Tomato script and paste that in then let's change the variable here to be tomato and then choose the Tomato Harvest scene then scroll down

and then change that and then just write tomato here and just paste it over the instance and that will complete the script for the Tomato so everything has

been reused here so I'm just going to head back over to the assets folder and in the objects folder just open up that basic plant Sprite and the frames will

got 0 1 2 3 4 5 6 and 7 so we need to make a slight modification to the Tomato script because the growth state will not

start at 1 2 three and four we need to add an offset for the Tomato Sprites so in the Tomato script add another

variable under the Gross State and call this start tomato frame offset and set this to six and then after growth state

in the process method just add the offset and that will finish the script head back over to the testing crops and then in the plants folder let's just

drag the Tomato onto our scene Let's test the scene let's turn on the watering can and let's just speed the time up first I will water the corn and

then I'll just wait for the first Sprite to appear and then let's water the tomatoes now we have the coin let's collect that and the inventory is

updated and then now let's collect the tomato and the tomato is updated also in the inventory let's close that so now that we've finished the corn and the

Tomato crop there is one fin thing to check because these are new scenes added to our game we need to just check that y sorting is correct and configured for

these two new scenes so we're not going to test this in this scene because this is just going to test the crops and the transition between the growth States

however let's go back to our test scenes folder and let's just open the test scenes Helm up layer for wi sorting and this is where we can test those scenes

so that we're only testing in wi sorting against all assets in the game and this is one of the benefits of having test scenes is that we are testing everything

in isolation so add a new child search for node 2D and just create that and just rename this to be crop then go to scenes objects plants folder and just

add crop to our scene so I've added the coin and then I'm just going to Nest that under the crops node and then I'll add another one and then let's add two

tomato scenes as well and this is as if we have just laid them out on top of the till dirt and we're going to cover that in the next tutorial however let's just

resolve any wire sorting issues and also on the test scene how M layer y sort go to the UI folder and just drag on the game screen and then we can interact

with the day and night cycle let's run the test scene let's choose the watering can and just water this crop here and then let's just speed up the

clock now let's just walk over the Sprite so as we go from the top down we're just walking straight over the coin so we do need to fix why sorting on

here so just stop the scene so head back over to the coin scene and for coin just scroll down and enable why s it save

that head back to the test scene tilemap layer i s it and just run that scene again let's just water the crop and then speed this

up and then let's see the effect of the player walking over the crop so we still have an issue with Y sword so just stop

that and make sure the parent y sort is already set for the scene so just scroll down that and then enable wire sorts on here and run the test scene again so

water the crop to speed it up let's see the effect again on the player and as you can see wi sorting is now starting to work let's see what it's

like here and as you can see when the Sprite is in germination it's slightly over the player so we need to just make another adjustment on the player for

while sorting to fix this we'll close that so open the player scene and if we just select animated Sprite 2D the

position of the wire sort is here and in the properties there is no wire s position not like you have in the towel

set so if we just go back to the basic grass biome things in our towel set and then just select the sunflower if you look at rendering there is a y sort

origin parameter now for Sprites this works slightly different so on animated Sprite 2D the Y sort position is here let's just go to the inspector and in

the offset let's make an adjustment I'll zoom in a little bit more and I'm going to adjust it so that it sits three pixels from the feet then in animated

Sprite 2D position let's just reposition the Sprite so that it sits back on the X AIS let's head back to the testing to map layer where I saw it and just run

that scene and then let's use the watering come and speed up the scene and now let's just walk over the Sprite so we can see that we've got an

improv movement there on our wi sort and it's also better for the germination Sprite as well let's just check our other Sprites so that's looking okay and

the flower and the mushrooms so the adjustment to the player offset position on the animated Sprite 2D has fixed that problem so we just probably need to

modify the small tree and the large tree I will make those adjustments and speed up the video close this [Music]

[Music]

[Music] then head back over to testing T up layer and just test this one more time I'm now happy with the adjustments there on the large and small tree and that's

fixed while sorting for our new prop assets so this is a benefit of those test scenes we've been able to make those those adjustments across all the assets without affecting any other

systems now that brings us to the end of this tutorial on how to grow crops using the day and night cycle in the next tutorial I will show you how to plant

the crops on the till dirt tow [Music] Mar I will show you how to use the players tools to create various crop

fields in your game you will then be able to plant different crop types and if you wish to remove the crop fields and plant them in other places so before

we begin just scroll down to the tow set's folder here and double click game to set and this will load up the tileset

here in this tab and in a previous tutorial we've loaded in the tilled dirt terrain however for our crop field I'm

going to use a different till Dirt Pile map because if we click on this one and just zoom in there's extra pixel SPAC in

between the edge and the actual till dirt so head over to the Sprout lands Sprite Basic Park and in the to sets

folder we want to choose the till dirt wide version two so back in assets game and T set just drag the till dirt wide

version two and drop that into that folder then let's rename the this and format it and I'll call it till dirt wide crop field now let's bring over the

crop field into our towel set and just click no here and as you can see the distance between the till dirt and the edge of the pixels is slightly smaller

then just drag the inspector up and just scroll down in our terrain set so we still got till dirt terrain here but I'll leave that in there for now anyway

and we'll just add another one and I'll call this till dirt terrain drop field and I'll just change this

color then let's set up these tiles so let's just activate these tiles here and then click the first tile here then choose select choose first tile and in

terrains choose terrain set zero and then terrain three so it's 0 1 two and three for the till dirt terrain crop

field then let's choose paint then choose terrain set zero and then till dirt terrain crop field and then let's just paint those

terrains so now the terrain has been painted let's just head over to scenes test and open up the testing tilemap

scene and select till dirt and then select inter terrain till dirt terrain crop field and then let's just paint that terrain to test

it and that's working okay so we can begin creating our crop field component so let's begin by creating another test scene go to scenes test and duplicate

the test scene crops scene just right click and click duplicate and we'll call this test scene crop Fields tilled dirt and just duplicate that let's open the

scene and let's just rename the scene here so that tesene crop feels till dirt as well and just save that then what we need to do is just to let the previous

coin into M or objects and just remove those and we can just say okay to that and then just save the scene again then in the test scene add another child node

search for node 2D and create that let's rename the node and call this crop Fields then open the game tilemap and add

a child no and search for tilemap layer and rename this to tilled soil then add another child node to the test scene and

search for node create and rename this the field cursor component then open the components folder under scenes and just

drag this component into there and then save that scene then right click attach a script and just save this as field cursor component so just create that

then let's just reposition our crop Fields Nord and just move that above the player and then do the same with the

field cursor component then in the field cursor component script let's call class name field cursor component let's add

some variables so we'll do an export variable for grass tilemap layer which is Type tilemap layer at export bar build

soil TI map layer which is for T map layer and this will be our T map layer grass and tilled soil here then export

another variable which is our terrain set and set this to a default value of zero then export another variable which is terrain type in with a default value

of one then create an unready variable which is our player and then use get tree get first Nord in group and then just use the string play

so let's open the player scene and on the player node go to the node option here and then let's add a new group let click the plus button here right player

and make this Global and then just click okay then head back over to the field cursor component script and let's add some more variables so variable Mouse

position which is Vector 2 for a cell position which is Vector 2 I then variable cell Source ID which is a type

in for local cell position which is type Vector 2 and for distance which is a fla let's override the unhandled input event

method and we'll say if event do is action pressed and then check for the hit so when the player uses the till tool this event will be called and we'll

check the tool manager so tool manager do selected tool if that is equal to to the till ground to then we'll call some

other methods so create another method called get cell under Mouse and then get the mouse position and then use grass T map layer and then the function get

local Mouse position then we'll set the cell position and then we'll get the grass T map layer and use the dot local tilemap function and pass in the mouse

position then we need to set the cell Source ID so with the grass t layer we'll call get cell Source ID and pass in the cell position then we'll set the

local cell position so using the grass tilemap layer use map to local function and again pass in the cell position then we'll set the distance and we'll get the

player and on global position use the distance to function and use the local cell position then once we' set these variables let's call another function to

to connect the terrain and call this ad tilled soil cell and we'll say if distance is less than 20 pixels and the

cell Source ID is not equal to minus1 then get the tilled soil T up layer and then set cells terrain connect and open

square brackets and pass in the cell position then the second variable is terrain set the third variable is

terrain and the fourth variable is true and then back in the unhandled input method just call the ad tiled soil cell underneath get cell under Mouse so for

debugging I'm going to print some of these statements so we'll print the mouse position the cell position and cell Source ID and then after that let's

also print the distance so let's now connect the export variable so click field cursor component and go back to the inspector and we need to set the

grass tilemap layer so we'll just click a sign and choose grass here and then choose the tilled soil layer

here and then for terrain set this is zero and the terrain is set to one so let's just open our towel set and then

click the tilled soil and just open the game tileset resource and just scroll down so the terrain set zero has four

terrains in it that's 0 1 2 and three so we are currently targeting the till dirt terrain which I added in an earlier

tutorial so what I'm going to do I'll will leave it on there for now and as you can see there is a gap between the edge and the pixels as I mentioned

earlier so head back to the field cursor component and just leave these values and let's test the scene so just move the screen up and then choose the tilled

tool and let's just click on a water tile I just bring this down a little bit more and I've clicked the water tile and we can see the mouse position is here

the cell position and the cell Source ID is minus one which means we've not interacted with the grass tile and the distance between the player and the

mouse click is 237 so I'm just going to click here in the grass area and we have the mouse position cell position but the cell

Source ID is greater than minus one which means we've interacted with the grass tile so we can check for that value and we have our distance here so

now I'm going to click at the player about here to generate our till dirt so let's just do that and then I can move the player around and start to create

the till dirt map and as you can see I'm outputting the cell positions here now the original till dirt terrain has a

large gap in it so when we add the crops later they don't sit very well so what I'm going to show you is how we can just switch that terrain and then you can

reuse this component in future to Overlay many different terrains in your game so let's close this window and it's very easy we can just update the terrain

here as long as the terrain set is still zero we can always modify the terrain set if you wish but I only have the one

so go back to til soil and we need to set it to three so 0 1 2 and three again so go back to field cursor component and

just update this to be three and then I'm going to test the scene again and this time as you can see the terrain is slightly bigger and this is the train I

want to actually position and plant my crops in so let's close that I'll reset this because I've only got the one terrain so I'm just going to set the default to three here and it's always

set then when I use this component in other levels the terrain's already set for me I'm just going to remove those debug statements from the field curs

component so let's allow the player to remove or delete a dirt tile go to project project settings and we'll add a new input map which allows the action to

add a new action and call it remove Mo dirt and then add and then click the plus button here and for listening for the input hold the control key down and

then click with the left Mouse button so we get Control Plus left Mouse button and we should have a tick box here and click okay and then click close and save

that then back in the field cursor component script before the is action press hit event we'll say if event do

is action press remove dirt then check if the tool manager selected tool is till ground then call get cell under

Mouse again and then change this to be L if now we need to create a new function so underneath ad tile let's create a new function and call this remove tilled

soil cell and say if distance is less than 20 then tilled soil T map layer dot set cells to R connect passing the cell

position in Brackets and then set terrain set to zero terrain to minus one and true let's just copy that and just

scroll back up to the event is action pressed remove dirt and then after get sell under Mouse we'll just call that method

here you may have noticed that I'm actually checking for the remove D action press first and I've done this on purpose because in the input Maps we are

using the left Mouse button in both remove dirt and hit however in remove dirt we have a dual key combo we are

checking for control and the left Mouse button if hit was checked first it would always get cold because it's only ever checking for left Mouse button and that

action will always be picked up so because I need to check for two inputs it's better to check for them first and then if control and left Mouse button

isn't pressed at the same time then I'm only listening for the left Mouse button so if you have many input map combinations which all use a common key

you have to make sure you are checking the input order correctly let's now test the scene so run the current scene choose the till tool and then let's just

create some till dirt then hold on control and click with the left Mouse button and as you can see that's now deleting the terrain now we can start placing crops

on our field so add another child node and choose node and create that and rename this to crops cursor component

and drag that into our components folder and just save that then create an attach a script and we'll just save it as crops cursor comp component into the

components folder and create that then give it the class name props cursor component then just reposition the node below field cursor component then create

an export variable and get the tilled soil tilemap layer which is Type tilemap layer and then create an unready variable and call this player which is

type player and then get the player from the first node in the group so the next variable will be coin plant scene and then preload the coin scene from the

scenes objects and plants folder and we'll do the same with the tomato plant scene so just preload the Tomato scene again from scenes objects and plants

folder then for the next variables we want to get the mouse position which is Vector 2 the cell position Vector 2 I

cell Source ID which is type int local cell position which is Vector two and distance which is FL and we've used these same variables in our field cursor

component now head over to the field cursor component and copy the unhandled input code go back to cropped cursor

component and just paste that underneath then go back to field cursor component and copy get cell under Mouse and paste

that underneath the unhandled input however now copy tilled soil tilemap layer and paste that over the grass tow

map layer because this time we want to detect if we're clicking the tilled soil tile M layer which will get us the correct cell Source ID and then we know

we're interacting with that type of tile then we can apply and add our crop scene to that tile so we're going to create two new methods here to replace remove

tilled soil cell and the ad tilled soil cell so the first function we'll create is ADD crop then let's just create a new function called

add crop and return void then in here we just want to check if distance is less than 20 then check the tool manager

selected tool is equal to the plant corn tool and then we'll get the corn plant scene and instantiate an instance of our

corn scene then get the corn instance and set the global position to be the local cell position which we get from

the tilled soil t m layer then call get parent find child and we want to find the crop Fields node and add the corn

instance to the crop Fields node so this is the crops cursor component and the parents will be the test scene no and then we just search and find this crop

fields node here and then we can add the child then let's do another if statement and we want to save tool manager select a tool and the tools is plant tomato

then let's make an instance of Our tomato scene then set the Tomato instance Global position to the local cell position and then we can get the

parent find the child and then add the child to the crop Fields node here let's create another function we'll call this function remove crop and

again we'll just check if the distance is less than 20 and then we'll get all of the crop nods from this field here and then we'll use a for Loop to search

for a no inside of the crop nods and what we want to check if the node Global position equals the local cell position which we've just detected and if we find

a Nord then let's remove it from the scene now copy this function name and just paste it over the removed tilled

soil cell now select the crops cursor component here and let's assign the tow map to tilled soil so click the assign button and then just choose tiled soil

and click okay and back in the crotch cursor component go back to the unhandled input method and for event is action press hit we want to check that

the selected tool on hit his first either plant corn or his tool manager selected tool his tools plant

tomato so on hits we're going to check if we've got either the plant corn or plant tomato tool selected but when we want to remove the coin we're actually

just going to check if the till ground tool is selected now let's test the scene and first choose the till tool and

let's just till the land then choose the plant coin crops tool and then just plant the coin and then let's choose the

plant tomatoes and just plant the Tomato crops now let's choose the watering can and let's just water our crops then we can Speed the game

up and now I can collect the har and then if I click the till tool and whole control AR and now remove the

crops field and plant a new field somewhere else now that brings us to the end of this tutorial on how to till the land

and plant your crops in the next tutorial I will show you how to save the game so that you can save the state of the till land and the crops and other

various elements in your game [Music] I will show you how to create a save data component which can take different types of resources so that you can save

your game you can then reload those resources and then restore your game state in a previous tutorial I've shown you how to create crop fields and then

plant your crops however when we close the scene and reload it the crop fields not persisted so I will show you how to

save that data to a game file so let's begin by going to scenes test folder and open the test scene crop Fields till

dirt test scene then go to scene new scene and other node and search for node and create that and rename this node to

save data components then save this component in scenes components and then click save then right click and detach a script and

we'll just call it save data component script and just save that in the scenes in components folder and click create and use class name save data component

then create an unready variable called parent node which is type node 2D equals get parent as node 2D then create an

export variable called save data resource which is type resource and in this function function use add to group with the string save data component the

add group to function is the same as using the groups collection here however if we use add to group here we can then use these components in other games and

we don't have to keep remembering to add them to the group so I'm just going to add it to the group here then click the roots folder for your game and add a new

folder and call it resources and set the folder color and we'll choose purple then in the resources folder right click and choose new resource and search for

resource and then create that and call this node data resource then select node data resource here and go to the

inspector and click new GD scripts then right click save as and in the resources folder call this node data resource and

save that and this will just set the script for our resource open the script and then use class name node data

resource and say extends resource then for our first export variable use Global position which is type Vector 2 then

export variable node path which is type node path then at export variable parent node path which is also type no path then for our first function use

underscore save data pass in node which is type node 2D and then we'll return avoid then say Global position equals

node Global position node path equals node. get path and VI parent node equals

node. get path and VI parent node equals node dot get parent then check if parent node is not equal to null then we can

say parent node path equals the parent no. get path and for the next function

no. get path and for the next function call this load data I'm passing window and just right pass to this so the reason why I've underscored these

Methods at the beginning is just to show that I'm going to override them later because we will derive from this class name and resource now head over to the

scenes folder and in objects and plants just open the corn scene and then in the components folder just drag the save data component into here and as you can

see we need to set the resource now this resource here is a base resource so I'm going to derive from this resource and

then set that resource on this save data component so back in the resources folder right click create a new resource and then create that resource and call

this scene data resource and just save that then just double click it to load it in here in the inspector right click and choose new GD scripts and then right

click and save as and then name the script scene data resource and click save then open the scene data resource script and use class name scene data

resource which extends no data resource then let's add an export variable called node name which is type of string add another export variable which is seen

file path and his type of string then we'll create our first function which is underscore save data and pass in node which is type node 2D and return avoid

and then we'll call the save data method and pass in node which is the base class save data method which is this and say

node name equals node. name and scene file path equals node do seene file path and for the next function we can use

load data and pass in window returning void and say VI node which is type node or C node which is also type node then

say if parent node path is not equal to null then parent node equals window get node or null and then pass in that

parents path then say if node path is not equal null then variable scen file resource which is of type resource

equals and then load and pass in the scene file path and scene node equals scene file resource do instan as node 2D

and say if parents node not equal to null and C node not equal to null then the C node do Global position equals

Global position then parent node do add child and then add the C node and just update these two nodes to be node 2D so we'll use this resource on the save dat

component where the seene node is of type 2D and is attached to a parent node which is also of type 2D now back on the coin scene choose save data component

and then choose scene data T res file and just drag that resource into the save data resource to set that then back in scenes objects plants open up the

Tomato scene then in the components folder drag the save data resource onto the tomato seene then head back to the resources folder

and then choose the save data resource and just drag that onto that property here now head back to the test scene crop Fields till dirt and we need to

create a component in here that will go through and save all of our nodes which have a save data component and it will

save the level in its own file so on the test scene crop feels till dirt right click and add a child node and we'll just choose node option and create that

then rename the node and call it save level data components and go to the components folder and just drag that

into our components folder and then save that as its on scen then right click and attach a script and also save that

script in the same folder then use class name save level data component for our first variable right level C name which

is type of string then for save game data path which is type of string equals and then use this exact string here so we're going to create a game data folder

then save file name which is another type of string and use this exact string here as well and there's a format operator in there then override the

ready function and then use add to group with the name save level data components then call get parents. name so when the

ready method is called we will get this name from the parent and this will allow us to use the scene level name to be

part of the name for the data file now before we continue writing the script we need to create a new resource which will act as a container and contain all of

the small resources from each of the nodes which contain a save data component so head back to the resources folder and create a new resource and

just create that and call this save game data resource and save that then double click it to open it here and then say New GD script and save as and call the

script save game data Resource as well and click save then open the save game data resource script and use class name save game data resource which extends

resource and then use an export variable able which is save data nodes which is an array of node data resource and this

is the base class resource which we are deriving from so that completes that script now head back to save level data component script and let's continue with

this create a new function called save node data and return void and use nodes get tree. get nodes in group and then

get tree. get nodes in group and then pass in the string save data compon component then declare another variable at the top called game data resource

which is type of save game data resource and back in the save node data method we'll say game data resource equals save

game data resource again and then just new that resource then we can say if nodes is not equal to null then for node

in nodes and if node is a save data component then create a variable save data resource which is of type node data

resource equals node dot save data and we can just say node is of type save data component here then create another

variable and call this save final resource equals save data resource and then duplicate that then get the game

data resource do save data nodes and append it with the save file final resource now let's create another function and we'll call this save game

and return a type of void and say if not directory access do directory exists absolute and pass in the save game data

path then get the directory access class and use make directory absolute and then pass in the save game data path again so we are just checking if the directory

exists and if it doesn't will make the game name data directory then save R level save file name equals save file

name and then level C name so it will use this format get the level C name and then format and create us the correct

file name and after this call Save no data and say variable result which is a type in equals then use the resource

saver class do save and then pass in the game data resource course the save game data path plus the level the file name

then use a print debug statement and we'll just output that save result then for the next method call this function load game which is also a return type of

void let's declare a variable level save file name equals save file name and then the level C name then variable save game

path equals save game name data path plus level save file name and say if not

file access do file exists and pass in the save game path then we can return we can also just make these strings as well

and then back in save G make that type of string then back in load game will say game data resource equals resource

loader and do load and then pass in save game path and say if game data resource

equals null then return again then say V root n which is a type of window equals

get tree dot root then save our resource in game data resource do save data nod

then if resource is of type resource and if resource is node data resource then resource. load data and pass in root

resource. load data and pass in root node this script is now complete so let's head over to our scripts folder and inside globals create a new script

and call this save game manager and create that and then open the script then go to project project settings and

in globals let's add our save game manager script to go to scripts globals choose save game manager and open that

and then add the script and then close and then back in project and project settings go to input Mark and add a new action and call this save game let's add

that action and click the plus button and for the input use the P key for persist and then click okay then click close then back in our save game manager

script let's create some functions and the first one will be save game which is a type of void for a save level data component which is type of save level

data component equals get tree. get

first ning group and then use the string save level data component and say if save level data component is not equal

to null then save level data component do save game and for the next function call this load game game and copy everything from save game but on line 15

go change this to be load game then just above save game Let's override the unhandled input event and say if event

do is action press and then use the save game input event then call our save game function the next step is to create a

special test scene save data node so that for test scenes we save data slightly different than for the main

game and this will allow us to now test the save level data components and the individual save data components for the

nodes as well so back on TES scene crop Fields till dat scene right click and add another child node and just choose node and create that and rename this to

be Test theme save data manager component and then back in the SE and components folder let's just drag that

scene into that folder and then save that scene as a component then let's open the scene and right click and attach a script and save that as test

scene save data manager component script and then create that and in the script use class name test scene save data manager components

then for the first function override the ready me method and just use pass for now and for the second method use

function load SC then use the save game manager and call the function load game then back in the ready method use call

deferred and passing the string Lo test scene so we are using call deferred because we just need to make sure the save level data component and the save

data components have been loaded in the scene Tre first now head back to the test scene and just move these to the top just to organize that a little bit

better then back in the scenes and components folder just open the save data component script and let's add another function here so say function

underscore save data and we'll return a type of resource then say if Cent node equals null then return null then if

save data resource equals null then push error and output the save data resource and the parent node. name which is causing the error and this will just

check if we set up a save data component correctly with the parent node and the resource so we can catch that here then you save data resource dot save data and

pass in parent node then return save data resource so that completes the script so go back to the test scene and in the 2D view let's just go to scenes

objects and plants and just drop the coin scene onto our test scene so before we test the scene just head back over to

the save level data component and for save game data path I'm using the user path so just check the Godot

documentation refile pass and just check which directory your user path will be I'll leave this link in the description below so we can now go and test the

scene run the current scene I'll just move this window up so we can view the output window then press the P key on the keyboard and in the output window we

have a save result of zero so this has successfully saved the game data then head over to your game data location so in the app data folder here under

roaming and Gau in the app user data folder I have a game folder for my game and then this contains my game files I've created my own game data folder so

I'll go into there I've got the save game data file and that's the name of the test scene which I'm saving so I'll

open that and I can see in that file I've got my coin scene and it's been added to the save data nodes array so now that we're saving the coin scene and

the plant scene let's actually now save the tail dirt tilemap to the file as well so that when we load this scene we get something similar to this so back on

test scene crop Fields just remove that corn scene because we create our scenes dynamically with the till dirt head to the resources folder and create a new

resource just select that and create that and call it tilemap layer data resource and just click save then back in the resources folder right click

create a new script and create a GD script which is T mapor layer data resource and create that then double click the T map layer data resource file

and in the t- file when it loads just drag and drop the T map layer data resource script onto the script property then double click the script and let's

choose class name tilemap layer data resource and then extend node data resource and for the first export variable use T map layer U cells which

is an array of Vector 2 I then the next export variable is the terrain set and we'll set that to a default value of zero then another export variable which

is the terrain and we'll use a default value of three then for the first function let's use underscore save data

and pass in no and return void then say supercore save data and pass in the node so this will call the save data method

of no data resource then for the next variable say t map layer which is of type T map layer and then we'll cast the nde as a t map layer for the next

variable we'll say cells which is an array type of vector 2i we'll get the T map layer and the used cells then we'll

set T map layer used cells equals cells equals cells and for the next function we will use SC load data and pass in

window and return void then v c node equals window dot get node or null and then pass in node path then say if scene

node is not equal to null then for T layer equals c node as T layer then T layer do set sells terrain connect and

then pass in t map layer cells terrain set our terrain and the last parameter is true now that completes the script to

go back into test crop fields and under game tower map and tilled soil let's then grab our save data component and

get that scene and drop it onto tilled soil then go back to the resources folder and get the town map layer data resource t- file and drop that onto the

save data resource property so let's go to the test scene and back in the app data folder under the game and the game data just remove the old file as we've

made some changes and then let's run the test scene now let's just create a crop field and let's then plant the corn and

plant some Tomatoes then I'll press the P key then back in the game data folder let's open that file and as you can see it's creating these resources here so

we've got the node data resource the to map layer data resource the scene data resource and the save game data resource and it's got all of the properties from

each of the resources the scene data resource and the T map layer data resource derive from node data resource and that's why we still got Global

position node path and parent node path in all of the resources so we are reusing certain properties which makes it more efficient when creating the

resource to save data if we scroll down all of the save data component no and the resources are saved in an array which we call back later and that's the

save data nodes now I'll just close the test scene and let's run it again and as you can see it's persisted that crop field I will now set up the test scene

again and create a new crop field and then add some break points in the code and explain how the save level data component component and save data

components [Music] work I am now ready to press the P key on the keyboard to save the data file and I will step through the break points

to explain the code in a little more detail when the save game action is pressed we'll go into save game and then

we check if our scene has a save level data component then we grab the save level data component and then we just go

into there and save the game from there then using directory access we check if the directory exists first and the game

path will be the user path which is defined in Godot then we create the level save file name which is savecore the

level name underscore game and data then we go and save the node data itself so from the scene tree we get all of the nodes which have the group save data

component and then we bring those nodes into a collection and then create a new instance of the save game data resource

which is an array of resources we then go into the save data component method and then get the resource from the save

data component and then inside the resource which which is attached to the save data component we then call save data on the resource so in this instance

we've got this save data component here which is the T up layer data resource and what we can do is then set those

variables and get the cells from the T up layer and then set them on the resource once they've been set on the resource we can return from the resource and then add it to the game data

resource course save data nodes collection then as we go through the next save data component we can go into the save data there and then go into the

resource of that component and this one is the scene data resource so we can actually check what the name of that is and this is one of the coing scenes so

we get the scene file path and if we just check the resource which is here so if we just drag this off you can then click this object to inspect it further

and we can see the information which is now inside of this parameter here and just open this up and we can see that the node name is coin it's automatically

set the scene file path and in the node data resource which is the base class the global position node path and parent node path has been set so if we look at

this you can see that the parent nod path is crop fields let's just collapse this a little bit more and we'll just return from that so I can just keep cycling through those NDS and ret return

them and it's going to save all of the data nods in the level scene and as you can see it's just going through the collection and then when it's come out of there we then save the game data

resource which is the array of all the resources which have now got properties set and then we check the result and it's zero so it successfully saves the

game file now I will step through how the load mechanism works so I'll close the scene and just run the test scene again this time around we are going

through the load test scene method of the test scene save data manager now this is a special component just for test scenes to allow loading game data

that was saved only for test scenes in a future tutorial I will show you how to load using the save game manager from a main menu so just step into that method

and then we do the same thing here we just get the save level data component and then we load the game so we build up that level save file name and then we

see if that file exists if the file exists we have some information in there to help us load those resources again so we load the game data resource which is

the array collection of all the resources then we get the trees root node and start to go through the resources inside of the game data

resource collection then in the resource we can then call the load data function so if we just step through that L data function we can see that the First

Resource it's found is the T map layer and the load data will then find the to map layer that's associated with it and then start to rebuild and attach the

properties for that specific node so for T map layer we need the tilemap layer yourselves and the terrain set and the terrain so what it

does is that it grabs the tilemap layer and then sets the terrains again then we go back through the collection again so let's see what the next resource is so

we just step into load data the next resource is the seene data resource so we just check the properties so yeah we do have apparent no path so let's set

that and then we do have a Nord path so what we can then do is load the scene from that path so we grab the coin scene and then we create the coin scene by

using instantiate and then what we need to do is to then attach the scene to the parent so the parent ND path is crop fields and then we get the position that

we saved and then reset the position of the new scene we've just created and then we can just reattach it to the parent Nord which is crop Fields then

with we can go through again so the scene data resource is responsible for just creating those scenes on load and then we can just go through that method

so in this instance it's a crop Fields node and it will just create those so let's just keep stepping through and then F12 to continue I'll close this

window and that is how we are saving and loading data using the save data component and resources now that brings us to the end of this tutorial on how to

create save data components with custom resources to allow you to dynamically save data for your game as you can see those reusable components can be

attached to different scene types and if you derived from the resources you can save different [Music] variables I will show you how to make

your player interact with another character in your game and also create a Shader so that you can replace the colors in the Sprite and make

modifications without having to repaint your Sprites you will also create an interactable component so that you can reuse this in other areas of your game

so let's begin just head to the scenes folder in characters folder add a new folder and call this guide click okay and then go new 2D scene and rename this

to guide and just save that scene in scenes characters and guide folder and then just save that and for the guide we won't use a character body 2D because

the player will just interact with the guide so that we can show the dialogue balloon so add another child node to guide and search for animated Sprite 2D

create that and then in the 2D view go to Sprite frames and new Sprite frames click that for the default animation let's rename that to Idol and set this

to bit on Auto load then open the Sprite frames and choose basic character sprites and click open let's zoom in and choose the top two here the horizontal

parameter and vertical parameter is already set for this click add two frames and let's just play that and leave looping on and just turn frames

per second down to three so I'm using the same character sprite for the player as I'm using for the guide so let's replace some of the colors in the Sprite

for the guide so that you can differentiate between the player character and the guide character so on animated Sprite 2D in the inspector

let's scroll down until we get to material create a new Shader material and then for Shader click the empty option and choose new Shader and leave

type as Shader mode as canvas item and we'll call this replace color GD Shader and create that then open the Shader and

we can delete this part here because we don't need that method and we don't need the vertex method we will only use the fragment method because we are just

going to modify the color so let's begin writing some Shader cord to replace these two colors in our Sprite so this

part here and this outline here so after Shader type canvas item use uniform Vector 4 original color zero and Source

color and for the second color use uniform Vector 4 original one and this is also a source color for the third

parameter use uniform Vector 4 replace zero and Source color and for the fourth parameter use uniform Vector 4 replace

one and Source color as well then back in the Shad of material let's just set these shaded parameters so for the original zero just click that and then

click the color dropper here and zoom in and just click the outline and then for the next color choose the character

color here in the middle then for the outline let's replace that color so we'll just choose something different for now and then for the color to

replace original one we'll just pop this color in for now as well then in the fragment function use Vector 4 color

equals texture passing texture and then the UV and then say if distance which is the color at that UV original zero is

less than or equal to 0.1 then replace the color if it's not then just assign theor from the texture

back so we say color equals and then color here and just put our semicolons in and as you can see for the original

color zero we are now replacing it with the replace zero let's just improve the script a little bit more use a constant

float and say Precision equals 0.1 and just replace that there now we need to handle the second color so we'll modify this a little further so we can handle

an array of colors so I'm going to create a new function and call it back or replace underscore color and pass in

the color then I'll use Vector 4 original colors equals Vector 4 again and then pass in original zero and then

original one then create an array to hold the replace colors array size to with replacing Z and replace one then

create a for Loop and say integer I equals 0 and if I is less than array

size which is two I ++ then copy this if statement and just paste that in there then copy original colors and just put I

in there and then copy replace colors and just put I in there as well and just make that then after the for Loop just

turn color and then back in the fragment function we can just say color is the function replace color texture and then

pass texture and U and then if we look at our Sprite we can see that we are now replacing both of those colors so it's now possible to modify the Shader

further and add more original colors and more replace colors so that if you want to use the same Sprite but add more modifications it will be possible using

this type of Shader so now that the Shader is complete head over to the scenes and components folder and just scroll down until you see the

interactable component and just drag that onto our guide then on the interactable component just right click add a child Nord and search for

Collision shape 2D and then for the shape just click new circle shape and just make this a lot wider so that the player can enter this area area here we

have made the Interac component in the previous tutorial so we've already configured the Collision layers to interact with the player and fire the

signal when the player walks in the area we want to show a Sprite here with the letter e in it to show the player that they need to press that key on the

keyboard to begin the dialogue to go to scene new scene and then choose user interface scene and then for the control

call this interact label component then save that scene and go to scenes components and save it as interactable label component

scene add another child node and search for it texture then in the texture property choose new Atlas texture and

open that then head back up to assets UI and basic UI Sprites and drag that into the atlas properer then click edit

region and with auto slice selected in this area here just zoom in and choose this option here then click close then

add another child node and search for label in the text use capital E and then scroll down until we have fonts here

then quick load and choose ZX P variation here and just open that let's zoom in and for our font size choose eight

then click back on texture re and let's just resize this scroll back up and for transform size weize this to be 18 by 18

then click back on the interactable label component control and just zoom out and then for the anchor points just choose top left and then zoom in then

for size choose 18 by 18 then click on label and scroll down to size and make the with 18 and then just make y 18 as

well and then scroll up and for horizontal alignment choose Center then scroll back down and for size let's just

reduce the size and then for position on the Y AIS let's just reposition that here and that finishes our interactable

label now head over to the guide and then go to scenes components folder and drag the inter ible label component onto

our scene so I'm just going to reposition the animated Sprite 2D and then reposition the interactable component as well and then the

interactable label component will just put about here and that's complete so click the guide scene and let's right click and attach a script and we'll just

save the guide script in the characters and guide folder so create that in the guide script let's just create our first inter interactable component on ready

variable and then we'll do the same for the interactable label component too then override the ready method and then get the interactable component and

register the interactable activated signal and connect that then we will create a function called uninteractive activated which is a return type of void

and then we can get the interactable label component and then just display the label when the player is in the area then back in the read method get the

Interac component and register the interactable deactivated signal and connect that then create another function called un interactable

deactivated return type void then get the interactable label component and hide it then back in the ready method call interactable component and hide

that by default as the guide enters the scene tree now head over to scenes and test folder and duplicate the test scene

Game screen UI so duplicate that but call it test scene guide dialogue and then just duplicate that then open the

test scene and then rename this to be test SC guide dialogue and then save that and then back in the guide script just copy interactable label component

and paste that over inable component High then go to 2D scene and then let's run this current scene and as you can see we've got our player here and the guide

here so let's just move towards the guide and we can see that we've now interacted with the guide and we have now an indicator here so that the player

knows to press the E key and that brings us to the end of this tutorial on how to create a Shader to replace colors inside of other Sprites we have also created an

interactable compon comp so the player can interact with other characters and show information on how to respond in the next tutorial I will show you how to create a dialogue balloon so that you

can communicate with the [Music] character I will show you how to create your own custom dialogue balloon complete with dialogue scripts you can

interact with other characters so that you can then show the DI to your player and also take some actions so to create our dialogue balloon and scripts I'm

going to use a plugin by Nathan H so head over to the asset library and search for dialog manager and just open up this manager here and we will

download and install that into our project so click download and then install the add-on and then just click okay then in the root folder create a

new folder and call this dialogue and then click okay okay then right click the folder and set the folder color to teal then head over to project project

settings plugins and just enable the dialogue manager and click close And now let's head back over to the add-ons folder and just expand the dialogue

manager and in example balloon copy the example balloon script and the scene and just say move and duplicate to and then

just choose your dialogue folder and then choose copy then rename this scene to game dialogue balloon and rename the script to base game dialogue balloon

then open the base game dialogue balloon script and rename the class to base game dialogue balloon then open the game dialogue balloon scene and on the

example balloon rename this to game dialogue balloon and then open the script and just detach that then create a new script on the game Di balloon and

just call it game dialog balloon. GD and

create that then open that script and extend from base game dialogue balloon and that sets up the game dialog balloon with the right script now let's head

over to the 2D View and before we style this balloon let's go back to our dialogue folder and create a conversational script so create a new

folder and call this conversations and click okay so open the conversations folder then choose the dialogue option here and click new and then call this

file gued okay and it will create you a guide. dialogue script now just rename

guide. dialogue script now just rename this to say start and that's the entry point of the script and then to start it

again we just copy that and just paste that to you now we will use this default script to help style the dialogue and then we will modify the script for our

own custom conversation so head back over to scenes and in characters and the guide folder open the guide scene and then just open that script here then we

need to add a new input map so go to project project settings and in input MK add a new action called sh dialogue and

add that and then for the plus button press the E key and then okay and click close then in the guide script at the

top save our balloon scene equals and then use preload and then choose dialog game dialog balloon scene and then let's

create a new function and override the unhandled input event and then say if event dot is action pressed show

dialogue then bar balloon which is type base game dialogue balloon equals the balloon scene then instantiate then use

get tree do Curren scene ADD child and then add the balloon and say balloon do start and then load and then use the

guide. dialog script then comma and the

guide. dialog script then comma and the string start so we head back to the dialogue we are going to start this

script here and pass in the start function so we start at this point here let's go back to the guide script now let's pop a break point on line 24

and this is where we create the balloon scene then go to scenes test folder and just open the test scene guide dialogue

and then let's run this scene now press the E key on the keyboard and we can see that this event is now called and we are going to create the balloon scene and

load the guide dialogue so let's just F12 that to run and we can see that the dialogue has now loaded in the balloon press to space bar and we can start

again and if you go back to dialogue the start again calls the beginning of the dialogue script let's go back to our

game press the space bar again and then let's just end that conversation as you can see though you can press the E key at any point but you should only be

allowed to show the dialog balloon once we are in range of the guide so let's just solve that so at the top of the guide script at another variable called

in range which is a type of Bo and then on interactable activated set this to true and on interactable deactivated set

this back to false then in the unhandled method say if in range then let's check if the action is pressed just remove that break point here so now let's test

the scene again just run the current scene and press the E on the keyboard and no balloon is showing let's move towards the guide now the UN

interactable is activated and press the E key and now we get the dialogue so head back to game dialog balloon scene and we will now style our

dialogue balloon go to the dialogue folder and right click and create new resource and search for theme and create that and call it dialog balloon theme

and click save and then click on balloon scroll down to theme and just remove that then click quick load and choose dialog balloon theme and open that then

double click the dialog balloon theme to load it and let's now add a new style type so let's click the plus button here and we'll style the panel to begin with

so search for panel and choose add type and then choose this option here and click the plus button this will just override the style so click a new empty

style and then choose new style box texture then then open the stylebox texture and then for the texture property click and then create a new

Atlas texture open that then go back to assets and UI folder and just bring in the basic UI Sprites then edit region

then with auto slice selected just zoom in and choose this option here click close then just collapse the atlas texture and scroll down to sub region

and click edit region then zoom in and choose pi pixel snap and just bring in the bars to frame our panel click close And then the next

thing to style is the dialogue and this derives from margin container so back on our theme let's add a new style type and

search for a margin container and then add that type choose this option here and then add for each of the items and use a margin of 10

and now let's resize the panel just scroll to the top and for custom minimum size choose 400 for x and 70 for y and

then choose anchor Center bottom then click on dialog Nord and then choose the anchor preset and choose

full R then click back on panel and for transform and size put 70 for y and then anchor again to the the bottom and for

position choose 270 for y then click on the responses n and scroll down to size and just reset that and that will

position it here then go to Anchor preset and choose Center then click on character label node and open the theme

and then let's add another type here and write character name text and then click add type then choose this option here click the plus button and search for

Rich Text label and set that base type here and click back on the label here just scroll down and in type variation let's edit that and write character name

text and just accept that then back on the theme the character name text let's just zoom in and for normal font size let's just click the plus button and

change that to be 14 and enter then let's add another style type and write dialog text and then click add type choose this option here and add another

base type and search for Rich Text label and then set that base site then choose dialogue label node here and scroll down

and then for theme and type variation just edit that and write dialog text and just accept that then back on the theme

for dialog text click this option here and override the normal font size style and write 12 now choose the response

example node and then Open the theme again and click add for a new style type and search for button and choose the button option and add that type and

choose this option here and scroll down to normal and click the plus button to override the style click empty a new style box texture then open the texture

and for the texture property choose new Atlas texture and open that and for for the atlas go back to assets and UI folder and bring over the basic UI

Sprites then click edit region zoom out and choose Auto slice then zoom in and pick this option here select that and

click close then collapse Atlas texture and scroll down to sub region and choose edit region then for SNAP mode choose pixel snap zoom in and just bring in the

bars to frame the button and once that's framed click close then right click normal style click copy and then for press style override the item right

click and paste this will then paste the style from normal but right click and say make unique recursive and click okay

then open the Press style and open the atlas texture and click edit region then choose Auto slice and scroll in in and choose this

option here then click close And then for sub region we don't need to configure it again because we've

copied from the previous style so click close so right click the style for press click copy and then scroll to hover and

override that item right click and paste right click again and make unique recurs it click okay and then open the hover

style for texture open the atlas texture and scroll down to edit region then for hover Style Just scroll in and choose this option here then click close And we

don't need to edit sub region again as that is now preconfigured so right click the hover style click copy and for Focus override that style right click enter

paste the style right click again and make unique recursive and okay now we don't need to do anything with the focus style we'll just make a whole copy of

hover so right click the focus style and click copy and then scroll up to disabled override the item right click entty and paste right click again and

choose make unique recursive and click okay now open the disabled style and open the atlas texture and click edit

region with all AO slice selected choose this Sprite here and click close now we have finished styling the custom balloon let's go back to test scene guide

dialogue and run that current scene and head over to our guide and press the E key and you can see the dialog balloon has now been styled let's enter and we

can now choose our options I'll just end the conversation and close that window and to create the emotes panel which will contain the Sprite of the character

with the talking animation let's create a new scene so go scene new scene and then user interface right click change type and search for panel and just

change that type let's right click again and call this emotes panel and save the emotes pel and go to scenes UI and save

the emotes pel scene in this folder then go to scenes UI folder and open the game UI theme and we will use this Darkwood panel on the ortes panel so click on

ortes panel and scroll down to theme click entty then quick load and choose game UI theme then for type variation

edit this and type dark word panel and just accept that then add another child node and search for control and then

create that node and rename this to ort then for custom minimum size choose 4 and 40 then click back on the imort

panel and choose top left and for custom minimum size choose 50 and 50 and then we'll scroll in then click on control and add another

child node and search for animated Sprite 2D then click new Sprite frames and open that rename the default animation to immort one idle click add

frames and then go into the assets folder and in UI folder choose imort PNG and click open change horizontal to five

and vertical to 15 then zoom in and choose the first frame and add frame then for this animation choose Auto load and leave it on looping I will only add

seven animations and the number is the position of the animation in the Sprite sheet so choose add animation and call this imort to smile add frames choose

imort open and then choose the second frames and this is the position two vertically in the Sprite sheet add two frames add

another animation call this emote 3 ewave add frames choose emotes under open and choose these five frames add

frames add a new animation and call this emote or blink add frames choose emote and open and this is the fourth one down

add frames and call this emote 6 love kisse add frames ortes open and then count from the top so we've got 1 2 3

four five and six so choose this one here add two frames add a new animation and call this emot 7 excited click add

frames otes and open and again count from the top which is this one here choose add two frames and then for the last animation

call this imort 12 talking add frames choose imort open and then count from the top and then choose that 12th Sprite zoom

in and add these two frames so now let's position the ort click on the ort control no and choose Center and then

for animated Sprite 2D let's position this so we'll say 20 and then for the Y AIS we can make that 22 and then on the

emotes panel right click add a child and search for timer and rename this to emote idle timer then change the wait time to 5 seconds and then turn on auto

start then chooseing mes panel right click and attach a script and save the script in the scenes in UI folder and click create

and grab the animated Sprite 2D and create an unready variable and then get the imort idle timer and create an unready variable for that as well then

for the next variable we want Idol emotes which is an array and add these four strings so we have imort one Idol

imort 2 smile ort 3 ear wve and ort for Blink then create and override the ready method and call the play fun function

and pass in emote one idle to start then create another function called play emote with a variable called animation which is type string and return type

void then grab the animated Sprite 2D use a play function and pass in animation then back on the OTE idle timer in the inspector click node and

choose the timeout signal and then connect that then click connect to create the function and in the function declare variable index equals randai

range and put a minimum value of zero and a maximum value of three then say V emote equals idle emotes and then pass

in index so every time this method is called it will randomly get one of these strings from the idol immort array then

say animated Sprite 2D and play the emot so now that we've completed this scrip let's now take the ort panel and add it to our game dialog balloon head over to

the 2D View and click on the dialogue node and add another child and search for hbox container and create that and place the vbox container inside of the

hbox container and then click on dialogue and for layout mode choose position and just reset the size and then set the x to be 400 and the Y to be

70 then add a child node and search for HB and choose hbox container and create that then drag the vbox container and

place this inside of the hbox container then in the scenes and UI folder get the ort panel and drag that inside of the hbox container and just position this

above the vbox container now just click the dialogue Nord and as you can see it is stretching and the ortz panel is also stretched to go back to the ortz panel

scene and select the amort panel Nord and in the size settings just click this and choose horizontal alignment shrink begin and for vertical alignment shrink

begin to then save the scene and then go back to game dialog balloon and you can see that now fixes that then click on

vbox container and choose bill for horizontal alignment and Shrink begin for vertical alignment then in the

inspector if you scroll down to container sizing underneath horizontal property choose the expander option and this will then fix the layout for the

vbox container and now that we've resized the emotes panel and vbox container let's just check the hbox container so this is okay and then the dialogue so we can still see we've got

this bar here so just go to Anchor preset and then just choose full rate and that will resize that again so head back over to the test scene guide

dialogue and let's test our scene again so just walk up to the guide press the E key and we can see now that we've got this all formatted nicely so just end that conversation and let's close the

window and the next thing to do is just head up to the dialogue folder and in conversations load the guide dialogue and let's replace this text with our own

custom dialogue let's remove all of the text and type my law then Open brackets and then Open brackets again and type hi

with a pipe hello another pipe and Hower and then put nice to meet you so the text in the brackets is separated into three tokens and every time the script

loads it will choose one of these so it will either be hi hello or hold it and it's just chosen at random and for the next sentence we can say welcome to your

new form and then I'll just finish the conversation as as you can see the cows and chickens are hungry and you need to grow some crops to feed them so here are some seeds to grow some crops and then

what we're going to do here is call a method so that the guide character morw gives the crop seeds to your player and enables the buttons on the toolbar so

head to the scripts folder and in the globals folder create a new script and call the script game dialogue manager and create that now load the script and

go to project project settings globals and then add the global script so it's in the script folders under globals and game dialogue manager and click open

then add the script and click close And then in the game dialogue manager script create a new signal called give crop seeds and then create a function called

action give crop seeds and return avoid then grab the signal and imit and then back in the dialogue script after the last sentence say do to game dialog

manager. action give crop seeds and this

manager. action give crop seeds and this will call that method on that Global script so when this method is called let's enable the tools on the toolbar so

go to scenes in UI and go to the tools panel script and override the ready method and in the 2D scene when the Tool panel first loads these four buttons

will be disabled when the player interacts with the guide and gets the crop seeds we will then enable these buttons so let's just disable these

buttons first so we'll get the Ping tool and disable that and also turn off the mouse Focus mode so I've now disabled

the button and focus mode for the two tilling button the watering can the two coin and the two tomato then go to the scripts folder and globals folder and

open the tool manager script and add a new signal called enable tool and pass in a parameter which is tool and is type data types. tools and create

a new function called enable tool button and pass in the tool variable and then get the signal and Emit and pass the

tool then head back to the tools panel script and in the unready function get the tool manager and then call enable

tool signal and connect that signal so then create a new function called un enable tool button and the parameter

will be to and it's the data types. to

then say if to equals data types. tools.

till ground then get the to tilling button and then set disabled back to false to enable it and then set the focus mode to control. focus all so that

it receives Focus then I'll do the same for the other buttons so I'll say L and that completes the El if statement for all of the buttons that will be

disabled and then we'll reenable when we receive the crop seeds now go to scenes characters and in the guide folder open the guide script and in the ready

function get the game dialogue manager and connect the give crop seeds signal we'll call this function on give crop seeds and then at the bottom let's

declare that method and return void then we can grab the tool manager and call enable tool button and then enable the buttons so the first tool I'll pass in

is till ground for the second one is water crops then plant corn and plant tomato so back on our test scene guide dialogue let's go to the 2D scene and

let's run the current scene to test it and as you can see in the tools panel these buttons are currently disabled so let's head over to our guide and press

the E key so we'll go through the script and then on our last sentence here are some seeds to grow some crops once we hit the space bar again it will then

call that method and should reenable the two buttons so let's just press the space bar and as you can see now our two buttons are

enabled but let's just make slight alteration to our guide conversation so go to the guide dialogue in dialogue conversations and just remove this line

here and let's add some options so I'll say hyphen take crop seeds then I'll use the name Teo for our player character

and the response from Teo is yeah I can grow some crops so if the player chooses this option then let's call the action give crop seed and enable the tools and

the other option is the player can say no and then Teo will respond I'm not ready to grow my form yet so the buttons will stay disabled so now let's test

this script head over to the 2D View and run current scene and as you can see the tools panel UI has the disabled buttons

let's walk over to our guide and press the E key and let's go through the conversation so now we have these two options and for the first run let's just

say no I don't want them and t-o responds I'm not ready to grow my farm yet so press the space bar let's walk away from the character and then the player can approach the guide again and

let's go through the conversation one more time and this time around let's take crop seeds and t-o responds yeah I can grow crops and now the buttons have

been enabled let's stop that so now that we've created an emotes panel UI let let's just add that to our game screen to go to scenes UI and open the game

screen and add a child to margin container and search for vbox container and create that then position that above the margin container then back in the

scenes and UI folder get the ortes panel and place that inside of the vbox container then get the inventry panel and put that also in the vbox container

then scroll in and on the vbox container choose horizontal alignment shrink begin and vertical alignment shrink begin too then zoom in more and what we want to do

is to Center the inventory panel to for the amort panel say horizontal alignment shrink Center and then the inventory panel choose this option and choose

shrink Center and that will just adjust it to sent to both panels now head back over to the ortes panel and open the ortes panel script so the emote idle

timer will select an animation from the idle emote every 5 seconds so go back to the test scene guide dialogue and just run this test scene and this animation

will change every 5 seconds so if I go to the guide and press e the animations here are also from the idle emote array

but let's make a modification to the game dialogue balloon script so that this animation is the top talking animation so head back up to the

dialogue folder and open the game dialog balloon and then open the game dialogue balloon script then select the emotes panel and drag then hold control do and

create an unready variable for our emotes panel then once we've got this variable open up the base dialog balloon script and then just scroll down and

keep scrolling until you reach the start function then copy the function definition from here and go back to the game dialog balloon script then we are

going to override that start function so paste that into our scripts here and when the function is called we need to call back down to the base class so

write super and then write start for the function and pass in these variables then get the imort panel and call the

function ort and then in the ort panel animated Sprite 2D we will use the ort 12 talking animation so just write that

here then we will override another method so go back to base game dialog balloon and after the start method copy the next function definition then go

back to game dialog balloon and just paste that here then write super do next and pass in next ID then call the OT

panel and call play reme and pass in the talking animation so that completes the script now head back to test scene guide dialogue and let's run our test scene so

we have our imort Idols array here which is switching between those different animations but let's now approach our guide and press the E key and as you can

see this is the talking animation and if we wait long enough it will switch back to the more ID aray then press the space bar and it will switch again to the

talking animation then it switches back to another animation from the emotes idle array and then the space bar again and as you can see it will keep talking

as you press the space bar now there's just a slight Improvement for our test scenes so go to scenes and test and just open test scene

crop Fields till dirt and run that test scene now because we are disabling the buttons in the tools panel we ideally want these enabled when we run a test

scene to close this head to the components folder then go scene new scene other node and choose node and click create and rename this to test

scene enable tool buttons component and then save the component and in the scenes components folder just save our new test scene enabled tool buttons

attach a script and we'll just call it test scene enable to buttons component and create that then in the script override the ready method and just pass

for now then create another function and call it enable tool buttons then grab the tool manager and call enable tool button and pass in the till ground tool

and then do the rest for the other disabled tools then back in the ready method say call deferred open quartes and pass that function name so we using

Cod def so that we just make sure that this is called after the buttons are already disabled let's save that let's go back to our test scene crop Fields

till dirt and then let's add our test scene enable tool buttons to our test scene let's just move that to the top and then let's run our test scene and as

you can see the buttons are now enabled so let's just test that now that brings us to the end of this tutorial on how to create your own

custom dialog balloon complete with dialogue scripts you can interact with the guide and then choose some options which Calla some actions in your

[Music] game I will show you how to use the collectibles in your inventory and give them to a CH testing your game to

receive rewards so head over to scenes objects and let's create a new folder in our objects folder and call this chest click okay and then create a new 2D

scene rename this and call this chest then save our scene and go to the scenes folder objects chest and save that scene then right click ADD child node and

choose animated Sprite 2D and create that node then head down to Sprite frames property click empty and create new Sprite frames and then open the

Sprite frames then rename this animation to chest open and then click add frames go to assets and then game folder

objects and choose the chest PNG and click open then set horizontal to five and vertical to two and then choose the

Sprites in this order and then add those five frames then create a new animation and call this chest close click add

frames pick chest PNG and click open and then zoom in and then choose the frames in this order and add those five frames let's just zoom in on our Sprite and

let's play that let's turn looping off and then go to chest close and turn looping off as well let's add another animation and we will call this default

click add frames choose chest click open Doom in and just choose this single frame here and then click Auto load so when the scene is added to our scene

tree this is the Sprite that will be displayed and turn looping off as it's just a single Sprite then head back to scenes folder and components and then

scroll down and add our interactable component to the chest then add a child to the interactable component and choose Collision shape 2D and for shape choose

new circle shape and just make this a little bit wider so when the player interacts with this Collision shape we'll then show the interactable label

then also back in the components folder get the interactable label component and also add that to our see and then let's

just move that and just position that roughly about here and then open the interactable label component scene just

choose the root node and scroll down and in Zed index increase this to two and we just want to make sure that when the label displays it overlays all of the

other objects in our scene then back in chest right click and add another child node and search for marker and add a marker 2D and create that then for

position just grab the marker and just position it on the edge here so this is where we will output the rewards when we

add items to our chest and we will create a circle around this marker position where the items will randomly be output now let's create a feed

component so go to scene new scene choose other node and search for area 2D and create that then F2 and call this

feed component and click save and go into scenes components and save the scene here then right click choose

attach script and create it as feed component script and create that then scroll down and for the Collision layer

for Fe component in the layer properties just open this and choose object and then just turn off ground and for mask

we need to add a new item so go to edit layer names and for layer eight we will call the layer food and close that and

then select option eight for the mask and then in the feed component script put class name feed component then

signal and pass in the area which is type area 2D then back on feed component in the inspector choose the nod Tab and

then select the area entered signal and then click connect and then connect that signal and then in that method call Food received and then emit area so that's

complete so head back to chest and then get the feed component and add it to our chest go back to 2D View and then right click ADD child and search for a

collision shape 2D and create that and then for the shape choose circle shape and then let's just change the color and we can leave the size as it is so right

click on chest and choose attach script and save this as chest script and click create so our first parameter is for

balloon scene equals preload and choose game dialogue balloon scene then variable corn harves scene and choose

the Corn Harvest scene here then preload the Tomato harine then let's add an export variable which is dialog start

command which is type string then export food drop height with a default value of quter then export reward output radius

with a default value of 20 and then export output reward scenes which is an array of packed scene then click and drag the intractable component and then

hold control and then add the interactable component as an unready variable do the same for animated Sprite

2D also for feed components then click marker 2D and just rename this to reward marker and then click and drag and add this as

an unready variable and then get the interactable label component and add this as an unready variable too then add

variable in range which is a b and then variable is chest open which is also b as well and then let's begin by creating

a function and overriding the ready method let's grab the Interac component and register the signal interact will

activate it so connect that so let's say function on interact will activated and just return void for now and then copy

that method in our connect function here and then when the player walks into the interactable area we want to just say interactable label component and then

sure and then we want to say the player is in range of the interactable area and just set that for truth so get the interactable component again and

register the interactable deactivated signal let's connect that and say function on interactive or deactivated and return vo and in this method say

interactable label component and then hide that and then say in range equals false and then just add the method to our connect function then back in the

ready method let's just hide our interactable component when the scene loads so let's create a test scene for our chest go to

scenes test folder and let's just open the test scene Collectibles and let's duplicate this scene and call it test

scene object and chest and duplicate that let's close that scene and open the test scene objects chest then in this

scene let's just rename that to test scene objects chest and then delete these nodes here and then go to

scene UI and just attach the game screen and then save that scene then back in scenes objects and chest folder let's just drag a chest onto our scene here

and then let's run the current scene and with the player let's approach the chest so we get our notification icon here and press e on the keyboard and nothing's

happening because we need to register our event let's just close that so head back over to chest and in the chest script scroll down and override the

unhandled input event and say if in range then if event do is action press and then choose sure dialogue then get

the interactable label component and hide that first then grab the animated Sprite 2D and play the chest open

animation than get the is chest open parameter and set that to true then we will create some dialogue for the chest

here let's just test that let's go to test scene objects and chest and let's just run our test scene so press e on the keyboard and the chest opens let's

move away from the chest and the chest is not closing so let's close the window and fix that so backing on interactable

deactivated which should say if chest is open then play the chest close animation then we can set his chest open back to

false and then hide our label component and then set the in range back to false Let's test the scene so approach the chest press a and the chest opens and

let's move away from the chest and it now closes so when we interact with the chest let's sh a dialog balloon and then

communicate with the chest so go back to unhandled import and say V balloon which is type base game dialog balloon and

then get the balloon scene from here and then instantiate that then get tree and the current scene and ADD child and then

pass in our balloon instance then call balloon. start and then we'll load some

balloon. start and then we'll load some dialogue script here and then passing the parameter dialog start command and we've declared that parameter here so

for this dialog script I'm going to do something a little different because when we place the chess on our game we can have multiple chest so I'm going to

create two pasture boxes one for the cows and one for the chickens so when the dialogue starts we want slightly different dialogue let's just scroll back down to here and let's start to

create a script file which will work with this so head up to the the dialogue folder and then select the conversations folder and then choose the dialogue

option here at the top and click new here then open dialogue and conversations to save our file here and call it chest and click okay so I'm just

going to remove this default dialogue from here and then to start this section of dialogue I will call this start C

pure box then I'll use p box and then open square brackets open square brackets again and use these three tokens hi hello and howy which are

chosen at random every time the dialogue loads and then say your animals are hungry then pass your box again and then ask the question would you like to feed

your cows and then let's create those options so if the player chooses yes then myw will respond yeah let's feed my cows and then then we can say no and

Marlo will respond no I don't need to feed them I have enough milk so that's just a simple dialogue for the chest and when the player presses yes we will call

a function here to perform some actions in our game now select all of the dialogue and copy it and then paste it again and this time we'll make some

modifications for the chicken pasture box so we'll call it start chicken pasture box we can keep the first line and then just change this to say

chickens and then for the yes option we can say yeah let's feed my chickens and then for the no option no I don't need to feed them I have enough

eggs so now this is complete let's go back to our chest scene and open the chest script and in the balloon. start

function we can now load our script so choose the chess. dialog script and and then let's head over to our test scene go to the 2D View and let's just scroll

in let's just reposition this chest here and then go back to scenes objects and chest folder and drag another chest onto our scene let's just rename these to cow

pasture box and then chicken pasture box then we need to set the dialogue start command go back to dialogue and the start command is this here so for the

cow pure box just copy that and set that here go back to the dialog script and get the start command for chicken pasture box then click on the no and

let's just set the command here too now let's run the test scene so let's approach this chest here and press the E key so we can now see the balloon for

this and as we go through the dialogue let's just say yes for this so would you like to feed your CS yes yeah let's feed my cows and then PR the space why let's

just test that the dialogue is different for this pasture box so how do your animals are hungry would you like to feed your chickens say yes and then

let's feed my chickens so that is now working what we now need to do is for the player to collect the Harvest Collectibles and then give them to the

pasture bot and that will then feed the animals so go back to dialogue and we need to add an action after the yes option so if we have a look at what we

have done for guide we've got the game dialogue manager and an action here so let's go to scripts globals and then game dialogue manager and then create a

new signal call feed the animals and then create another function which is action feed animals and then call that signal and emit then head back to

dialogue and in the chess dialogue in the yes option write do game dialog manager. action feed animals and in the

manager. action feed animals and in the start chicken pure box dialogue in the yes option let's do the same then head back to chess and open the chest scrip

and in the ready function get the game dialogue manager and the signal feed the animals and then let's connect that let's just scroll down and after the

unhandled input event create a new function called on feed the animals and the return type is void then scroll up and add that to our connect function

then scroll back down to un feed the animals method and say if in range and pass and then let's just create another function called trigger feed Harvest and

we're passing the inventory item and a scene so back at the top of the script we are preloading the Harvest scene and the Tomato Harvest scene so we just

scroll back down to un feed the animals we can then call this method and for the first parameter set this to corn and then corn harves scene then back in

trigger feed Harvest method let's first get a hold of the inventory then say if the inventory does not have the item then just return from this method and if

it does have the item let's carry on with the function so then let's get the inventory item count for that specific inventory item type type and then create

a for Loop and we can say for index in inventory item count then create another variable which is our Harvest instance equals the scene which we are passing

into the function instantiate the scene as n 2D then Harvest instance Global

position equals Vector 2 which is the global position of the chest dox Global position of the chest again doy minus

the food drop height which we have declared again at the top here and say get tree. root. addchild and then pass

get tree. root. addchild and then pass in the Harvest instance and create another variable called Target position

equals the global position then another variable called time delay equals and then call the Rand F range function and

for the first par parameter set this to 0.5 and the second parameter is 2.0 then call await and get tree. create

a timer passing the time delay variable do time out signal and now we are going to create a tween so say for tween

equals get tree dot create tween then say TW TW property and pass in the Harvest instance and the first prop

property to interpolate will be position and then passing Target position and the duration is one then twe got tween

property again then Harvest instance then the property scale then use Vector 2 and we'll say

.5 .5 for a duration of 1 second and

.5 .5 for a duration of 1 second and then tween twen callback Harvest

instance. Q free but take off the

instance. Q free but take off the parentheses here and then that will PE free our node from the scene so the

tween here will interpolate these values one after another so they are not called in parallel we are calling these actions

sequentially and now we need to remove an item from the inventory to go back to scripts and globals and open the inventory manager script and let's add a

new function called remove collectible and pass in the collectible name and the return type is voided then copy and paste this code here in the add

collectible function and just paste that here and then just change these values so we want to say zero for this one and instead of plus equals 1 we want to say

minus equal 1 to deduct it from the inventory and then just click after the L statement and add another if statement here and then tab that in so as long as

we still have items in the inventory then we can remove the item let's just save that then just go back to the chess script and then call inventory manager

dot remove collectible and then pass in inventory item so we're now ready to test the scene so head to the test scene objects chest scene and go to 2D View

and now I'm going to add some scenes to our test scene so to test the fher Bots I've just added the Harvest Collectibles directly to the

scene I am not worried about the interaction with the tile map to create the till dirt tile and then grow the crop because the output is just the

Harvest collectible and then adding that into our pasture B so let's run this currency and I will collect these first so the crops have grown and the output

is this Harvest so we have two coin and two tomato let's just approach the Box press the E key and go through the dialogue and choose yes now when I press

the space bar now let's just see the animation with the tween so we've got the corn the tween is now performing and it is gone through the position of the

tween then the scale and then Q freed so let's move away from the pure Boot and let's do this again let's press the E key so we've got

two corn here let's press the space bar say yes and the animation is working and then the scale and Q3 and then if you check the inventory it's gone from two

back to zero so let's just add the update for our tomato but when we feed the paser bot let's outpour milk for the

cow pasot and then eggs for the chicken pasot let's close that so head back to the chest scene and open the chest scrip

and to solve the issue with adding tomatoes in the on feed the animals method use function trigger feed Harvest

with the string tomato and then pass in the Tomato harvesting which has been declared at the top of theen script now let's head to the 2D View for the chest

and when we feed the Harvest items to the chest they start about here and then they'll drop down into the chest and we need to interact with our feed component

and this Collision here so let's go back to the chest script and at the top of the script in the ready method after we

connect on feed the animals get our feed component then get the food received signal and connect let's scroll down and

at the bottom let's create another method called on food received and pass in the area and return type void then scroll up to the top and register that

method in the feed component signal here then scroll back down and just say pass here for now and then create a function

called add reward Cene and just put pass there then back in on food received use

call deferred then add reward scene say for scene in output reward scenes and say V reward scene is a type no 2D

equals scene do instantiate and then on this line we need to calculate the random position for our award let's

create another method which is function get random position in circle and we'll pass in the center point and a radius

for the circle then say angle equals R function multiplied by T which is 2 * pi

then V distance from Center equals and then use the square root function and then pass in the Rand F function and multiply that by the radius we are

passing in then say for X which is an integer equals and then get the center point and the x of that then add the

random distance from the center which we've just calculated and then use cosign and pass in angle here then for y

is integer equals centery plus the distance from Center which is again random and then cosign an

angle then let's put these two variables together and create a vector 2 I and just pass in X and Y and return that then back in the add reward scene

function sove our reward position which is type Vector 2 equals get random position in circle then grab the reward

marker which is here get the global position of that and pass in the reward output radius then get the reward scene and set the global position to be the

reward position then get true and get the root and then add the child and pass in the reward scene so this is why we're using C defer to make sure

that the scene is added in the idle time so now head back over to the test scene and choose the cachi bot and go to the 2D View and we now have a parameter in

here called output reward scenes so just click that and then click add elements then go to objects and in there we have

the milk scene so so add the milk scene to the cow pure box so when we then get the rewards it will output the milk scene let's now click the chicken

pasture box and then for output reward scenes just click that and add element and then add the egg scene now click back on the chest scene and go to feed

component and just check the Collision layers so we said that the Collision layer that it's on is object and it's looking for food items so head back over

to scenes and objects and in the plants folder open the Corn Harvest scene and open the Tomato harving let's just click on collectible component and let's check

the inspector so the collectible component is an area and is on the collectible layer now we can still modify the collectible component just

for the Corn Harvest so don't open the scene and add the modification inside it as it affects everything that collect able component is attached to however we

are using these default values but for this specific scene we can also add a supplement value so let's just put it on the food Collision here and save that

then open tomato Harvest and do the exact same here so go to Collision and layer and choose number eight for food and then go back to chest because the

feed component is listening for items that are on the food player now let's go to the test scene and let's run our test scene so I'll let the player collect

these Harvest items and then approach the cower box press the E key and then enter to pass through the dialogue text and then click yes and we still got two

corn and two tomato then the the harvest falls into the pure box and then we can collect the milk items and the milk items are now in the inventory so let's

now collect the Harvest here and add this to the chicken box but in this pasture box let's go and say yes and then feed the chickens now let's collect

these eggs and this has also updated the inventory let's close the window so back on the testing objects chest let's just zoom out and let's just make a modification to the emotes panel so that

when we collect the items we show another animation here so go to UI open the emotes panel and then the emotes panel script then get the inventory

manager and say inventory change and then connect that method then the first function is on inventory changed and just pass that into the connect method

then say animated Sprite 2D and then play the emote 7 excited animation then get the game dialogue

manager and register to the feed animals signal and then use connect then create a function on feed animal animals and then play the animation emotes 6 love

case then copy on feed the animals and paste that into the connect method click the test scenes objects chest scene go to 2D View and run this

current scene and then let's just look at the animation here so let's just pick up our first collectible and the animation now changes let's do the next one and the last one and then let's feed

the chest and say yes and then we get the love kisse animation let's just close that window and then let's head back over to the scenes objects and chest folder and open the chest scene

then right click the chest Nord and change type and search for static body 2D and change that type then right click add a child node and search for a collision shape and then create that

just drag the Collision shape to be below the chest then for the shape proper choose new rectangle shape 2D and zoom in and then just cover the chest

Sprite then click the Collision shape under the interactable component and just change that color to distinguish it from the

Collision shape on the chest then click the chest and we'll leave it on collision layer one and this will just prevent our player from walking through the chest now let's go back to the test

scene and just run our current scene and the player cannot walk through the chest and that brings us to the end of this tutorial on how to create some custom pasture boxes to help feed the animals

when you collect the Collectibles you can then put them into the pure bot and modify your inventory and then output some [Music]

rewards I will show you how to create your first level using all of the game objects and subsystems from the previous tutorials in this series you will see

the benefits of isolating those components and creating all of those test scenes up front over the tutorials we have created many different test

scenes that allow us to create all the different subsystems the game components and Mechanics for our game and these test scenes have allowed us to isolate

all the different behaviors and then use them in isolation this allows us to make sure that our different game subsystems are working and before we create our

full level we can always make sure that a game item is behaving correctly when we start to create levels sometimes these subsystems may stop working so

it's always good to go back to a test scene as a reference point to see if that game item or subsystem is working as it previously was expected let's

begin creating a main scene and then we will create a level and in this level we should be able to quck quickly create the tow Maps add the game objects and

quickly set up this scene with all of the subsystems which we have created throughout the tutorial Series so head over to the scenes folder and create a

new folder and call this levels and now let's create a main scene so choose other node and then choose

node itself and then create that no and rename this to main scene and then save the scene scene to go into the scenes folder and save the scene here now right

click main scene and add a child node and search for node 2D and select this node here then rename this to level root

then go to the scenes folder and UI folder and then just bring over the game screen and just attach that to the main scene then go to the components folder

and drag on the day and night cycle component and just put that below the main scene and just for now let's just disable that and go to scene new scene

new 2D scene and we'll call this level one and save that and go into the scenes folder and levels folder and save that scene here then head back to main scene

and then drag level one scene and place inside of level route then head over to project project settings and in the Run option let's load our main main scene so

go to the scenes folder and choose main scene and open that and then close and now we can start to use the actual Run game button throughout the tutorials

we've been just using run current scene because we've been taking the test scene approach so let's just run that now and you can see we've got our UI and now we

just need to make the level let's close that then head back over to level one and then go to scenes in the test scene folder and open up test scene TW map

layer y sort and just right click and copy the game TW map so copy this node and then go back to level one right

click and let's just paste that so we've got all of these tilemap layers and this makes it easier because everything is already preconfigured so let's just

clean up some of the layers so go to undergrowth and let's just erase everything on that layer then to overgrow growth let's do the same for that and then for

objects let's just remove those as well then head back to main scene and go to scenes and characters open the player folder and bring the player onto our

game then move the player Nord so that it sits just above game screen and Below level routs now head over to level one and I'm going to start creating the

level going through each of my tilemap layers one by one I will speed up the video so that you can watch the process of me creating the level and then you

can do something similar

[Music]

[Music] [Music]

[Music] [Music]

so I'm back in my test scene because when I zoom in I just want to see which assets are for my undergrowth layer and

which assets I would like for my overgrowth layer so I can just confirm that because we've configured y sorting so I'm confident to choose these Assets

in my overgrowth layer here so I'll head back over to level one choose overgrowth and I can start to choose the assets for this layer I'm happy with the water

layer and the grass and the undergrowth [Music] layer and now I'll go to the scenes collection and for objects I will start

to add the trees and the Rocks which the player can chop and mine [Music]

[Music]

[Music]

[Music] and now I'm ready to add some houses to

the level and even though I've added them to the scene collection I'm going to add them manually to my level instead

so on game tilemap I will add another child node choose node 2D and rename this to houses and then in the scenes and houses folder and just drag the

house directly to the scene and then just Nest this under houses [Music]

now let's head back over to main scene and then just test this let's run the scene and let's add a camera to the player so I'll just close this right

click the player ADD child Nord and search for camera 2D and and just create that and then run the scene again and

let's just check why sorting okay so we just need to configure some of the nodes for the level and the game container so let's just close that now you can always

go back to the test scene and then run that again let's run the test scene and we know that wire sorting is still working let's close that so let's just

check what we need to configure in the level so in the game tilemap we've copied over from town map layer node so this is

already configured for us so let's just check level one route Nord so let's just enable y sorts here because we have

nested NDS with Y sorts and then let's go back to main scene and level one is contained in level root so let's just

check level root and then enable wi sort here as well and then the player is also wi sort enabled now there is one more

node to configure but I'll just run this and you can see that wire sorting still doesn't work so just close that so add another child node and search for node

2D and choose that node and place this above level root and rename this to be game root and place the level root on

the player inside of game rot now these two nodes are wire sorted so we need a root nod that contains all of the wi

sortable nods and then make that also wire sort enabled let's run the game and then let's just move behind our assets

so y sorting has been enabled the next step is to go to the test scene NPC chicken and copy the

chicken's node so copy that and head over to the level and then just paste that node and then then I can just readjust these markers and then select

the chickens and just move them into this location and then click bake navigation polygon then head to main scene and just run this

scene I'll just close that I'll just head to the chicken scene go to navigation agent and I'll just turn this debug off then I'll head back to level

one and zoom out and I'll add a c region here to go back to test scenes I'll open tesene NPC cow and I'll copy this cow's

node here so I'll copy that go back to level one and then paste it in my level and then I'll just select the navigation region and bring that over here and zoom

in and just adjust the markers and then click bake navigation polygon and then I'll select the calls in the scene just zoom out and just reposition them inside

of my navigation region then I'll just open a Calene and I'll just make sure that the debug is disabled so that's

okay and then let's run the game one more time and then I'll just turn visible Collision shapes off and run my game so we've got the cows in this

region and the chickens then click on the chickens node and scroll down and turn on why so it's enabled and then for

the cow's node do the same for that then open the chicken scene and click the chicken node and then turn on why sort

enabled go back to level one and for C open that scene select C and do the same here here and then head back to level

one and then just run the game again so this fixes our wi sort with the cows and then let's just head over and check the chickens as

well that's looking okay I'll close that then I can copy this again and just paste it one more time and then I'll drag that region over

here and then bake the navigation polygon and then go to our test scenes and open MPC navigation and in these

test scenes we are cutting out the Collision shape so if I go on to objects we have the group on here and in the previous tutorial I've shown how to

subtract the Collision shape by using the correct group name let's just click the group name and let's apply this group so go back to level one open up

the tilemap and click objects and then just tick navigation polygon Source geometry group let's save that then the chickens as you can see cuz we've copied

and pasted it and I've resized it we need to make this unique so for this one let's just right click and make unique

then I'll resize this again because they were pointing to the same polygon shape I'll bake that polygon and select this

one and bake that one and it's still not subtracting and this is because for Source geometry mode I need to say group

explicit so let's choose that one then this one open that Source geometry mode group explicit and and then click on

this one and open the navigation polygon and do the same here then for each one just bake the navigation polygon again and that just fixes the Collision shapes

then I'm just going to highlight these chickens again and just drag them over and pop them here let's zoom in and then just start to rearrange them a little

bit more so and I'll zoom out and in this scene I'll go to my scene's characters foldo and in the guide folder let's bring over

the guide here and the guide will start the game by giving the crop seeds to the player and then the player can kill the land here and grow some crops so let's

just test the game again and go to the guide press e then we get the dialogue balloon and then we can go through the dialogue and take the crop seeds so the

two bar buttons are now enabled so let's just see if we can create a crop field so I choose the tilling tool and at the

moment we are not getting any field so let's just close that and if we look at how we game tilemap we are missing the till dirt tilemap so back to the test

Fields folder and let's open test scene crop Fields till dir and copy the tilled soil layer so copy

that go back to level one and just paste that into our game tilemap and just place it above grass and for now I will remove

the save data component because I'll add that later when I create the main menu so I'll just remove that for now then I'll go back to testing crop Fields till

dirt and we need to copy the field cursor component and the crops cursor component and we need to copy the field

cursor component and the cropped cursor component to copy these two Nords go back to level one and paste them here and then just move them above the

chicken's ND here so let's just click on field cursor component then for the grass tower map let's assign the grass P

up here then for tilled soil pick our tilled soil tilemap layer and then for the crops cursor component we will pick our tilled soil tilemap layer to now

let's run the game and approach the guide and we'll go through the dialogue we'll take the crop seeds and then let's till the land and I'll plant two corn

crops and two tomato plants and let's then water them and then let's speed up the time and as you can see the crops are

now growing and then let's collect the crops and the inventory panel is updating to

Let's close this and then head to scenes objects and chest and let's add the chest here for the cows so for the cow

pasture box let's go back to the tessing and open tesene objects chest and for the cow pasture box we've got start cow

pure bot so let's just copy that actually we can just copy the scene from here as it's preconfigured go back to level one and then just paste it here

and let's just move that to this location go back to Tes scene objects chest copy that go back to level one

scroll in and paste node here now Run the game again and let's speak to the guide take the crop seeds and then let's

just build the crops let's plant them and speed up the game and water the crops then let's collect the Harvest and

then head to the cow pure box and then say yes and then collect the milk and we've then got four milk here so we have

tested growing crops and feeding the cows let's close this and now head over to main scene and just turn on the day

and night cycle component and then test our game and then let's just speed it up and as you can see that is now working

okay so I have now completed creating level one and it's been really useful to just go back to the test scenes to just see how a certain component has been created and because I've created it in

isolation I'm able just to run the test scene again just to clarify one or two things I hope throughout the series that creating the test scen has given you a different approach to how you may build

your game and the added useful benefit is that if something doesn't quite work in the level as you create it you can always just go back to the test scene and confirm it now that brings us to the

end of this tutorial on how to quickly build a level using all of the previous tutorials and bring all of the isolated

components together [Music] I will show you how to style and create a game main menu and load your level and

save your game data so let's begin creating our game menu screen by going to scenes in the UI folder and then

choose other node and search for canvas layer then rename the canvas layer through game menu screen and save that into your scenes and UI folder then

right click ADD child node and search for margin container and in the anchor preset choose for w then right click ADD

child node and search for vbox container then right click add another child node and search for button then rename this

to start game button and in the text WR start then select margin container again and scroll down to theme and click the

empty option and choose quick load and then load our game UI theme then in the scenes UI folder just double click the

game UI theme to open it and then add a new theme style here and let's create a custom style called game menu button and click add type cck this option here and

for base type click the plus button and search for button and then set that base type then click back on the button and scroll down and on the type variation

click this edit button here and set our custom style So Right game menu button and then click to apply that then back in the theme let's just choose this

option here and scroll down to normal click the plus button to override the item and then click entty and choose new stylebox texture then click again to

open it here in the inspector then click the EMP option for texture and choose new Atlas texture and open that then go

back to the assets and UI folder and in the atlas property bring over basic UI Sprite and then choose edit region and for the menu buttons we will use this

selection here so with auto slice selected choose this option here and click Clause then collapse the atlas texture and scroll down to sub region

and choose edit region let's zoom in and choose snap mode pixel snap and then bring in the bars to frame FR our button once the button is framed you'll see

this here and click close now right click the new style click copy and then go to press and override the Press style

right click and paste the style from normal then right click again and make unique recursive then open the style open the atlas texture and edit the

region let's zoom out and this is the previous letter to style for normal choose Auto slice and then choose this option here for pressed and click close

And because we've copied the style and made unique we don't need to edit the region for this again so sub region is already preconfigured right click press

style copy that override the hover item right click paste right click make unique recursive and click okay and open

the style open the atlas SE and edit region scroll in and choose this option here and click close right

click the hover style copy enable and override the focus item right click and paste right click and make unique

recursive and hover and focus are the same style so right click the focus style copy go to disabled override the

item right click the empty option and paste right click click make unique recursive and click okay and open that style go to the texture property and

edit the region and zoom in and we'll choose this option here let's click that and click close then collapse the atlas texture and that completes our game

button style let's head back over to the start game button and scroll down to custom minimum size and choose 100 for

the X variable and 29 or the y variable and then for vbox container choose horizontal alignment shrink begin and

vertical alignment center then duplicate the button and rename this to save game button and in the text write save right

click and duplicate the button again and rename this to exit Game button and in the text we write exit so click back on margin container ADD child node and

search for margin container and create that and just position this above the vbx container add a child no and search for label and then create that in the

text write crop tails and then choose margin container and for horizontal alignment say shring end and for vertical alignment shring end as well

then head back over to the game theme the Lord game UI theme and add another custom style this time we'll just search

label and we'll add a default style for the built-in control so just say add type here then choose this option here and override this style scroll up to the

assets folder and in the UI folder and then fonts bring over the pixel font from the Sprout LS asset and just drag

that into our fonts here and then zoom in here then click back onto our label scroll down and for font side is turn

this on and we'll use a font size of 54 now for the background for the game menu screen I'm going to create a pseudo level that will just sit in the

background so I'll go to scenes and test folder and open up the test scene T layer Y and I'm going to make a copy of this scene so I'll duplicate this scene

and I will call it game menu screen background and duplicate that I just open this this scene and just rename this to game menu screen background I'll

just remove the camera 2D from the scene and remove the game screen as well then right click the scene in the folder and say move and duplicate to open the

scenes folder and the UI folder and click move I will speed up the video as I make some changes to the game menu screen background when I come back I

will then set the background on the game menu screen we can go through that [Music]

[Music]

[Music]

[Music] so I've now finished creating my game menu screen background and and as youve noticed I've managed to flip the chicken

Sprites and you can do this by just right clicking the scene and then choosing editable children going into animated Sprite 2D and then modifying

the flip hitge parameter now let's just test the scene but as you can see the animations are now playing and the flip

did not occur so let's fix that to go to game menu screen background node and attach a script and then just create the script in the scenes and UI folder and

in the script override the ready method and just pass for now then create another function and call this set scene process mode and return void and then

get the process mode parameter and then set it to be process mode disabled and then in the ready method use call deferred and then use the string to set

this function here then go back to the 2D View and let's run this again and as you can see the animations are not playing so we Frozen the the scene and

the flip is now here and that's because using codif waits for the whole scene to be set up and then we freeze the scene if we go back onto the game menu screen

node here and then go down to process mode and set process mode on this panel the flip will not occur and that's because we need to set the scene up

first allow the flip to be applied then set the process mode so head back to game menu screen and let's just go to the 2D View and drag on the game menu

screen background in the game menu screen canvas and then just move the node above margin container let's scroll

in and now let's modify our title again so click back on label and scroll down to font color and enable that then select the font color and choose the

Color Picker and I'll just choose this color here and then for font Shadow color I'll enable that and just choose white and then for shadow offset I'll

increase that to two and for shadow offset y I'll also increase that to two let's just modify the text on the button

so open up game UI theme select game menu button and in the text option let's override the font go back to assets and

UI folder in fonts folder just bring over the Sprout LS font then choose this option here and override the font size

and change this to be 18 now let's just run the current scene and this is now complete so we can just hover over the buttons but now let's connect up the

buttons so click the game menu screen node right click and attach script and create the game menu screen script in the scenes UI folder so click create

then expand the vbox container and choose start game Bo button and in node click the Pressed signal and connect that connect that to the script and do

the same for save game button connect and create the function in the script and for exit choose pressed click connect and connect that function to the

script so let's create another Global manager script to manage the start save and exit game head to the scripts and globals folder and right click and

create a new script and call this game manager and create that open the script and go to project project settings

globals and open the game manager script open that and add that to the game and close in the game manager script create

two functions called start game with a return type of void and exit game with a return type of void then back in the scripts and globals folder right click

and add a new script scpt and call this scene manager and create that then open the scene manager script and then go to project project settings and in globals

select the scene manager script and click open and add that then click close And for the first variable call this main scene path which is a type of

string and then go to scenes and right click main scene and choose copy PA and then inside the quotes just paste that path for the next variable we need main

scene level root path which is also type string and just open main scene and right click level rout and copy node

path and paste that here and then at the front say root forward slash main scene and forward slash again then create

another variable called level scenes which is a type of dictionary equals and for the first parameter we'll say level one call on and then go back to scenes

folder and in levels for level one right click copy path and paste that path in those quotes then create a function and

call this load main scene container which is a return type of void then in this function say V node which is type

of node load and pass in main seam path Dot instantiate and then say if node is not equal to null then get tree do root

and then add child and pass in this ND then we need another function called load level and pass in level which is type string and return type is void then

say for SE PA which is typ string equals level scenes. get level if SC paath

level scenes. get level if SC paath equals null then just return from this method or level scenes which is type of

Nord equals load then pass in SE PA and then instantiate that and say our level root is type of node equals get node and

pass in the main scene level root path here and say if level root is not equal to null then V nod equals level roots.

get children and then if ND is not equal to n then we can say by nde which is of typ n that's in the nods collection then

we can just Q free anything that's registered underneath the level route node then we get the level route again and we add the child so then add level

scene so now that we've set these functions up we'll put a break point in line 18 and a break point at the start of load main scene container now head

back over to game manager and in start a game get this seam manager and load the main seam container first so this will

load first and then once that's loaded we want to load our level and the level is level one so back in seam manager we

defined a level here in the dictionary so when we pass level one it will get this path here and it will then replace whatever is here so even though we have

a level here now when we run this Cod it will go to this root node remove this and then add whatever is in the dictionary so go back to game manager

and then for exit game we can just say get tree Dot and then quit and that will just end the game so during development this is still quite flexible because we

can still add na levels to this and then just run the current scene and test it out and then when we run the game we can use it as a real game and just open the

scene manager script and for the main scene level route just prefix route with a forward slash and then run the game Let's click the start button and go into

load menu scene container and then choose remotes here and let's just see what happens here so we've got our main scene now added to the route and then

let's load the level so let's open game rout here and level rout and that's what's currently attached to level rout and that was done during development so

let's just load the level scene so that's level one so we have a level root and then let's just get the nod from

Level root and then Q free that ND then let's add the scene and then F12 let's go back to remote and you can see that the previous node has been removed and

we've added level one here we still have our game menu screen here so we do need to remove that to go into the UI folder

and open up game menu screen and when we start the game we just want to Q free the game menu screen let's restart the game and let's just check that so we

click Start then we load the main scene go to remote then we load level one so I just step through that quickly and then we come out of there we still got the

game screen here and then let's Q free that now and F12 so in the remotes we just have our main scene and we have our

game here so now let's add a key input binding so that when we press the Escape key we can go back to the main menu so head over to the game manager

and then go to project project settings input Mark and add a new action called game menu and add that and scroll down and click the plus button for the input

and press the Escape key and click okay and then we can click close then back in the game manager script create a variable called game menu screen and

preload the scene from the scene's UI folder then create a function and override the unhandled input event and

say if event do it action press and passing the input game menu then let's create another function and call this sh

game menu screen and the first variable will be game menu screen instance equals the game menu screen here do instantiate

then get the tree and then rout and add the child and pass in game menu screen instance then copy the function name and back in the unhandled input event just

paste that function underneath the is action press method so now let's run the game Let's click Start and when the game starts press the Escape key on the

keyboard and it should take us back to the m menu so let's perform some more tests let's just press start again and as you can see we have an error when we

try to get the player from the first node in group let's just go to the remote and we currently are trying to add the main scene to the tree and as

the scenes are being created this scene is causing an issue here and this is because as we add the level using the scene manager the scenes get created and

we most likely need to wait for the first process frame to complete and then grab our player from the first noing

group so to fix this let's override the ready method and wait for the tree to process the frame then after the tree

has been set up and the level is added the frame will complete and then we can grab the player from the first nording

group so let's just say play equals and then take this line here and then remove it from here so let's just do a search for any

other places where we are using the at on ready variable and getting the first noing group for the player so I'll just highlight that code and press contrl

shift and F and just have another look so we are currently in the field cursor component and if I just save that file and refresh and then we have the

situation in crops cursor component so I'll copy this code from here then go to crops cursor component and then at the top above unhandled input just copy that

code here to save the file and refresh and we've got those changes so I'll run the game I'll click Start and I'll just approach the guide and I'll test the

balloon because we do add the balloon also to the tree and I have an issue in the guide scrip where I use get tree and then current scene so I'll just

highlight this cord and then press control shift F and just have a look at any other instances so for this fix I

will change current scene to say root so it's get tree. root child and then can refresh and in the chest script let's

just go to that location and I'll make the change here as well so let's test the game again I'll click Start so I've activated the balloon for the guide I'll take crop

seeds and growing some crops and I'll collect the Harvest so I'll feed the cows and I'll say yes and the Harvest is now being added to the cow pasture box

so this is looking good for now I'll close the window so head back to game menu screen and let's connect the save button so on save game button press get

the save game manager and then all save game and then I'll go back to level one and then in components I will get the save level data component scene and

attach it to level one and I'll just put that above game to Mark and in the till soil T up layer I need to add a save

data component so I'll just attach that there and when I create my crop field I need to then save that data resource so I'll go back to the resources for folder

and I'll just attach the T map layer data resource so that we save the T map layer cells so I'll go back to game menu screen and open that script and I'll put

a break point on the unsave game button and let's run the game I'll click Start I'll take the crop seeds and I'll just save this small patch of crops I'll

press escape and then save and I'll just step into the save game so I've got my save level data component and I'll go into save game I'll just check the PA

that's okay and I'll check the level file name and I've spotted something strange the save name says save at node

2D at 55 game data and I'm expecting it to say save level one so let's go to the remote and look at Main scene then open

level rout and the node name is incorrect it should be level one on as we are loading this scene here I'll press F12 to continue that and it's

generated the save data file with the wrong name so back in scripts globals and open scene manager if we look at

load level in this for Loop we removing the nested nod from the level route path so back in main scene as we load this scene we clear this out here and then we

get the level roots and add the level scene now this is useful in development because you can always run current scene and test other scenes as you build the

game the problem is here when we Q free we then add the child straight away and what we need to do is to wait the Q3 to

finish then process the frame and then add the child to the tree and the fix is to await process frame and then add the child I will now Run the game and click

stop s and then go to remote and if I just check level rout I've now got level one under level rout so we'll test the

save again I'll run the game I'll start and I've made a crop field I'll press escape and then click save and I'll step into the save method I'll go into the

save level data component and now we have the correct file name and then I'll continue and I now have the correct save game game data file which is for the

correct level so now that we are saving the file let's now load the file so let's head back to game manager and when we start the game after load level I'll

get the save game manager and load the game and I'll just put a break point here and let's run that and click Start I'll just step into load game and we now

have the save level components and we'll just load that but however the tows are not being created so let's just close that and here let's await the process

frame and this will wait for the scene tree to be created and then we load the data and then reattach the towels and create the crop scenes let's run the

game again and click start back into load game and then F12 to run and you can now see that the crop field has been

recreated so I'll run the game I'll click Start I'll just move the player I'll press escape and I'll click start again and as you can see the scene has

duplicated I'm just going to show you something if we go to remote we've got main scene here and Main scene has been added again and we just need to fix that

so stop that so let's head back to the scene manager script and in the load main scene container we just need to say

ifg tree. root has no and pass in root

ifg tree. root has no and pass in root main scene then just return and don't create the main scene again and add

another variable at the top called main scene root path and then just pass that into here I'll run the game I'll click Start let's check remote we have our

main scene I press escape and then start again and that's now resolved everything there when we first run the game this button should be disabled then when we

start the game and press escape to come back to main menu this button should be enabled pause this so head over to game menu screen and select the save game

button and just add that as an unready variable in our game menu screen script then override the ready function and get the save game button and set disabled to

tr and then after that let the focus mode to be focus on then I'll run the game so the button is disabled but we just need to update the style so that we

can see the text so head over to scenes and UI folder open the game UI theme choose the

game menu button and for the font color just override that color and choose a gray I'll run the game and now we can see the text so now I'll go to the save

game manager and I'll add a variable called allow save game and I'll make that a b then back in game manager after load

game and loading the scene I will set allow save game to true and then go back to the game menu screen script and then

assign that value to the disabled value and then just invert the value because allow save game will be false on start talk and then for Focus mode we'll get

the allow save game parameter and say if true then control. Focus all else control. Focus none so let's just test

control. Focus none so let's just test that so it's disabled on start up let's go into start then escape and it's now

enabled now let's create our own custom mouse cursor for our game go to scene new scene other no and search for node

and click create and rename the node to mouse cursor component let's save that scene and go to the scenes folder components and save it as mouse cursor

component and click save and attach a script and save the script as mouse cursor component and click create as well then in the script at export

variable cursor component texture which is of type texture 2D then override the ready method then get input and set the

custom mouse cursor function pass in the cursor component texture parameter then input Dot and set cursor Arrow so head

over to m scene go into the components folder and drag the mouse cursor component onto the main scene and just place at the top then go to the assets

folder in UI and drag the mouse icon PNG into the cursor component and we downloaded this previously from the Sprout lands UI asset pack then head

back to game menu screen go to scenes and components folder get the mouse cursor component and add it to the game menu screen then position this at the

top and then go to assets and UI folder again and then bring the mouse icon and drop it on the cursor component texture so I'll run the game and you can see the

mouse cursor has now changed and that brings me to the end of this tutorial on how to create a game main menu and add your levels to a seam

manager and then start them in your game as you can see we've had some issues around process frames but I have gone through them and explained how the scene tree is being constructed and hopefully

this will help you resolve any issues in your games in the [Music] future I will show you how to use the audio bus layout in your game to play

music and sound effects I will also make an audio playtime component so that we can add a delay time to when the sound effects is being played and then loot

them so let's begin by going to scenes test scenes and make a copy of the test scene default and duplicate that and call this test scene audio and duplicate

and then open the scene let's rename the scene test scene audio and to download some free music let's head over to Ludo

Lon studio itch.io and I'll leave the link in the description and we will download on the the form and we will use this music for our game then head over

to my gsub account and in the tutorial components and scripts folder I have created a crop Tales tutorials folder

and in there I have the sound effects for the chicken and the cow so just go into the audio folder and download those four audio files I'll also leave this

link in the description below and when you download on the form music file you will see that it is a w file to open this in audacity or any other audio

manipulation software and then either select a portion of the music which you would like to use or you can export the

whole file to go to file then export audio and then export the file as an or vus file and you can either export the

entire file or the current selection as I'm doing here then go to your assets folder and create a new folder and call

this audio then go into the audio folder and create a new folder and call this music and then import on the forign music and just rename your file then go

back to the audio folder and create a new folder and call this sound effects and then open the sound effects folder and

import the four sound effects files then click on the root folder and create a new folder and call this audio then

right click new resource and search for audio bus layout select that and create that and we will call this game audio

bus layout and save that so open up the audio bus layout and we currently have one boss which is the master boss so we'll leave that add another boss and

rename this to music and add another BS and call this sound effects then go to project project settings and scroll down

to audio and buses and for the default bus layout let's change this and go to the audio folder and select the audio BS

layout which we've created here and open that and then close I will just right click the audio folder and just set the folder color to red then inside the

audio folder right click create a new folder and call this music and right click and create another new folder and

call this sound effect now go to scene new scene and other node and search for audio stream player 2D and create that

node and rename it to on the for music and save that scene in audio and music folder and save then before the stream

property go back to the assets folder and in the audio folder and the music folder just bring over on the for music and drop that into the stream property

then scroll down and for the bus property change this to music so view each boss as a separate Channel and you

can then add effects to each of these channels now I will not be covering the effects in this tutorial how ever you can have different sound effects buses

and then modify or manipulate the audio further using some of these effects so for on the for music I will use this

channel go to scene new scene choose other node and choose audio stream player 2D again and create that and

rename this node to chicken clock one sound effects and then save that and go back to the audio folder and in sound effects folder we'll save that scene

then head back to assets and sound effects folder and bring over the chicken clu one sound effect and put that into the stream property and then

for this sound effect go to the bus property and change that to be the sound effect bus now I will create three more

audio stream scenes to cover these three other sound effects and and I'll speed up the video so let's head back to testing

audio and then in the audio and music folder let's drag the on the form music scene onto our test scene and then just

move this to the top and then select autop player and then let's run our test scene so that is playing our music let's stop the

scene and then for our sound effects let's just go to scenes characters and cow and add the cow to the scene now I

won't add the cow move sound effects directly to our cow character because I want to control when I do play that

sound effect so I'm going to create a new component so go to scene new scene and other n and search for the timer n

and create that and rename this to audio playtime component and then save this component into scenes and comp components

folder then right click and attach a script and just call it audio playtime component and create that script then create an expb variable and call it

audio stream player 2D which is type audio stream player 2D and then in the inspector head over to the node Tab and choose the timeout signal and then click

connect and just connect the on timeout function and then just grab the audio stream player and then just call the player method then head back to the

Calene then go to the audio and sound effects folder and add our CMU sound effects then go to components and then

add the audio Play Time component and then go to the inspector and for the audio Play Time component just assign

our sound effects then in wait time we can just put this to 5 seconds and then click auto start now let's head back to

the test scene and let's just run our test scene so we now have the music first playing and then the sound effects has

just played so the next one should be in 5 seconds and that is now working so just head back to the audio

playtime component and as you can see we can now just mod modify the weit time using the timer and internally it will call the audio stream player so this is

just useful for many different types of sound effects that you may want to run in a loop now before we add the chicken sound effects just go back to the audio

folder and open the game audio bus layout and let's adjust the volume for music and the volume the sound effects now we can just reduce the volume for

the music on this channel here and then I'll reduce it also for the sound effects as well so head over to the test scene again and run the

scene and as you can hear the volume is much quieter for the music and also for the sound effect and that's how we can control the

volume for the different channels in our audio bus layout now head to scenes characters and open the chicken scene and then head back over to the audio and

sound effects folder now I could just add the audio stream player and if I go to components just put the audio Play

Time component on here but I'll only get the single sound effects playing all the time now for chickens I have multiple

sound effects files so I'd like to switch between them so go to scene new scene and other ND and choose the audio stream player ND and create that and

rename this to chicken clo multiple sound effect and then save the scene to go to the audio folder and sound effects and then save that then for the stream

property click enter and choose new audio stream randomizer then open the resource and add an element and go to

assets audio and sound effects here and drag the first sound effects file in then add element again drag the second one in and add the third one as well and

for waight I will just keep it the same and allow the randomizer to pick the next sound effect as and when and then scroll down and for the boss change from

Master to sound effect then head back to the chicken scene I'll remove this single sound effect so I'll just delete that okay and then go back to my audio

folder and sound effects and just drag the chicken clu multiple into my chicken scene then click audio playtime components and assign the chicken clock

multiple sound effects then for wait time I'll say 5 seconds and then click auto start I'll go back to Cow and for audio play time I'll just change this to

20 seconds as we've already heard this one then head to test scene audio and add the chicken scene to our test scene and then run the test

scene and the music is [Music] playing and we've got the first chicken sound and the second chicken

sound and then a third chicken sound from the randomizer and then we've got the cow sound effects as well so now that we've tested our music

and sound effect go to scenes and levels and in our level let's add our music go to music and then place on the form

music into the scene and place that to the top and for cows and chickens the sound effects files are already there so I'm adding music to this level because

if you do create levels in the future you can change the music for each of those levels now that the music is added to the level and we have our sound effects for the characters I am now

ready to test the game so I'll run this and I'll click Start and that is our music for the level and also the sound effects are

working and that brings me to the end of this tutorial on how to create music and sound effects using an audio bus layout and then creating a component so that

you can then manage the delay time of when your sound effects is played and that brings us to the end of this tutorial on how to make a 2D farming game and thank you for sticking with me

through this8 hour tutorial I hope you found this tutorial helpful and feel free to leave comments below if you've enjoyed this tutorial please consider liking and subscribing for more content

like this and I really appreciate all the comments supporting my channel thank you for watching