 By the end of this video I'm going to be teaching you guys how to make something like this where you can click a button and it changes the text and you add on to a main currency. I have 162 flash god damn it. Hello everyone it is CryptoGround here welcome back to another 2021 Unity idle game tutorial video this is episode one so anyways today we finally get started so if you enjoyed this video if you learned something new make sure you smash that like button subscribe to my channel if you're new and turn on the bell for future notifications of videos and live streams so here we are back with our empty layout here so the first thing we need to do is create a canvas and if you remember from the previous episode to create a canvas all you gotta do is just click this plus sign right here go down to ui and hit canvas and you can just leave it as canvas here and you can see it's very big cool tip for you guys is that you can press the f key when this is selected and it will just move you right to it oh yeah this is the empty game object i forgot to delete okay so when you create a canvas you will get two things you'll have your canvas in an event system so an event system is basically just a way to tell your canvas that you are clicking on something in there so here in your canvas you'll see that you have a few things you have a rec transform a canvas component a canvas scaler and a graphic raycaster so the rec transform is what we use to modify the size of things and obviously you can't change the values of a canvas the main canvas here but you will be able to do that with other game objects inside of it the canvas components is what controls the rec transform here so we can change the render mode to one of these three settings now you can make it a screen space camera which is where it goes off of your camera however i highly do not recommend it so you can see now the canvas is the same size of your camera however i don't recommend that so let's just do overlay personally that's what i've used in the past i think that's a common theme as well so what everyone else's uses the overlay next thing is pixel perfect so basically it's make things look sharper we don't really need it because it won't change things that much it would just use a little bit of cpu so the canvas scaler so this is something we're going to adjust so right now it's on a constant pixel size however we want to scale with this uh an actual screen size here so by default it'll put it at 800 by 600 i'm another mine i don't know 1920 by 1080 now this really depends if your game is going to be a mobile game or a desktop game so if it's going to be like a tall um mobile game like like this then i would set your reference resolution to whatever that is like 640 by 1136 like that now you want to change this now because if you start setting up your game all the interface and you start changing this it'll really mess things up okay so i'm gonna keep mine i'm gonna make mine a desktop game so this is the reference resolution and we can actually shrink this to like 1280 by 720 i think that's fine also if you hover over these things it can explain to you at least in uni 2020 it can explain you what these things are and we can leave screen match mode we can leave the match like that and reference pixels per unit i've never really had to change that but we can leave it to 100 and the grep raycaster we can leave as is so this is what actually talks to the advanced system they communicate between each other so if you click on the canvas the canvas is gonna oh it clicked there so also make sure to save very often so i tend to whenever i add something i save it just because it's become a habit and i know that i'm safe so you want to save as much as possible which is control s for windows and command s for mac cool now that we set up our canvas we can now start with the actual interface so the first thing we're going to create is a text and that will display our currency so you have two ways of doing this you can click on the plus right here and go to ui and text text mesh pro now we're not going to use the normal text because unity's text is kind of outdated and it's yeah you could do so much more with text mesh pro so we're going to be using text mesh pro and i really recommend you get into the habit of that now because because it really messes up with 4k devices if you use the normal unity text but the main way i like to do this is right clicking on the canvas going to ui and text text mesh pro so you may see this pop up here the tmp importer you just want to click on that import tmp essentials cool so now once you import it you should see your text just fine like that mess with the settings i'm not going to explain all of them you can go through them yourself and some of them should be really self-explanatory okay so now we can just drag this text wherever you want to so i was explaining one of the previous episodes that you can drag this text box by grabbing the corners and extending it like this or you can just grab the middle of it and you can drag like this and you can also move use the move tool and do the same thing here however i also like to type in my values manually in the rect transform so i'm going to put my position x at zero so we can center it and i'm just going to move this up higher and then we can also move the anchor as well so here you can anchor this to a specific side of the canvas or you can stretch it so i'm going to anchor mine to the top of the screen because that's where i want my money text so i'm going to anchor this to the top later in the series i'll explain more about how to use anchors and what all of them mean okay so i'm going to stretch this text like that and we're just going to align our text to the middle like that and in the middle of the text on the y direction so here we have our text this is new text right now i'm going to change it to something like i'm just going to do zero let's do this let's do zero flash so i'm going to use some of my old assets for this tutorial but we're going to use flash for this and i'm going to rename this text to our flash test and this will be our main currency so this will be the flash currency text so right now that's a anchor at the top so if we adjust the size of this it will always stick to the top regardless of where it is like that so next we're going to create this button so we can increment our flash by one and i'm going to go to canvas where i click ui and do button text mesh pro so now we have a button with the text mesh pro text inside it it's the exact same button except like a you need these normal buttons but except it has a text mesh pro text inside that so obviously our game is me kind of boring at first but once we get things going once we learn more we will figure things out eventually okay so now in this button text i'm going to resize this to make it a little bigger and i'm just going to do plus one flash and i'm also going to make this a little bit bigger okay so now that we have our main text and our button we can finally create our first script so what we're going to do is head to our project tab right here and go to the scripts folder that i created if you don't have a script folder already just head to your assets where i click on it hover over creates hover on create and then click on folder and then you just rename it so to create a script our c-sharp script you need to right click on scripts create and c-sharp script and i'm just going to rename this controller now the reason why i'm calling this controller is because later on we're going to start to diverge from this we're going to have other scripts accessing the controller so this will kind of be our brain of our of our game so it's going to control everything so in the past one of the issues i've had is just doing everything in one script and that's just very very very very wrong okay so we're eventually going to just split our scripts into like upgrades prestige settings data and then we're going to have the controller where it's basically like the the powerhouse of all of that it's going to be controlling everything okay so for now in our controller script we're going to be doing stuff in here so in order to add our text and our button and to get our button to actually do something let's add our text first so i'm going to get rid of all this and get rid of the first top two lines since we are not using those these are generally for creating lists which we will get to definitely later on in the series so in order to add our text we actually need to import the text mesh pro namespace in here so the namespace is basically where it just has a bunch of objects or classes inside them so like the unity engine dot ui this basically has all your text like the unity's text unity's image buttons outlines stuff like that that has all those all those components inside the unity engine dot ui namespace however we're not going to be using this right now we're going to be adding the using tm pro namespace and that is for accessing our text mesh pro text so now how do we access this text well we got to create a text mesh pro text so we just do public and then we do tmp text now this stands for text mesh pro underscore text and we're just going to name this the flash text this is our main currency text here and i'm going to explain what this public means later on so next we need to get this flash text updates so we're going to create ourselves a method so a method is where we actually do stuff in it's like a function okay so in order to do this we're going to be using unity's predefined update method and this occurs every frame so this method will be public void updates and i will also explain what void means in a different episode so now that we have update defined this will be called every single frame because of mono behavior and that comes from unity so let's just say we want to update our text okay so we're just going to put our flash text in here and to change the text we need to access the text variable or the property inside of here and i'll also explain what properties are too later on but for now we'll just say that it's a variable that we can change so if we go to our tmp text we could see that this is our text right here we can also change the color we can also change the font size and i'm pretty sure we can change the alignment too we got a lot we can change here but for now we're just going to change our text so i'm just going to set this as zero flash now obviously this won't change anything here but for now we want to make sure this works so next well we can't just hit play yet we actually have to add our script to our game so in order to do that i'm going to create an empty game object so this time i'm going to create the plus and then create empty and i'm going to call this scripts so this is going to be like a little folder and i'm just going to reset the position to zero zero zero and in here i'm going to create another empty object and this one's going to be called the controller so one benefit of doing this is that let's say i assign a script to a button if i were to turn this game object off that script no longer runs because it is basically turned off so now we know that these are always going to be on and this is going to be actually part of the game so it's kind of crucial if they're always on so now in our controller we're going to hit add components and we're just going to search up our script controller and just click on it and there you go so now that we can see that our flash text is in here so what we're going to do here is drag this flash currency text in this box there you go so now it should update on every frame however it's just going to show the exact same thing here so let's get it to do something so in here let's create a variable let's create a double variable in here so double is basically a large number i'm going to explain all the different types of variables in a different episode but for now you can just say that this is one of the biggest variables that C sharp comes with we are going to remove this zero and just do flash plus and then flash here so now basically it's going to tell us that so now basically the text is always going to equal to whatever this variable is here and then flax okay so now let's change this number let's get this button here to actually do something so how do we do that well we need to make a method for that we need to make our own this time so we can call this whatever you want to now the one thing that some tutorials did in the past is that they kind of didn't explain that you can just make these whatever you want so i always thought it had to be click in order for it to be a click button or a clickable button so now we can just call this whatever we want we can literally just call this just a bunch of gibberish here and this will technically work however i don't think this will do but for here we're just going to do generate flasks just to give you an example name now in here we're simply just going to add one to our flasks so we can do this in two different ways we can either do plus equals one or we can do flasks plus plus and then semicolon so this basically just tells us that we can just add one now you can't just add more plus pluses or anything like that this is only good if you know that you're always going to add only one it's just a little bit shorter too however if this is going to change from one to two or two to three at any point then this is one you're going to use this way for this example i'm just going to do plus equals one because i know this is going to change in the meantime so if we review our class real quick our script here basically every frame it's going to display how many flasks we have and then when we click that button it'll call this method here and it'll add flasks by one however we're not done yet let's hop back to unity so union is not going to automatically know what this method belongs to we need to assign it to a button so here we're going to go to our increment button and scroll down to our button component here and you can see the on click right here so we're going to add a method to it and it requires an object here we're just going to drag our controller in here which has the method in it and let go and then we're going to sign a function which is a method i hate how they say no function even though it's technically a method but same thing so we're going to click on known function and go down to controller and hit generate flasks this is the method that we made remember and save it and now whenever we click this button we should get one more flasks let's play this okay click click click click click click click click click cool you made a very basic clicker game now all right so we're done with episode one and episode one point one we're going to be explaining what classes are and i'm going to be creating a separate data class to store all of our variables in such as flasks and upgrade stuff and much much more if you enjoyed this video and if you learned something new make sure you smash that like button show me some support and also the more likes the better and also comment below your feedback your questions all that good stuff engagement makes this video grow and that means more people will learn how to make an idle game in unity subscribe to my channel if you're new and if you enjoy this content turn on the bell for future notifications for videos and live streams if you want to support me click that join button down below or check out my patreon in the description below anyways i hope you guys all have a lovely day or night i'll catch you guys in the next one peace