3. Spaceship¶

Every game needs a player avatar, and in our game it's a spaceship. In this lesson we'll create the spaceship and make it move up and down the screen when the player presses keys.

Pygame graphics¶

Now that we're working with sprites, we need to look a bit deeper at how graphics work in GameFrame. GameFrame is built on Pygame, so that means understanding how Pygame handles graphics.

We'll use the image below to explore graphics in Pygame.

The screen¶

Pygame follows the common convention of putting (0, 0) in the top-left corner of the screen. The x value increases as we move right, and the y value increases as we move down. That means the largest coordinate is in the bottom-right corner, which on our screen is (1280, 800). The edges of the screen are:

Objects¶

Every object on the screen has three values:

• its coordinates (x, y)
• its width in pixels
• its height in pixels

An object bigger than one pixel covers lots of coordinates, so each object has an origin, and that's its coordinate. For objects with sprites, the origin is the top-left corner.

Using these three values, we can work out the corners of the object. Check the purple object in the diagram.

Let's try that with the green object. Its origin is (200, 450), its width is 100 and its height is 100.

Movement¶

We make an object move around the screen by changing its origin coordinates.

Planning¶

To plan what our objects do, we'll use an Input Process Output (IPO) table. To fill in an IPO table:

1. Start with the output we want.
2. Choose an input from the ones available to trigger it.
3. Work out the process that gets us from the input to the output.

Output¶

For this lesson, we want the spaceship to move up and down. So that's our output.

Input¶

What input options do we have? The keyboard and mouse are the most common. It's really our choice, so let's use the keyboard. Which keys? The most common keys for up and down in games are W and S, so let's use them.

Process¶

So how do we get from key presses to a moving ship? Thinking about how Pygame handles graphics, we need to change the y value of the ship's origin: decrease it when W is pressed and increase it when S is pressed.

Let's check the GameFrame API for RoomObject variables that could help. There are two possibilities:

• We could change y, but that would only move the ship once per press, so the player would have to keep tapping keys to keep moving.
• We could change y_speed. The API says this is the number of pixels the object moves up or down every frame. If we set it to -10 for up and 10 for down, the ship keeps moving after the player presses the key. That sounds like our best bet.

That's the planning finished. Now let's code it.

Add the Ship RoomObject¶

Adding the Ship starts with the same steps we used for the Title:

1. Define the Ship class
2. Initialise it and give it an image
3. Add it to Objects/__init__.py
4. Add a Ship object to the GamePlay Room

Then we'll make it respond to keys:

1. Register the Ship for key events
2. Write its key_pressed method

Create a new file in the Objects folder, add the code below and save it as Ship.py.

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16

from GameFrame import RoomObject

class Ship(RoomObject):
    """
    A class for the player's avatar (the Ship)
    """

    def __init__(self, room, x, y):
        """
        Initialise the Ship object
        """
        RoomObject.__init__(self, room, x, y)

        # set image
        image = self.load_image("Ship.png")
        self.set_image(image,100,100)

Open Objects/__init__.py, add the highlighted code below and save it.

1
2

from Objects.Title import Title
from Objects.Ship import Ship

Open Rooms/GamePlay.py, add the highlighted code below and save it.

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12

from GameFrame import Level
from Objects.Ship import Ship

class GamePlay(Level):
    def __init__(self, screen, joysticks):
        Level.__init__(self, screen, joysticks)

        # set background image
        self.set_background_image("background.png")

        # add objects
        self.add_room_object(Ship(self, 25, 50))

We should have a spaceship in the GamePlay Room, but it doesn't move yet.

Make the Ship move¶

Go back to Objects/Ship.py and add the highlighted code below.

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30

from GameFrame import RoomObject
import pygame

class Ship(RoomObject):
    """
    A class for the player's avatar (the Ship)
    """

    def __init__(self, room, x, y):
        """
        Initialise the Ship object
        """
        RoomObject.__init__(self, room, x, y)

        # set image
        image = self.load_image("Ship.png")
        self.set_image(image,100,100)

        # register events
        self.handle_key_events = True

    def key_pressed(self, key):
        """
        Respond to keypress up and down
        """

        if key[pygame.K_w]:
            self.y_speed = -10
        elif key[pygame.K_s]:
            self.y_speed = 10

Commit and push¶

We've finished and tested another section of code, so you know what to do.

1. In GitHub Desktop, type Created Spaceship object in the Summary box.
2. Click Commit to main.
3. Click Push origin.