Why is not presented the custoned widget

Question

I want to present the left customed widget 3 times. Left, center and right.

I have trying to follow and mix some examples I have found, but I only get one widget presented.

I have added colout to get some clues, but I am not able to find what I am doing wrong.

This is the code:

import sys
import tkinter as tk
#import tkinter.ttk, Font, Label, Frame as tk
#import tkinter.ttk as tk

#https://stackoverflow.com/questions/27614037/python-3-tkinter-create-text-widget-covering-100-width-with-grid?rq=1
# https://stackoverflow.com/questions/7591294/how-to-create-a-self-resizing-grid-of-buttons-in-tkinter
# http://effbot.org/tkinterbook/grid.htm

# 02. Pruebo cambiando llamada de funcion de clase a metodo de instancia  

class   Cuadro(tk.Frame):
    def __init__(self, parent, *args, **kargs):

        # super().__init__(root)
        tk.Frame.__init__(self, parent, *args, **kargs)

        #Create & Configure frame 

        frame = tk.Frame(parent)       
        frame.grid(row=0, column=0, sticky="NSEW")



        #Create a 3x3 (rows x columns) grid of labels inside the frame
        for row_index in range(3):
        #tk.Grid.rowconfigure(frame, row_index, weight=1)               # version 02
            frame.rowconfigure(row_index, weight=1)                     # version 02
            for col_index in range(3):
                #tk.Grid.columnconfigure(frame, col_index, weight=1)    # version 02
                frame.columnconfigure(col_index, weight=1)              # version 02
                lbl = tk.Label(frame, text = str((row_index *3) + col_index + 1)) #create a button inside frame 
                #lbl.grid(row=row_index, column=col_index, sticky=N+S+E+W)
                lbl.grid(row=row_index, column=col_index, sticky="NSEW")



#Create & Configure root
class   Application(tk.Frame):
    def __init__(self, parent):

        tk.Grid.rowconfigure   (parent, 0, weight=1)
        tk.Grid.columnconfigure(parent, 0, weight=1)
        tk.Grid.columnconfigure(parent, 1, weight=1)
        tk.Grid.columnconfigure(parent, 2, weight=1)
        self.cuadro1 = Cuadro(parent)
        self.cuadro1.config(background="red")
        self.cuadro1.grid(row=0, column=0, sticky="NSEW")     
        self.cuadro2 = Cuadro(parent)
        self.cuadro2.config(bg="green")
        self.cuadro2.grid(row=0, column=1, sticky="NSEW")
        self.cuadro3 = Cuadro(parent)
        self.cuadro3.config(bg="blue")
        self.cuadro3.grid(row=0, column=2, sticky="NSEW")


def main():
    root = tk.Tk()
    root.title(sys.argv[0])    # version 02

    myapp = Application(root)
    root.mainloop()

if __name__ == '__main__':
    main()

And this is the result:

!http://imgur.com/XROp68R

What is wrong?

Answer 1

Your three Cuadro objects have no contents at all - they're valid Frames, since you inherited from tk.Frame and called the superclass __init__(), but you did absolutely nothing with them. Instead, each one created an entirely separate Frame, not connected to the Cuadro itself, and placed it at row=0, column=0 in the parent view. Each of these overwrote the previous one, and the red Cuadro which was originally placed at row=0, column=0, so you ended up with a single visible copy of the 3x3 grid, and no red area.

You made the same mistake with Application - it's a valid Frame, but you added nothing to it, instead you created each Cuadro as a direct child of Application's parent (the Tk root window).

It's perfectly valid to have classes that merely create widgets like this, but they shouldn't derive from a Tk widget class if you aren't going to use them as widgets themselves.