如何用Tkinter实现可点击响应的网格？获取单元格索引并变色

数据老陈

2026-7-30

解决方案

以下是实现需求的完整代码：

import tkinter as tk
import random

GRID_SIZE = 9
SQUARE_SIZE = 40
COLORS = ['green', 'yellow']

color_grid = [[random.choice(COLORS) for j in range(GRID_SIZE)] for i in range(GRID_SIZE)]

def on_click(event, i, j):
    # 获取当前颜色并切换
    current_color = color_grid[i][j]
    new_color = 'yellow' if current_color == 'green' else 'green'
    # 更新颜色网格数据
    color_grid[i][j] = new_color
    # 更新画布上的单元格颜色
    item = canvas.find_closest(event.x, event.y)
    canvas.itemconfig(item, fill=new_color)
    # 打印单元格索引
    print(f"({i}, {j})")

def draw_board(canvas):
    for i in range(GRID_SIZE):
        for j in range(GRID_SIZE):
            x0, y0 = i * SQUARE_SIZE, j * SQUARE_SIZE
            x1, y1 = x0 + SQUARE_SIZE, y0 + SQUARE_SIZE
            rect = canvas.create_rectangle(x0, y0, x1, y1, fill=color_grid[i][j])
            # 绑定点击事件时传递对应单元格的索引
            canvas.tag_bind(rect, '<Button-1>', lambda e, x=i, y=j: on_click(e, x, y))

# 初始化窗口与画布
root = tk.Tk()
canvas = tk.Canvas(root, width=GRID_SIZE*SQUARE_SIZE, height=GRID_SIZE*SQUARE_SIZE)
canvas.pack()

draw_board(canvas)
root.mainloop()

关键修改说明

传递单元格索引：在draw_board绑定点击事件时，用lambda将当前单元格的i、j索引传递给on_click函数，解决了点击时无法直接获取对应位置的问题。
颜色切换逻辑：通过判断当前单元格颜色，切换为另一种颜色，同时同步更新color_grid数据和画布视图，保证数据与界面状态一致。
索引打印：直接使用传递的i、j值打印格式为(i, j)的索引字符串。