 Hello guys, welcome back to another idle game tutorial. This is episode 7 Yes, I'm really sorry that I haven't been uploading lately. I've been extremely busy with my own game and it's personal stuff and I Just expect that I will be busy for the next few weeks, especially schools coming up So today we are going to be doing progress bars So I'm not in any order. I'm just going off a list of stuff I need to do for episodes, but we're gonna be doing progress bars Which I think it's really important because some idle games are Have a lot of progress bars or loading bars It's pretty easy. Honestly. I Changed the look of the game. I inserted my own assets that I made and I just changed all the text Which is a simple going to your text and then changing the font and the size and the stuff and changing the buttons is dragging an image that you that you put in your assets It could be a JPEG or a PNG or even a Photoshop So a PSD file and you should drag it into the source image right here and it changes it So I can literally make it like that However, we want this This one right here These assets are not free to use, but you can try making them on your own. I'm just not gonna put a link Anyways to the tutorial, we're gonna be doing progress bars for these click upgrades since I really don't have anything specific to use it from and Yeah, so I'll be doing that and some good progress bar practices So we're gonna go to my canvas. We're gonna create some Progress bars. We're gonna start with one start easy So To make this a progress bar. We need to need to oh Yeah, we need to give it an image right here. So we're just gonna use this one right here Yeah, that should work. We'll use this one called bar fill which you can use any you can just use a square You just need an image in order to access it We're gonna put it right here under this upgrade. There you go. That's fine. And we're gonna call this Click upgrade one bar Okay, so we changed the image type to fill and Right now it's filling in a circle or a radial 360 We're gonna change that to horizontal. So then it should fill from left to right But that's up to you. You can choose whatever you want So it's kind of awkward not having a background here. Basically, just create another image This is going to be the actual progress bar and this is going to be the background because this image right here is Higher than the one that's inside this if that makes sense. So if I make this BG And I drag the bar into the BG This image will be in front of it So we'll give this one a background image that I already have called bar BG and Well, oops before you do that make sure they're the exact same size and then drag the BG in the bar and Make sure the anchor for the BG is stretched. So no matter what size this is it will stretch along with it anchors are pretty important and Now if we change the fill amount for this And we have a background Sweet it was pretty easy We'll keep that there Okay, so now we're going to get to the coding part of this. So I'm gonna open up my script So something new you've made notice is that Why am I using Unity 2018? That is not okay. That's whatever. It's fine I'm supposed to be using Unity 2019 since I finally updated everything and I'm now using I'm using Ryder Which is by JetBrains? It's not free, but I'm doing a free trial for now And I really like it and I think you guys can see the fonts much better in this version In the visual studio. So I decided to stick with Ryder Someone suggested it to me If you can't see it and just zoom into your page We don't need this It's still loading Yeah, this is right. Okay, so we're gonna start with oops it's still loading in we're gonna start with episode seven So our progress bar is basically an image why is everything doing this, okay? I don't like about Ryder is that it automatically saves. Did the Unity just freeze on us? Did we lose unity already? Anyways, it's an image. So we're gonna create an image called click upgrade one Bar That's pretty much it for that And in order to change its value from the fill We use a method call dot fill amount which basically this method is a public void Fill amount and it accepts a float and only a float Like that, but we're not doing that since we already have that So to update it, we're gonna go to our update method right here. Let's just drag it to the bottom We'll do episode seven here. It's a little mess. You guys clean it up Okay, so we have our click bar dot fill amount equals x divided by y so what are we filling up? Basically the progress bar is to determine how far away is the cost of being able to purchase? So what we're gonna do is Okay, my code is freaking out right now We're gonna take coins Since that's the number that's changing and basically the capacity the percentage that we need to get is the Click upgrade one cost. That's it. It's that simple So remember we can only fill not only a float so what we're gonna do here is We need to cast this entire equation right here To float That's it. So now this will automatically convert to a float so before continue some good practices you should I should do is Since it's a float and it has a higher or has a lower number of capacity then double Anything higher than that will lose on an error and it will just completely break your code Yeah 308 so this is a float this is a double so anything higher than this number right here We'll just break your your whole thing. So how to fix that is you do an if statement So we're gonna take this right here These redundant parentheses so if all of this is Less than 0.01 since nobody can see less than a tenth of a percent Then we're going to set the fill amount to zero no matter what But If it's higher oops, it's else else if coins is greater than Let's say 10 Then we're gonna set this to one Just to be safe and our else is ill-change To whatever this is as long as it's in between 0.01 and 10 So the fill amount is based on zero to one You don't have to do times 100 to do a percent. It's based to zero to one so zero to one or zero point zero zero Two to one times that by a hundred basically it gives you the percent, but we don't need to do that All right, we have our first progress bar. We're ready to go Let's unity Do its job no errors. We're good to go So let's go to our game manager and we're going to add our new progress bar, which is the bar right here So now if we save our game That's fast And run it we should be able to see this right here. Wow. We got a lot of coins. What's the heck that is a lot of coins Boy All right, there you go. We have our coins right here See how it's incrementing as it approaches the cost Once this is max, we'll be able to see it fill up so I can change to this Let's say we wanted this to eight nine Nineteen twenty nine thirty nine. There you go That's the progress bar. That is pretty much it I'm not gonna do this for other progress bars, it's a simple copy and paste but In review basically, it's just an image you create an image and an image has a method called fill amount and you can set that from any number between zero to one and it must be a float and In order to get that Zero to one value you must divide something that you're trying to compare to So like coins divided by the cost since the cost is pretty much constant it doesn't change Unless you want it to which in our case it does But if let's say we had a progress bar that we wanted to see how the progress bar filling up to a hundred Well, clearly we would change to a hundred because that's how percentages work Like that That's all I have for this episode. It's just a really short one. It's really easy Just remember make sure you cast If you use anything else make sure like for me, I use big double for me There's a method called to double so I'll just do that and cast it But just make sure this is floats or all stings will not go well with your code Anyways, I hope you enjoyed this episode. I will try to get to episode 8 as soon as possible Thank you. Have a good day. Also, don't forget to subscribe and turn on notifications. See you here next tutorial. All right. Bye Yeah Got me in this party all up in a zone. How does Betty's trying to take away my cell phone like coming party? I've been trying to take you off my mind, but just can't get you off me keeping moving They ain't worth it. Yeah, that's what my father taught me but for now I'm going through the motions of letting go because my mind's telling me yes, but my heart really don't know your heart When I got to know it yet. I still see a glow. So we had the hottest love Why'd you leave me in the cold?