Throughout the different videos, you have heard me say something like, go to setupBeginning and calling it a method or a function or do the same about doDraw or updateGame. And that’s because all of these are functions or methods. Function or method is almost synonymous. There’s a small difference. It’s to do with the object notation, so it’s not relevant here in this course. It’s for your study later on, after the course, when you go and look up what object rotation really is. And there’s a small difference, but it’s minute, and we can treat them as the same thing. So a function is something that you call, and it then returns once it finishes. So setupBeginning here is a function.
And this means that somewhere in all the code that I have given you, this is called. Let’s go and look at that where that is. So if you go here and we take Find Usages, we can actually go and say yes to this, find all the usages. And here we have it. This is only called once. So let’s go in there. And you see in the code called Game thread, so from this here, that is where it’s called. And it’s called inside another function, which is called doStart, which then does a lot of stuff. But the beginning line here is setupBeginning. So it calls our code. Let’s set a break point and test it out.
So let’s start the game and actually, immediately when I click this, we would expect it to stop. So I click, and yes, immediately we’re going in. And we’ll see that we stopped. And we can now do debugging. Now, there’s something I want to show you here, and that is the Step Into functionality. So we’ve been used to use the step functionality, where we’re doing one line at a time, which was F8. But if we use F7– we can go up here and find it– we also have the Step Into here, F&7. Or indeed, this button can also be used. So there are many ways of doing it. I’ll use F7.
We will go into the method, so actually go to the code which is running this line. So F7, and you see we are now in our own code. And we are in setupBeginning. And I can now do the lines as before, F8, F8, F8. That’s fine. We can also use this one, which is Step Out of. So if you want to finish what the method is doing and go to where we were before, we can Step Out, and I click Step Out. And you see we’re now on the line that was after the setupBeginning call. So that way, we can go and see what methods are doing either– we are interested to see what the method used is doing.
We just want to run the line, the full method. That’s fine. We do that with F8. We want to go into it, we can use F7 and see what is happening inside it. And once we’re inside of it, we can also do Shift F8 and go out of it again and go to where we left off. So that’s quite useful for functionalities in the debugger. I will just stop this and go back to our code. Here we are. Because there’s something I want to show you. And that is a method that I’ve started working on myself. I have it here. It’s called updateBallCollision.
And the reason why I’ve started on this one is because if you go through updateGame, we’ll see that there’s actually quite a lot of code that is similar. Go up, we’ll see, for instance, that here in the loop, this code here that is looking for a collision is literally the same as the code that is checking the smiley face except for the updateScore, and also the one that is checking the paddle. It’s the same code. So this is a very good candidate for using a method. Because when we have the same code, it is just simpler to have one method doing it for us.
And it makes it easier for us to maintain the code, and it makes it easier maybe for us to make changes later on. OK so let’s start using it. Now within the for loop, we should be able to put in quite simple. So I’ll just copy and paste the name of the method up here, and I’ll put in the parentheses and the semicolon. Good. Now, of course, that’s not enough, because this method, we see, needs an x and a y. x and a y from where the big ball is, the big ball that we want to check if the small ball has hit. So in this instance, that would be the x here and the y here.
So we just copy and paste that up into the methods arguments like this.
Oh that was too much. This.
So now this line here is actually doing all of these lines. So we can get rid of them. So I’ll just delete them.
And now we should actually have the same functionality as before. So let’s test that to see that the game is still working. So let’s see. It’s certainly running. Let’s see if it’s hitting the sad faces and then bouncing off, because that’s the one we changed. Yep. It works. Fantastic. So see, the code is now much easier to read. We’re just saying what the code is supposed to do. And we don’t have all these lines inside the if statements and inside the for loops and doing all the code. It’s just that one line. So that’s fantastic.
Now, if we look at the next one here, there’s this updateScore that’s a little bit of a difference. But I think we could do something very clever here to actually make that functionality work really well for us. Because what we can do is make updateBallCollision return something, return true or false. And if it has hit something, we could then add a score. And if it hasn’t hit anything, we will just not update the score. So we could do that. So let’s do that. Boolean, we’ll make it into a Boolean, because then it has to return a Boolean value. And we know that it should return true if it has hit. Something And it has hit something if it’s in here.
And when it hits the return, it will stop the progression in the method and jump out where we were. So that should work. And then we will have a return false if we haven’t had a collision. That would happen if we then get to this line.
That would return to a false, depending on whether we have a collision or not. So we’ll go up into the code– this was here– and change that. So the easy way is to actually take this and copy and paste it into here, into the if statement. And then we’ll need the x and the y from here, and that’s this one. The smiley face is x, and the smiley face is y. And now it’s returning it. So if this is true– oh. We don’t need this one up here, because that’s also down inside the function. And if it’s then true, we want to update the score.
If it’s not true, well, we don’t do anything. So that’s fine. But this will actually do it. Let’s put a break point just to make sure that it’s all working. So I’ll debug this. So let’s debug it. And we see, oh. We still have that one. Just remove it and keep it running. And there we are. Now we have the first collision control here. And we see it’s an if statement. And we would expect the smileyBall 24. So where’s the smileyBall’s x? 120 and 24 to go into the method. So I’ll do F7 to go into the method. And we see x and y are 24 and 120. We get the distance of the ball.
And if this distance is less than the minimum distance, which it’s not, we’ll not go into the if statement, and we return false. So this seems to work. That’s good. So the last change we could do is the last here, where we are colliding. And just at the code up here, instead of this– no. Actually, we need to have it inside the if statement, because we still want to check if the speed of the ball is in the right direction.
Oh, I can’t remember which one. It’s the paddle, isn’t it?
It’s the paddle. So we need PaddleX and CanvasHeight. I’ve just put in the line. It’s easier to do it this way, copy it over. Otherwise, it’s so easy to make mistakes. This way, we know that we’ll have it right. So just remove the code. Oop. That was one semicolon there. Not semicolon, a squirrely bracket. So yep. That’s it. This should do the trick. This will work. Let’s have a go. Just run it this time. Let’s see if we can score a point. It would be nice, because I would like to hit a smiley face. That can be hard.
And come on. Hit it. So close. Yay! We scored. Fantastic. It works. Methods are really nice to organise your code. So try to start thinking, is there any of your code that looks similar or can be done in a similar way. And then create methods to do them. Because it just makes it much more organised, what you’re doing. And it looks better. It gets easier to understand for yourself. And you can also do a lot of fancy things with them. This returning values really gives a lot of possibilities in your code. So try and work more on them and using them.