Tkinter board game
Question:
I am making a board game with Tkinter. I create a grid:
def create_grid(self):
self.grid_frame = Frame(window)
self.grid_frame.grid(row=1, column=0)
self.grid_picture = PhotoImage(file="grid.PNG")
self.grid_label = Label(self.grid_frame, image=self.grid_picture)
self.grid_label.grid(row=0, column=0, columnspan=100, rowspan=10)
Then the pawns are placed based on their distance from start:
def green_grid_translation(self, green_position):
if green_position < 10:
self.green_grid_row = 9
self.green_grid_column = green_position*10+2
elif green_position < 20:
self.green_grid_row = 8
self.green_grid_column = 92 - (green_position - 10)*10
The pawns are placed on the same frame as the grid, the frame is created again with every move:
def position_interface(self):
self.grid_frame = Frame(window)
self.grid_frame.grid(row=1, column=0)
self.grid_picture = PhotoImage(file="grid.PNG")
self.grid_label = Label(self.grid_frame, image=self.grid_picture)
self.grid_label.grid(row=0, column=0, columnspan=100, rowspan=10)
self.green_picture = PhotoImage(file="green.png")
self.green_symbol = Label(self.grid_frame, image=self.green_picture)
self.green_symbol.grid(row=self.green_grid_row, column=self.green_grid_column)
self.blue_picture = PhotoImage(file="blue.png")
self.blue_symbol = Label(self.grid_frame, image=self.blue_picture)
self.blue_symbol.grid(row=self.blue_grid_row, column=self.blue_grid_column)
The following loops are used to make them go step by step:
for x in reversed(range(green_change[0])):
run_grid.green_grid_translation(green_change[1] - x)
run_grid.blue_grid_translation(blue_change[1])
run_grid.position_interface()
window.update()
sleep(1)
for x in reversed(range(blue_change[0])):
run_grid.green_grid_translation(green_change[1])
run_grid.blue_grid_translation(blue_change[1] - x)
run_grid.position_interface()
window.update()
sleep(1)
green_change[0]
is the number of steps the pawn is supposed to move,
green_change[1]
is its position on the grid
It works fine with a single pawn, but when there are two, it’s like the number
of rows and columns changes and the pawns sometimes land in wrong positions:
Is there a way to fix it or do I need to take a completely different approach?
Answers:
Your approach is wrong. There is plenty of stuff to improve, e.g the use of sleep in a GUI application is an absolute no-no.
But for the problem at hand, you simply use the wrong abstraction. Grids are for creating widgets in regular spaced layouts. But not for stacking/rearranging them. It CAN be done, but I would advise against it.
Use instead a canvas. This allows you to simply overlay graphical elements, and even move them around (smoothly if you are so inclined!).
I am making a board game with Tkinter. I create a grid:
def create_grid(self):
self.grid_frame = Frame(window)
self.grid_frame.grid(row=1, column=0)
self.grid_picture = PhotoImage(file="grid.PNG")
self.grid_label = Label(self.grid_frame, image=self.grid_picture)
self.grid_label.grid(row=0, column=0, columnspan=100, rowspan=10)
Then the pawns are placed based on their distance from start:
def green_grid_translation(self, green_position):
if green_position < 10:
self.green_grid_row = 9
self.green_grid_column = green_position*10+2
elif green_position < 20:
self.green_grid_row = 8
self.green_grid_column = 92 - (green_position - 10)*10
The pawns are placed on the same frame as the grid, the frame is created again with every move:
def position_interface(self):
self.grid_frame = Frame(window)
self.grid_frame.grid(row=1, column=0)
self.grid_picture = PhotoImage(file="grid.PNG")
self.grid_label = Label(self.grid_frame, image=self.grid_picture)
self.grid_label.grid(row=0, column=0, columnspan=100, rowspan=10)
self.green_picture = PhotoImage(file="green.png")
self.green_symbol = Label(self.grid_frame, image=self.green_picture)
self.green_symbol.grid(row=self.green_grid_row, column=self.green_grid_column)
self.blue_picture = PhotoImage(file="blue.png")
self.blue_symbol = Label(self.grid_frame, image=self.blue_picture)
self.blue_symbol.grid(row=self.blue_grid_row, column=self.blue_grid_column)
The following loops are used to make them go step by step:
for x in reversed(range(green_change[0])):
run_grid.green_grid_translation(green_change[1] - x)
run_grid.blue_grid_translation(blue_change[1])
run_grid.position_interface()
window.update()
sleep(1)
for x in reversed(range(blue_change[0])):
run_grid.green_grid_translation(green_change[1])
run_grid.blue_grid_translation(blue_change[1] - x)
run_grid.position_interface()
window.update()
sleep(1)
green_change[0]
is the number of steps the pawn is supposed to move,
green_change[1]
is its position on the grid
It works fine with a single pawn, but when there are two, it’s like the number
of rows and columns changes and the pawns sometimes land in wrong positions:
Is there a way to fix it or do I need to take a completely different approach?
Your approach is wrong. There is plenty of stuff to improve, e.g the use of sleep in a GUI application is an absolute no-no.
But for the problem at hand, you simply use the wrong abstraction. Grids are for creating widgets in regular spaced layouts. But not for stacking/rearranging them. It CAN be done, but I would advise against it.
Use instead a canvas. This allows you to simply overlay graphical elements, and even move them around (smoothly if you are so inclined!).