Instructor

Instructor

Titus Klinge
Assistant Professor
Drake University

CS Tutors

Tutors are free and online appointments can be made via the Starfish Tutoring Center.

Assignment 6

6 minute read

Type: Group Assignment

Prologue

This assignment can either be completed individually or with a partner of your choice. Be sure to review our Code of Conduct for pair programming and be careful to adhere to it when working on the assignment as a group. Keep in mind that you both must be authors of all code submitted.

Summary

In this assignment, we will write a simple game of Tic-Tac-Toe. It is a two-player game that is played on a 3x3 board where the players take turns marking the squares of the board. Player 0 plays with X’s and Player 1 plays with O’s (We’re computer scientists, so we count from zero, of course!) A player wins if they can get three marks in a row in any direction (vertical, horizontal, or diagonal).

Below is an example 3x3 grid that shows the end state of the board after a game is completed.

X O X
X O
O X

In the above game, the players took turns marking cells in the grid until one player obtains three in a row or there are no more places to play. Here Player 0 (i.e. X) wins because they were able to obtain three X’s in a row.

Below is a game that ended in a draw.

X O X
X O O
O X X

Starter Code

Before beginning the assignment, make sure you installed graphics in Thonny. Once it is installed, download the following starter file.

The tictactoe.py file is a partial implementation of the tic-tac-toe game. Your assignment is to finish writing this program.

What Functions You Need to Write

The main program of the tic-tac-toe game is already completed for you in the tictactoe.py file. However, there are several functions that are defined but not yet implemented. Your assignment is to finish implementing all of these functions. There are five of them in total and are listed below:

  • drawBoard(win, board)
  • updateBoard(board, point, player)
  • validMove(board, point)
  • checkWinner(board)
  • drawEndGameMessage(win, winner)

Detailed documentation is provided for each function inside the tictactoe.py.

Tips for Completing the Assignment

Step 0: Get the Code

Go get the tictactoe.py file and open it in Thonny. You should also make sure you installed the graphics library in Thonny.

Step 1: Familiarize Yourself with the Code

Begin by familiarizing yourself with the tictactoe.py file. I suggest you do the following in order.

  1. Take a close look at the structure of the file; locate the main() function to see how it works. You will NOT need to edit this function for your submission, but at this point in the semester, you should be able to understand what every line of code is doing. In fact, it will be helpful to tinker with it to make sure you know how it works.
  2. Note that in main() there is a board variable that is a 3x3 grid. Make sure you understand what this is. Consider playing around with it by copying and pasting it into a shell and try changing some of its values by executing statements like board[0][0] = "X" or board[1][2] = "O" to see how it changes.
  3. Try putting a print(point) statement after the point = win.getMouse() line of code and run the program. Now try clicking on the window that appears and take a look at the coordinates of the point that is registered.
  4. Make sure you know the role of the curPlayer, winner, and movesSoFar variables.

Step 2: Drawing the Board

Next I suggest you implement the drawBoard function. Here are a few things to get you started.

  1. Take a very close look at the documentation of the function and make sure you understand what it is supposed to do.
  2. Draw a white rectangle that takes up the entire window so that it covers up any previous boards that have been drawn with a white canvas.
  3. Draw four black lines so that the window is separated into nine squares of equal size. You may want to review the Line documentation and experiment with how they work in the shell before doing in the tictactoe.py file.
  4. Try experimenting by drawing a single X or a single O in the center of certain cells on the grid. The goal is to get them to appear perfectly centered. Once you have the hang of drawing characters to the board, delete your experimental code and move on.
  5. Finish writing the function using two nested loops that iterates over the cells of the board parameter and draws the string from the board. I suggest you loop over range(3) twice so that you can access the current value with board[row][column] for some iteration variables row and column.
  6. Try testing your function by manually editing the board variables in main() so that it also has "X" and "O" values and make sure they appear in the right spots.

Step 3: Updating the Board

Next I suggest you implement the updateBoard function.

  1. Take a very close look at the documentation of the function and make sure you understand what it is supposed to do.
  2. Insert that print(point) statement back into the main() function right after the point = win.getMouse() line. Try running the program and clicking around so that you know what points are generated by clicks.
  3. Think about how you can figure out what row and column of the grid point object is in. Remember that board[0][0] is the upper left cell, board[2][2] is the lower right, and board[1][0] is the second row first column. Therefore board[row][column] will always give you the value in row row and column column. You will need to use the point.getX() and point.getY() methods to get the x and y-coordinates of the point and then use floor and/or ceiling from the math library in some interesting way to convert it to a row/column.
  4. Then update the board with the player character using board[row][column] = player.
  5. Try testing your function by running the programming and clicking in different regions to see if the X’s and O’s appear in the right spots.

Step 4: Validating Moves

Next I suggest you implement the validMove function.

  1. You already know how to turn a point into a row and column. Do this again here.
  2. Check if board[row][column] is an open cell (i.e. the empty string), if it is return True and otherwise return False.

Step 5: Checking if a Player Won

The most difficult part of this assignment is checking if one of the players has won the game in the checkWinner function. This requires checking if there are three identical characters in a row either vertically, horizontally, or diagonally. There are eight possible different ways each player could win and each will have to be checked. Try to make use of loops and/or helper functions to solve this problem rather than hard coding a 16-case conditional covering all the possibilities!

Step 6: The End Game

The last step is to implement the drawEndGameMessage function that simply displays a message to the players who won the game. You have complete freedom on how to implement this function, but the user must always know the outcome of the game from the message. For example, you could draw a red rectangle and put the text “Player X Wins!” or “Close game! It was a draw!” or something equally helpful in identifying the final result of the game.

How to Turn in Your Code

  1. Once you are finished with the assignment, you should go to https://codepost.io and log into your account.
  2. Go to the CS 65 course.
  3. Go to Assignment 6 and upload all of your files.
  4. After you submit the assignment, you should be able to reopen it and see a Partners tab at the top of the submission page. Send the link to your partner and have them open it while logged in with their account.
  5. That’s it! You’ve just submitted your assignment.

Important Grading Criteria

I will evaluate your work with the following criteria in mind.

  1. Correctness. Does your code do what is asked? (e.g. named correctly, input and outputs correct values, etc.)
  2. Formatting. Is your code formatted so that it is easy to understand?
  3. Elegance. Is your code concise and elegant?