 Welcome everybody to game coding pie game platformer camera basics. This video we're going to learn how to add a camera to our simple platformer demo program. So hopefully you watched the previous video if you haven't go back and watch that. So of course I'd like to give a quick shout out to my members joining Kevin as a paddle member third month of membership. Thank you so much is Paul very much appreciate that. And thanks to everybody else who has supported the channel feel like to support channel directly click join down below. So moving on let's take a look at what we have so far. So this is our simple platformer and I can move left and I can move right. I could jump and player falls off the screen comes back to the top. So what we want to do is make it so that there is a camera following the player windows is simply as possible. What we have now would work really really well for a game like say Donkey Kong where the screen doesn't move just the player and the objects in the game. But what we want to do is we want to think like Mario and we want the game you know the background of the game to scroll and the player to kind of stay on the screen. So that's what we're going to be doing today is adding a camera. It's actually fairly simple to do. So why don't we go ahead and get started. So to understand how a camera works so let me bring that back up. Basically what we're going to do is we're just going to worry about the X coordinate for now. So we want the player to stay basically centered and when the player moves the background moves. So if I move to the left you know the player should stay in the middle but the background should move to the right. If the player moves to the right the background should move to the left because it is relative to the player's position. And again it's fairly simple to do this. Now I'm going to do this a little bit more complicated way just to give us some more options later. And to do that I want to create a camera object or a camera class. So I'm going to say class camera and this is just so that we can keep track of where the camera is supposed to be. And we're going to initialize it and we're going to initialize it with a starting X coordinate and a well we'll say with a starting object to follow. Now I could have done this with an XY coordinate but we're going to use an object. And so I'm going to call that the target. And so the one I'm going to say is self.x equals target.x self.y equals target.y. And this all makes sense in a little bit. So I'm going to hit save. And then I've created the class. So that means now I need to go ahead and create the object. So I'm going to create that after I create the blocks and I could have created it before but it's got to go after the player and I'll explain why in a second. So camera, so I'll put the little thing here, so create camera object. So the camera equals the camera and what I want this camera to do is to follow the player. So the camera in this particular game is going to be centered on the player. Everything else is going to be moving relative to that player. Now let's look at the code again. Player, where was it? Camera. So our target is the player. So we set the cameras x-corded to the target's x-corded, we set the cameras y-corded to the target's y-corded which of course is the player in this situation. And what we have to do now is to update our render method because all the magic is actually going to happen here in render. So I'm going to go ahead and put player.render player and it's a little redundant because the player is actually following itself. But we can change that, we can make it another object on the screen if we wanted to. And the blocks are also going to be displayed relative to the player. So this is the object that we are focused on. So I'm going to go up to the render method and watch what I do here. Again, as I mentioned earlier, we're just going to be dealing with the x-coordinate. So when I draw this rectangle, I'm going to go ahead and put in here minus camera dot x. And that's what I have to put here, camera. Because the render method now is sending the object that we want to follow. This isn't going to work yet. I'm kind of walking you through the process that I did when I was trying to figure this whole thing out. Just took me a couple tries, to be honest. So as I mentioned earlier, if the player is moving to the right, we want the background to move to the left and vice versa. That's why this is minus and not plus. Let's go ahead and run it and see what happens. So we've got a little bit of a result that we wanted. Now it's not centered, so I'm going to try and move the player. So you see how the player is moving or the background is moving, but the player is not. The player is staying stationary, but at least in the X coordinate. So everything's still working. It's doing exactly what we want it to do. It's just doing a little bit off the screen. And that's going to be a very, very easy fix. So I'm going to go ahead and click on and put this. And you notice how it was off to the left. So I'm just going to add width, which was the width of the screen, divided by 2.0. Now I'll give us a little bit of an extra offset. Now I'll put it just back to the center. So now if the player moves left, the player moves right, and that is keeping everything right where we want it to be. And if I fall off the screen, it resets right back to where we wanted it to be, which is pretty cool. Yeah, that was it, actually. I had actually some extra code. My original version required a little bit of extra code, but I guess this is all we need for that. I actually had an update method. And I guess for this particular one, we don't need that. But I did update it. Let's just kind of play around with this, since this was a lot faster than I thought it would be. Let's go ahead. I just want to try this, because I haven't done it before. I want to try the same thing with Y. You notice how in this particular thing, it still falls down. And then it falls off. But what happens if we wanted to keep it centered? I mean, in a game like Mario, which is what I'm kind of aiming for, I don't need to worry about Y. But you might want a game where the player can go up and then go up. And then let's say there's another platform off the screen, and that platform will come down. So let's see if we can add that. Again, I haven't tried that before, but let's give it a roll. Let's see what happens here. So I'm just going to do the same thing. Let's say minus camera dot Y. And I think this is going to be minus because of the reverse in the Y coordinate. The Y coordinate is positive going down. So let's just try it. I'm just kind of curious. I haven't tried this before. OK, well, it kind of worked. So it is working. Maybe that should have been a plus. I'm not sure. I thought that should have been a minus. Or maybe this should be camera. That's minus. Well, let's try it. I'm not really sure which one it's supposed to be. But it's only four possibilities. Let's try them all. OK, so that's kind of what I wanted. So you notice how the player is staying. The player actually never moves. I'm going to put my mouse there on the player. So the player doesn't move. But everything else moves around it. So you can see how you could really build up a different type of game where it goes up. And if you fall. If you fall, it falls off and it resets. But you can change those numbers later. So that's pretty cool. This is actually working out a lot better than I thought. And it was actually a lot easier to do than I thought. Now that said, I'm going to take that Y coordinate out of there just because I don't really need it for this particular type of game. I'm going to leave that out for now. But I'm going to test it real quick again. And left, right. Because I want this to be more like Mario and less like other games where you'd be moving up and down. And action. So that is that. Very, very easy. I was surprised at how easy that was. So I'll just review real quick. I created a new class called Camera. And the camera is set to the position of the target, which in this case is the player. And so we create the object. And then when we render, we have to use the player as our object. And that's why, OK, that's why it worked. OK. That's pretty cool. I didn't actually use the camera. So let's put the camera in there. That's why it was so easy. So let's go ahead and run that. And I'll show you. Yeah, and now it's not working. OK. Oh, that's genius. I'm going to put camera here too. So let's go ahead and run that. That should have been camera. So it's moving, but nothing else is moving now. And the reason is that I set this original location to the original location of the player. So now the player is moving, but I haven't updated the camera. And that's why I needed the update method. So I guess I was right the first time. So I'm going to make an update method for the camera. And I want to move it to the location of the player. And so up here in my camera method, or my camera class, I'm going to say Def Update, Self, and Target. So what I need to do is I just need to keep updating the target. So self.x equals target.x, self.y equals target.y. Now again, if you're not really worried about the camera, you just want to keep it directly focused on the player, you don't need to do this. But what I want to add later, and I'm not going to do it in this video, is I'll explain it in a second. So OK, now it's working back to the way it was. What I want to be able to add is so that the player can move a little bit in this direction, a little bit in that direction, and then. And so it moves a little bit in here, so the background doesn't scroll the whole time. That's something I'll add later when I get around to it. But I just wanted to get, this is what I wanted to get done, and talk about basically how cameras work. So that is what I wanted. And again, if you're just going to stay focused on that player, you can do what I did with the, you can just basically skip the camera and just update the render method. So really, basically, if you were willing to just, basically this is the only thing you have to update here. And then instead of sending a camera, you would just send the target, and that'll keep it focused. And the way I did it was so that eventually I could kind of play around with the camera physics and actually have a camera shake and do things like that later. So that's why I did it with a camera object, because it gives you a bit more flexibility later. So yeah, so that's it. Hope that was educational. And yeah, kind of interesting, different ways to approach things. So thanks for watching. Again, thanks so much to my members. And if you'd like to join, click Join down below. And yeah, keep on coding. Take care.