How to finish this tic tac toe program?
Cynthia Chang last edited by
Step 1: Properly Size Images
Use the Pillow module to resize the images appropriately:
Instructions to install (Links to an external site.)
See the load_images method here (Links to an external site.) to see an example of how to use the Pillow module to properly resize the tic tac toe game images. Note: take a look at the import statement too! Don't forget the import...
Step 2: Choose First Player Dialog
Use the code from choose_user.py (Links to an external site.) for your file. This code creates a dialog that will open from the choose_player method. The tic_tac_toe.py (Links to an external site.) file has the example code in the choose_player method showing how to open the dialog and return the result.
Step 3: Show a victory animation
We will use the v.png image, saved to the class variable self.v_img, as our victory animation. In game programming, animations can be created by manipulating the way images are displayed either by making them appear, resizing them, etc. To do this we are going to refactor our tic_tac_toe.py file.
Start by adding a new method build_actions_frame. This method will have the code to create the frame that contains the new_game and end_game buttons. We will also add an area to the frame where our victory image animation will appear when a player has won the game.
In build_actions_frame move the code from our init method to create the action buttons frame to this method, and add a call to self.build_actions_frame() in init.
Inside build_actions_frame, add additional statements to create a canvas below the game buttons, and save a reference:
self.victory = Canvas(cmd_btn_frame, width=200)
Next create a method animate_victory. The animate_victory method will move the victory image on the canvas
For now, to test this method is working, add a call to animate_victory at the end of the new_game method. Eventually we will remove this call and only call it when:
A player has won and "New Game" or "End Game" has not been clicked
Inside animate_victory you need to:
Create the image using the Canvas create_image method
self.victory_container.create_image(0, 0, anchor=NW, image=self.v_img, tags="img")
Note: you need to include the "tags" property, as this will be how you later reference the Canvas' image
Create a while loop that will continue the animation as long as some condition is true.
Because animation will be triggered from outside the method, I suggest you use a class variable "animate" as a Boolean value tracking whether or not the image should be animating
Inside the while loop you use for loops to move the animation around the screen (see example from lecture(Links to an external site.))
I would wrap any calls to move inside a try/except block to handle any graphics exceptions
Now we need to trigger / stop the animation. The animation should only be shown once a player has won the game. The check for this belongs in mark_cell
If a player has won, we need to consider a few things:
We want any TTTButton clicks while the game is in a winning state to be ignored. To do this you want to set player = 0 to disable clicks until a new game has started
We also need to make a call to start our animation (self.animate_victory)
We will end the animation when a new game begins, or a player selects "End Game"
Because both of these actions trigger a call to clear_game, we can add logic to stop the animation at the top of clear_game by:
setting self.animate = False
deleting the image from the canvas (self.victory.delete("img"))
Step 4: Testing our program
We know our program is complete when the game runs as follows:
Game window opens to Welcome state
message shown is welcome message
End Game button is disabled
New Game button is enabled
TTTButton grid is disabled
New Game button click starts a new game:
Choose player dialog is shown and returns the selected player
If the choose player dialog is closed without a selection a new game does not begin
Once a player is chosen the game status message updates to show whose player turn it it
TTTButton clicks update to the appropriate image
End game button is enabled
End game button clicks end current game, if any
Should only be enabled while the game is in play, or a player has won
End game clicks reset the window to the Welcome state
When a player has won:
The status message indicates which player has won (i.e. Player 1 Wins!)
The victory animation is shown on the screen
Both the New Game and End Game buttons are enabled
New Game starts the choose player cycle
End Game resets the window to the welcome state
avan last edited by
The question is too broad. Asking questions on specific parts of the assignment/problem is much better and yields better results.