Foundations of Pygame Part 2
For Part 2 of this series I’ll extend the code to demonstrate drawing text and various shapes as well as responding to mouse clicks by drawing a circle. Please read Foundations of Pygame Part 1 first if you haven’t already.
The code for this article consists of a single file called pg02.py which you can find in the GitHub repository for this series.
The Code
This is the whole of pg02.py, much of which is copied across from pg01.py, the code for Part 1.
__init__
There are four additions to __init__ from the previous version:
Line 14: redraw property to flag when a change of state requires a window update
Line 18: circle_coords property for mouse click positions
Line 21: font property for text
Line 29: initial call to __draw_window
__draw_window
This is all new and demonstrates the various methods provided by pygame.draw.
The first line isn’t something you would use in a real game but is just to demonstrate that this function is only called when changes require it. It’s easy to accidentally redraw the window on every iteration of the event loop so it’s worth making a conscious effort to avoid this.
Next we fill the window with a colour which is specified as a tuple of decimal RGB values.
To draw text we first render it, the method returning a Surface object which is in effect an image. Printing it displays this:
<Surface(211x30x32 SW)>
which shows the width, height and colour depth (RGBA including the alpha channel). SW means the surface is in system memory. The text_size is then retrieved and used to calculate the position in a call to blit. The acronym blit derives from bit block transfer and refers to a fast and efficient way to merge images, in this case the Surface containing the text and the window.
The next five pygame.draw methods are rect, polygon, ellipse, arc and line. The parameters vary depending on the shape so you might want to read the comments for details of each one. All have a width argument which specifies the outline. I have used one of Pygame’s built in colours instead of an RGB tuple; this is a list of all those available.
https://www.pygame.org/docs/ref/color_list.html
If you are interested you can look at the actual Python which defines the colours:
https://github.com/pygame/pygame/blob/main/src_py/colordict.py
Next up is the code which draws a circle at the mouse click position. It’s not much but this is the first time we have drawn something in the Pygame window in response to user input. A significant step forward and one which can be extended to any level of complexity.
The line after is critically important - calling pygame.display.update() updates the window with all the changes made so far. Sadly I think many people must forget this step or be unaware that it is necessary and become frustrated that nothing happens. Repeat after me “I must remember to call pygame.display.update()”.
The last line resets the redraw property so that __draw_window isn’t called on every event loop iteration.
__handle_left_mousebuttondown
The mouse click coordinates are copied to the circle_coords property and redraw set to True to force a redraw.
__event_loop
Any setting of redraw to True will occur within event handlers so after iterating the event queue we check redraw and call __draw_window if necessary.
Running the Program
Enter this in your terminal to run the program.
python3 pg02.py
This is the window.
Having read all the code and descriptions you might like to click on the window a few times to relax your mind.
So what have we achieved so far? The 177 lines of code listed above represent a fully functioning object oriented demonstration of the key principles of Pygame. They create a window, handle mouse and keyboard events and create graphical output. I believe that if you already have some Python experience and a bit of imagination you could adapt and extend this code into a proper game.
The shapes in pygame.draw are fine for simple games, especially if you like a retro aesthetic, but in the next article I’ll show how to draw graphics files, jpeg or png, to the screen.
No AI was used in the creation of the code, text or images in this article.