Creating a game board with Tkinter

Question

I am trying to build a simple game of Connect Four with Python(2.7)

I have created a board, that consists of a simple multidimensional Python list.
My Board list looks like this:

board = [
    [_,_,_,_,_,_,_,_,_,_],
    [_,_,_,_,_,_,_,_,_,_],
    [_,_,_,_,_,_,_,_,_,_],
    [_,_,_,_,_,_,_,_,_,_],
    [_,_,_,_,_,_,_,_,_,_],
    [_,_,_,_,_,_,_,_,_,_],
    [_,_,_,_,O,_,_,_,_,_],
    [_,_,_,_,X,_,_,_,_,_],
    [_,_,_,_,X,O,_,_,_,_],
    [_,_,_,_,X,O,_,_,_,_],
]

Were X is Player1 and O is Player2 (or Computer).

Now, I have created some basic code for the GUI, like this:

# Connect 4 Game
import Tkinter

screen = Tkinter.Tk()
screen.title("My First Game")

#Create a board
board = Tkinter.Canvas(screen,width=500,height=500)
board.pack()

screen.mainloop()

Question: How can i create a visual representation of the board, so that for every element, there is a rectangle? Also, is there a way to detect, when a rectangle is clicked and replace the corresponding list value?

Teel

Is there a reason each element of your board is a list itself? I mean, the ['_'], ['X'], or ['O']. Shouldn't they just be elements, like '_', 'X', or 'O'? – Brinson

I guess not. I am just learning Python and that was my first idea, how to do it. I'm sure there are better way, but i just don't know them. – Teel

@fizzisist: thanks, i just eddited the code – Teel

Answer 1

I created a board of labels and color them according to which is clicked:

import Tkinter as tk

board = [ [None]*10 for _ in range(10) ]

counter = 0

root = tk.Tk()

def on_click(i,j,event):
    global counter
    color = "red" if counter%2 else "black"
    event.widget.config(bg=color)
    board[i][j] = color
    counter += 1


for i,row in enumerate(board):
    for j,column in enumerate(row):
        L = tk.Label(root,text='    ',bg='grey')
        L.grid(row=i,column=j)
        L.bind('<Button-1>',lambda e,i=i,j=j: on_click(i,j,e))

root.mainloop()

This doesn't do any validation (to make sure that the element clicked is at the bottom for example). It would also be much better with classes instead of global data, but that's an exercise for the interested coder :).

Geraud

Answer 2

You probably want to create a grid of Buttons. You can style them according to the values in board, and assign a callback that updates the board when clicked.

Brinson

That's exactly what I did with my version of Battleship. Buttons work remarkably well for this purpose – Ludly

Answer 3

Here is a simple example script you can use to create a simple Connect Four Game with Python 3+, based on an example tic tac toe game from the game2dboard library. This library is pretty cool, and the game can easily be improved to have images represent the X's and O's you referenced.

from game2dboard import Board

def mouse_fn(btn, row, col):    # mouse callback function
    b[row][col] = "X" if not b[row][col] else "O"

b = Board(10, 10)         # 3 rows, 4 columns, filled w/ None
b.title = "Connect Four"
b.cell_size = 120
b.cell_color = "bisque"
b.on_mouse_click = mouse_fn
b.show()

Of course, you'll need to pip install game2dboard or clone the repo. Enjoy!

Stalinabad