Square Based Game Tutorial – Setup

This tutorial will take you through making the game of Tic Tac Toe, using the PyGame library and the Model-View pattern.

To start, grab the folder TicTacToe.  In it are the images you need for this project.  When you make your own game, you’ll make your own images, too.

Create a new file called TicTacToe.py, and save it in the same folder.   Then you’re ready to get started.

Start off TicTacToe.py with some imports.   Pygame is the game library you’ll be using, and sys gives you access to some system functions, like the ability to quit the program.

Next you’ll add a function called “run_game()”.  This function will have three parts.  The first part sets up the game.  Here is the beginning of the run_game() function.

The line with set_mode((700, 800)) determines the screen size.  The last line loads up an image into the game.

Next, inside the run_game() function, we’ll add the run loop.  This loop runs over and over in our game, once per frame.  In the run loop we check for events.  Events are things like key presses and mouse clicks – input from the user.

Make sure all this code is inside the run_game() function.    Finally, add a line of code to actually run your game, not inside the run_game() function.

Now run your program.  You should get a window that looks something like this:

That lovely green color is inside the program, in the line that starts “screen.fill”.  See if you can change that color to something else.

There are two lines of code that make the “board” appear.  One loads the image into the game, and one draws (“blits”) it onto the screen.  See if you can find them.


Try to add an “X” in the center box of the game.  You’ll need to load the “x.png” image into the game in the setup portion, and then “blit” it into the correct rectangle.









Resources – coming soon.