Today I’m continue followed Coding With Russ to do the Street Fighter Game. Last post the fighters can moving left to right, but it will go out the screen. This time I’m fix it, it will not go out of the screen anymore. I also make the fighters jump, add gravity for it, and make it will stand on the ground after jump. And not make it can double jump. I draw the fighter’s weapon will appear when click ‘r’ or ‘t’. And draw the health bars have white outline and one part of the health bar will become red when the fighter get hit by another fighter.
To make the fighter cannot go out of the screen. In the “fighter.py” file, we go to the move() function and create 2 variables; dx and dy. Make them both equal 0. And write an if-elif method, if the left x-coordinate of fighter add dx is less than 0, we make the dx equal negative x-coordinated of fighter. Like if the left x-coordinate of a fighter is -1 and we make -(-1) is equal 1. And if the right x-coordinate of the fighter plus dx is larger than the screen width, the dx is equal screen width minus right x-coordinate. You will see it on below.
Next we make it can jump by click ‘w’. But after it jump it will go all the way up and never come back. You can see how it jump in this link at 23:50.
Now to make the fighter go back, we create a gravity variable equal 2 and after the fighter jump we add the gravity to the fighter’s y-coordinate. But we have another problem is the fighter will go down over the ground after it jumps. You can see it at 25:00.
To make it can stand on the ground, if the bottom coordinate of fighter plus dy larger than screen height minus 110. dy is equal screen height minus 110 minus the bottom coordinate of the fighter.
And this is the fighter jump and it is land on the ground.
 |  |
We don’t want the fighter to double jump or triple jump, because it’s gonna jump out of the screen game. So we need to make after the fighter jumps, it will wait 2-3 seconds and can jump again. In the “fighter.py” file, we create a variable jump equal to False and check when the player clicks ‘w’ and the jump is false, so the jump is true.
Now we need to make the fighter jump again. In the function make the player land on ground after jump add one more line is jump equal false. So now the fighter can jump one time and wait 2-3 seconds to jump again.
Now we can draw the weapon of the fighter into the screen game. First, we create a self.attack_type equal 0. And check if the key pressed is “r”, the attack type is 1 and if it is “t”, the attack type is 2. Next, we create an attack() function that has one argument which is the surface. In that function, it will draw the green rectangle for the weapon, we will load the image of the weapons into that rectangle later.
And we call this function after we check if the key pressed is “r” or “t”. The weapon will appear next to the fighter after press “r” or “t”.
We want to minus fighter’s health when the weapon is colliding with the fighter. But if we hold the “r” or “t” it will minus all the health of the fighter. Just like the jump one, we want it hit one time and wait 2-3 seconds to hit again. So we create a variable that is self.attacking equal False. And check if it is false so the fighter can move, jump, and attack. And after the fighter is hit one time we set the self.attacking equal true. And also check if the weapon collides the fighter it will return “hit”.
So now we need to make the self.attacking equal false somewhere, but we will do it later. Next, we draw the health bars. Go to the “main.py” file, we create 3 variables that are colors we need to draw the health bars. And creating a draw_health_bar() function needs 3 arguments which are health, x, y. And just call it to draw 2 health bars for the fighter.
The health bars appear on the screen.
In the “fighter.py” file, we create a health variable equal to 100. And in the if-elif method that we check if the weapon collides with another fighter and it prints ‘hit’, we delete that and make the other fighter health -10. And now in the draw_health_bar(), we draw the white outline and the red if the fighter gets hit by another fighter. The ratio in this function is how long the health of the fighter is and draws it. Like if the health is 90 divided by 100 is 0.9 and the max health long to draw on the screen is 400. We multiply 0.9 and 400 is 360. So it will draw the health of 360.
The problem we have now is when the fighter goes behind another fighter, the fighter is not face to another fighter. I will fix it in the next blog post.
No Responses