Tkinter 16 grids (4x4 orientation) with 5x5 button

Question

I have this simple 5x5 button grid:

from tkinter import *

class App():
    def __init__(self, root):
        self.root = root
        self.TopFrame = Frame(root)
        self.BottomFrame = Frame(root)
        self.TopFrame.grid(row=0)
        self.BottomFrame.grid(row=6)

        buttonQ = Button(self.BottomFrame, text="Quit", command=quit)
        buttonS = Button(self.BottomFrame, text="Save", command=self.saveToFile)
        buttonS.grid(row=0, column=0, padx=10)
        buttonQ.grid(row=0, column=1, padx=10)

def Function(self):
    self.grid = []
    for i in range(5):
        row = []
        for j in range(5):
            row.append(Button(self.TopFrame,width=6,height=3,command=lambda i=i, j=j: self.getClick(i, j),background='gray'))
            row[-1].grid(row=i,column=j)
        self.grid.append(row)

def getClick(self, i, j):
    orig_color = self.grid[i][j].cget('bg')
    if orig_color=="red":
        self.grid[i][j]["bg"]="gray"
    else:
        self.grid[i][j]["bg"]="red"

def saveToFile(self):
    myFile=open("example.txt", 'w')
    for line in range(5):
        for column in range(5):
            bg_color = self.grid[line][column].cget('bg')
            if bg_color == "red":
                myFile.write("1 ")
            else:
                myFile.write("0 ")
        myFile.write("\n")
    #myFile.flush()
    myFile.close()
    myFile = open("example.txt",'r')
    print(myFile.read())
    myFile.close()

root = Tk()
app = App(root)
app.Function()
root.mainloop()

which I want to multiply 16 times (arranged in a matrix with 4 rows and 4 columns - one cell having a 5x5 button matrix) with space between them and the 'Quit' and 'Save' button bellow all. Can I achieve that only by using frames? Is there a way to multiply the 5x5 button grid 16 times and arrange it as a 4x4 matrix?

I'm new in Python programming so please be gentle :)

Answer 1

To follow the abstraction principle of programming, you could define your 5-by-5 button cell as a class (outside your App class) like below:

class Cell5by5():
    def __init__(self, parent):
        self.frame = Frame(parent)
        self.buttons = []
        for i in range(5):
            row = []
            for j in range(5):
                row.append(Button(self.frame,width=6,height=3,
                                  command=lambda i=i, j=j: self.getClick(i, j),
                                  background='gray'))
                row[-1].grid(row=i,column=j)
            self.buttons.append(row)

    def getClick(self, i, j):
        orig_color = self.buttons[i][j].cget('bg')
        if orig_color=="red":
            self.buttons[i][j]["bg"]="gray"
        else:
            self.buttons[i][j]["bg"]="red"

Then in your App class, you can create as many Cell5by5 instances as you need:

class App():
    def __init__(self, root):
        self.root = root
        ...
        self.create_cells()

    def create_cells(self):
        self.cells = []
        for i in range(4):
            row = []
            for j in range(4):
                row.append(Cell5by5(self.root))
                row[-1].frame.grid(row=i, column=j, padx=2, pady=2)
            self.cells.append(row)

    def saveToFile(self):
        # Each button is now obtainable by calling:
        # self.cells[line][column].buttons[subline][subcolumn]

root = Tk()
app = App(root)
root.mainloop()

Also, I renamed your grid of buttons as self.buttons to prevent confusion with tkinter's .grid() method