In this article written by Alejandro Rodas de Paz and Joseph Howse, authors of the book Python Game Programming By Example, we learn how game development is a highly evolving software development process, and it how has improved continuously since the appearance of the first video games in the 1950s. Nowadays, there is a wide variety of platforms and engines, and this process has been facilitated with the arrival of open source tools.

Python is a free high-level programming language with a design intended to write readable and concise programs. Thanks to its philosophy, we can create our own games from scratch with just a few lines of code. There are a plenty of game frameworks for Python, but for our first game, we will see how we can develop it without any third-party dependency.

We will be covering the following topics:

• Installation of the required software
• Overview of Tkinter, a GUI library included in the Python standard library
• Applying object-oriented programming to encapsulate the logic of our game
• Basic collision and input detection
• Drawing game objects without external assets

(For more resources related to this topic, see here.)

Installing Python

You will need Python 3.4 with Tcl / Tk 8.6 installed on your computer. The latest branch of this version is Python 3.4.3, which can be downloaded from https://www.python.org/downloads/. Here, you can find the official binaries for the most popular platforms, such as Windows and Mac OS. During the installation process, make sure that you check the Tcl/Tk option to include the library.

The code examples included in the book have been tested against Windows 8 and Mac, but can be run on Linux without any modification. Note that some distributions may require you to install the appropriate package for Python 3. For instance, on Ubuntu, you need to install the python3-tk package.

Once you have Python installed, you can verify the version by opening Command Prompt or a terminal and executing these lines:

$ python –-version
Python 3.4.3

After this check, you should be able to start a simple GUI program:

$ python
>>> from tkinter import Tk
>>> root = Tk()
>>> root.title('Hello, world!')
>>> root.mainloop()

These statements create a window, change its title, and run indefinitely until the window is closed. Do not close the new window that is displayed when the second statement is executed. Otherwise, it will raise an error because the application has been destroyed.

We will use this library in our first game, and the complete documentation of the module can be found at https://docs.python.org/3/library/tkinter.html.

Tkinter and Python 2

The Tkinter module was renamed to tkinter in Python 3. If you have Python 2 installed, simply change the import statement with Tkinter in uppercase, and the program should run as expected.

Overview of Breakout

The Breakout game starts with a paddle and a ball at the bottom of the screen and some rows of bricks at the top. The player must eliminate all the bricks by hitting them with the ball, which rebounds against the borders of the screen, the bricks, and the bottom paddle. As in Pong, the player controls the horizontal movement of the paddle.

The player starts the game with three lives, and if she or he misses the ball’s rebound and it reaches the bottom border of the screen, one life is lost. The game is over when all the bricks are destroyed, or when the player loses all their lives.

This is a screenshot of the final version of our game:

Basic GUI layout

We will start out game by creating a top-level window as in the simple program we ran previously. However, this time, we will use two nested widgets: a container frame and the canvas where the game objects will be drawn, as shown here:

With Tkinter, this can easily be achieved using the following code:

import tkinter as tk

lives = 3
root = tk.Tk()
frame = tk.Frame(root)
canvas = tk.Canvas(frame, width=600, height=400, bg='#aaaaff')
frame.pack()
canvas.pack()
root.title('Hello, Pong!')
root.mainloop()

Through the tk alias, we access the classes defined in the tkinter module, such as Tk, Frame, and Canvas.

Notice the first argument of each constructor call which indicates the widget (the child container), and the required pack() calls for displaying the widgets on their parent container. This is not necessary for the Tk instance, since it is the root window.

However, this approach is not exactly object-oriented, since we use global variables and do not define any new class to represent our new data structures. If the code base grows, this can lead to poorly organized projects and highly coupled code.

We can start encapsulating the pieces of our game in this way:

import tkinter as tk

class Game(tk.Frame):
    def __init__(self, master):
        super(Game, self).__init__(master)
        self.lives = 3
        self.width = 610
        self.height = 400
        self.canvas = tk.Canvas(self, bg='#aaaaff',
                                width=self.width,
                                height=self.height,)
        self.canvas.pack()
        self.pack()

if __name__ == '__main__':
    root = tk.Tk()
    root.title('Hello, Pong!')
    game = Game(root)
    game.mainloop()

Our new type, called Game, inherits from the Frame Tkinter class. The class Game(tk.Frame): definition specifies the name of the class and the superclass between parentheses.

If you are new to object-oriented programming with Python, this syntax may not sound familiar. In our first look at classes, the most important concepts are the __init__ method and the self variable:

• The __init__ method is a special method that is invoked when a new class instance is created. Here, we set the object attributes, such as the width, the height, and the canvas widget. We also call the parent class initialization with the super(Game, self).__init__(master) statement, so the initial state of the Frame is properly initialized.
• The self variable refers to the object, and it should be the first argument of a method if you want to access the object instance. It is not strictly a language keyword, but the Python convention is to call it self so that other Python programmers won’t be confused about the meaning of the variable.

In the preceding snippet, we introduced the if __name__ == ‘__main__’ condition, which is present in many Python scripts. This snippet checks the name of the current module that is being executed, and will prevent starting the main loop where this module was being imported from another script. This block is placed at the end of the script, since it requires that the Game class be defined.

New- and old-style classes

You may see the MySuperClass.__init__(self, arguments) syntax in some Python 2 examples, instead of the super call. This is the old-style syntax, the only flavor available up to Python 2.1, and is maintained in Python 2 for backward compatibility.

The super(MyClass, self).__init__(arguments) is the new-class style introduced in Python 2.2. It is the preferred approach, and we will use it throughout this book.

Since no external assets are needed, you can place the set of code files given along with the book(Chapter1_01.Py) in any directory and execute it from the python command line by running the file. The main loop will run indefinitely until you click on the close button of the window, or if you kill the process from the command line.

This is the starting point of our game, so let’s start diving into the Canvas widget and see how we can draw and animate items in it.

Diving into the Canvas widget

So far, we have the window set up and now we can start drawing items on the canvas. The canvas widget is two-dimensional and uses the Cartesian coordinate system. The origin—the (0, 0) ordered pair—is placed at the top-left corner, and the axis can be represented as shown in the following screenshot:

Keeping this layout in mind, we can use two methods of the Canvas widget to draw the paddle, the bricks, and the ball:

• canvas.create_rectangle(x0, y0, x1, y1, **options)
• canvas.create_oval(x0, y0, x1, y1, **options)

Each of these calls returns an integer, which identifies the item handle. This reference will be used later to manipulate the position of the item and its options. The **options syntax represents a key/value pair of additional arguments that can be passed to the method call. In our case, we will use the fill and the tags option.

The x0 and y0 coordinates indicate the top-left corner of the previous screenshot, and x1 and y1 are indicated in the bottom-right corner.

For instance, we can call canvas.create_rectangle(250, 300, 330, 320, fill=’blue’, tags=’paddle’) to create a player’s paddle, where:

• The top-left corner is at the coordinates (250, 300).
• The bottom-right corner is at the coordinates (300, 320).
• The fill=’blue’ means that the background color of the item is blue.
• The tags=’paddle’ means that the item is tagged as a paddle. This string will be useful later to find items in the canvas with specific tags.

We will invoke other Canvas methods to manipulate the items and retrieve widget information. This table gives the references to the Canvas widget that will be used here:

Method	Description
canvas.coords(item)	Returns the coordinates of the bounding box of an item.
canvas.move(item, x, y)	Moves an item by a horizontal and a vertical offset.
canvas.delete(item)	Deletes an item from the canvas.
canvas.winfo_width()	Retrieves the canvas width.
canvas.itemconfig(item, **options)	Changes the options of an item, such as the fill color or its tags.
canvas.bind(event, callback)	Binds an input event with the execution of a function. The callback handler receives one parameter of the type Tkinter event.
canvas.unbind(event)	Unbinds the input event so that there is no callback function executed when the event occurs.
canvas.create_text(*position, **opts)	Draws text on the canvas. The position and the options arguments are similar to the ones passed in canvas.create_rectangle and canvas.create_oval.
canvas.find_withtag(tag)	Returns the items with a specific tag.
canvas.find_overlapping(*position)	Returns the items that overlap or are completely enclosed by a given rectangle.

You can check out a complete reference of the event syntax as well as some practical examples at http://effbot.org/tkinterbook/tkinter-events-and-bindings.htm#events.

Basic game objects

Before we start drawing all our game items, let’s define a base class with the functionality that they will have in common—storing a reference to the canvas and its underlying canvas item, getting information about its position, and deleting the item from the canvas:

class GameObject(object):
    def __init__(self, canvas, item):
        self.canvas = canvas
        self.item = item

    def get_position(self):
        return self.canvas.coords(self.item)

    def move(self, x, y):
        self.canvas.move(self.item, x, y)

    def delete(self):
        self.canvas.delete(self.item)

Assuming that we have created a canvas widget as shown in our previous code samples, a basic usage of this class and its attributes would be like this:

item = canvas.create_rectangle(10,10,100,80, fill='green')
game_object = GameObject(canvas,item) #create new instance

print(game_object.get_position())
# [10, 10, 100, 80]
game_object.move(20, -10)
print(game_object.get_position())
# [30, 0, 120, 70]
game_object.delete()

In this example, we created a green rectangle and a GameObject instance with the resulting item. Then we retrieved the position of the item within the canvas, moved it, and calculated the position again. Finally, we deleted the underlying item.

The methods that the GameObject class offers will be reused in the subclasses that we will see later, so this abstraction avoids unnecessary code duplication. Now that you have learned how to work with this basic class, we can define separate child classes for the ball, the paddle, and the bricks.

The Ball class

The Ball class will store information about the speed, direction, and radius of the ball. We will simplify the ball’s movement, since the direction vector will always be one of the following:

• [1, 1] if the ball is moving towards the bottom-right corner
• [-1, -1] if the ball is moving towards the top-left corner
• [1, -1] if the ball is moving towards the top-right corner
• [-1, 1] if the ball is moving towards the bottom-left corner

Representation of the possible direction vectors

Therefore, by changing the sign of one of the vector components, we will change the ball’s direction by 90 degrees. This will happen when the ball bounces with the canvas border, or when it hits a brick or the player’s paddle:

class Ball(GameObject):
    def __init__(self, canvas, x, y):
        self.radius = 10
        self.direction = [1, -1]
        self.speed = 10
        item = canvas.create_oval(x-self.radius, y-self.radius,
                                  x+self.radius, y+self.radius,
                                  fill='white')
        super(Ball, self).__init__(canvas, item)

 

For now, the object initialization is enough to understand the attributes that the class has. We will cover the ball rebound logic later, when the other game objects are defined and placed in the game canvas.

The Paddle class

The Paddle class represents the player’s paddle and has two attributes to store the width and height of the paddle. A set_ball method will be used store a reference to the ball, which can be moved with the ball before the game starts:

class Paddle(GameObject):
    def __init__(self, canvas, x, y):
        self.width = 80
        self.height = 10
        self.ball = None
        item = canvas.create_rectangle(x - self.width / 2,
                                       y - self.height / 2,
                                       x + self.width / 2,
                                       y + self.height / 2,
                                       fill='blue')
        super(Paddle, self).__init__(canvas, item)

    def set_ball(self, ball):
        self.ball = ball

    def move(self, offset):
        coords = self.get_position()
        width = self.canvas.winfo_width()
        if coords[0] + offset >= 0 and coords[2] + offset <= 
width:
            super(Paddle, self).move(offset, 0)
            if self.ball is not None:
                self.ball.move(offset, 0)

The move method is responsible for the horizontal movement of the paddle. Step by step, the following is the logic behind this method:

• The self.get_position() calculates the current coordinates of the paddle
• The self.canvas.winfo_width() retrieves the canvas width
• If both the minimum and maximum x-axis coordinates plus the offset produced by the movement are inside the boundaries of the canvas, this is what happens:
  • The super(Paddle, self).move(offset, 0) calls the method with same name in the Paddle class’s parent class, which moves the underlying canvas item
  • If the paddle still has a reference to the ball (this happens when the game has not been started), the ball is moved as well

This method will be bound to the input keys so that the player can use them to control the paddle’s movement. We will see later how we can use Tkinter to process the input key events. For now, let’s move on to the implementation of the last one of our game’s components.

The Brick class

Each brick in our game will be an instance of the Brick class. This class contains the logic that is executed when the bricks are hit and destroyed:

class Brick(GameObject):
    COLORS = {1: '#999999', 2: '#555555', 3: '#222222'}

    def __init__(self, canvas, x, y, hits):
        self.width = 75
        self.height = 20
        self.hits = hits
        color = Brick.COLORS[hits]
        item = canvas.create_rectangle(x - self.width / 2,
                                       y - self.height / 2,
                                       x + self.width / 2,
                                       y + self.height / 2,
                                       fill=color, 
tags='brick')
        super(Brick, self).__init__(canvas, item)

    def hit(self):
        self.hits -= 1
        if self.hits == 0:
            self.delete()
        else:
            self.canvas.itemconfig(self.item,
                                   fill=Brick.COLORS[self.hits])

As you may have noticed, the __init__ method is very similar to the one in the Paddle class, since it draws a rectangle and stores the width and the height of the shape. In this case, the value of the tags option passed as a keyword argument is ‘brick’. With this tag, we can check whether the game is over when the number of remaining items with this tag is zero.

Another difference from the Paddle class is the hit method and the attributes it uses. The class variable called COLORS is a dictionary—a data structure that contains key/value pairs with the number of hits that the brick has left, and the corresponding color. When a brick is hit, the method execution occurs as follows:

• The number of hits of the brick instance is decreased by 1
• If the number of hits remaining is 0, self.delete() deletes the brick from the canvas
• Otherwise, self.canvas.itemconfig() changes the color of the brick.

For instance, if we call this method for a brick with two hits left, we will decrease the counter by 1 and the new color will be #999999, which is the value of Brick.COLORS[1]. If the same brick is hit again, the number of remaining hits will become zero and the item will be deleted.

Adding the Breakout items

Now that the organization of our items is separated into these top-level classes, we can extend the __init__ method of our Game class:

class Game(tk.Frame):
    def __init__(self, master):
        super(Game, self).__init__(master)
        self.lives = 3
        self.width = 610
        self.height = 400
        self.canvas = tk.Canvas(self, bg='#aaaaff',
                                width=self.width,
                                height=self.height)
        self.canvas.pack()
        self.pack()

        self.items = {}
        self.ball = None
        self.paddle = Paddle(self.canvas, self.width/2, 326)
        self.items[self.paddle.item] = self.paddle
        for x in range(5, self.width - 5, 75):
            self.add_brick(x + 37.5, 50, 2)
            self.add_brick(x + 37.5, 70, 1)
            self.add_brick(x + 37.5, 90, 1)

        self.hud = None
        self.setup_game()
        self.canvas.focus_set()
        self.canvas.bind('<Left>',
                         lambda _: self.paddle.move(-10))
        self.canvas.bind('<Right>',
                         lambda _: self.paddle.move(10))

    def setup_game(self):
           self.add_ball()
           self.update_lives_text()
           self.text = self.draw_text(300, 200,
                                      'Press Space to start')
           self.canvas.bind('<space>', lambda _: 
self.start_game())

This initialization is more complex that what we had at the beginning of the article. We can divide it into two sections:

• Game object instantiation, and their insertion into the self.items dictionary. This attribute contains all the canvas items that can collide with the ball, so we add only the bricks and the player’s paddle to it. The keys are the references to the canvas items, and the values are the corresponding game objects. We will use this attribute later in the collision check, when we will have the colliding items and will need to fetch the game object.
• Key input binding, via the Canvas widget. The canvas.focus_set() call sets the focus on the canvas, so the input events are directly bound to this widget. Then we bind the left and right keys to the paddle’s move() method and the spacebar to trigger the game start. Thanks to the lambda construct, we can define anonymous functions as event handlers. Since the callback argument of the bind method is a function that receives a Tkinter event as an argument, we define a lambda that ignores the first parameter—lambda _: <expression>.

Our new add_ball and add_brick methods are used to create game objects and perform a basic initialization. While the first one creates a new ball on top of the player’s paddle, the second one is a shorthand way of adding a Brick instance:

 

    def add_ball(self):
        if self.ball is not None:
            self.ball.delete()
        paddle_coords = self.paddle.get_position()
        x = (paddle_coords[0] + paddle_coords[2]) * 0.5
        self.ball = Ball(self.canvas, x, 310)
        self.paddle.set_ball(self.ball)

    def add_brick(self, x, y, hits):
        brick = Brick(self.canvas, x, y, hits)
        self.items[brick.item] = brick

The draw_text method will be used to display text messages in the canvas. The underlying item created with canvas.create_text() is returned, and it can be used to modify the information:

 

def draw_text(self, x, y, text, size='40'):
        font = ('Helvetica', size)
        return self.canvas.create_text(x, y, text=text,
                                       font=font)

The update_lives_text method displays the number of lives left and changes its text if the message is already displayed. It is called when the game is initialized—this is when the text is drawn for the first time—and it is also invoked when the player misses a ball rebound:

  

def update_lives_text(self):
        text = 'Lives: %s' % self.lives
        if self.hud is None:
            self.hud = self.draw_text(50, 20, text, 15)
        else:
            self.canvas.itemconfig(self.hud, text=text)

We leave start_game unimplemented for now, since it triggers the game loop, and this logic will be added in the next section. Since Python requires a code block for each method, we use the pass statement. This does not execute any operation, and it can be used as a placeholder when a statement is required syntactically:

def start_game(self):
        pass

If you execute this script, it will display a Tkinter window like the one shown in the following figure. At this point, we can move the paddle horizontally, so we are ready to start the game and hit some bricks!

Summary

We covered the basics of the control flow and the class syntax. We used Tkinter widgets, especially the Canvas widget and its methods, to achieve the functionality needed to develop a game based on collisions and simple input detection.

Our Breakout game can be customized as we want. Feel free to change the color defaults, the speed of the ball, or the number of rows of bricks.

However, GUI libraries are very limited, and more complex frameworks are required to achieve a wider range of capabilities.

Resources for Article:

---

Further resources on this subject:

• Introspecting Maya, Python, and PyMEL [article]
• Understanding the Python regex engine [article]
• Ten IPython essentials [article]

---