Python - Tkinter - Widgets created inside a class inherited from Toplevel() appear in a different frame OUTSIDE the class, Toplevel() class is empty

Question

I'm attempting to create a class and inherit from Toplevel() so that the GUI elements of the class can be contained within a separate window. Usually I would just inherit from Frame() but for my purpose I need everything to be in a window. I'm writing the code in my GUI template script just so I can figure out how to get it working before I stick it in the actual script I want to use it in. Here is the code:

from Tkinter import *
import socket

myplayername = ''

class Application(Frame):
    def __init__(self, master=None):
        Frame.__init__(self, master)
        self.pack()

        class InfoLabel(Frame):
            def __init__(self, name, value, bgc, nfgc, vfgc, master=None):
                Frame.__init__(self, master)
                self.pack()
                Label(master=self, text=name, bg=bgc, fg=nfgc).pack({"side": "left"})
                Label(master=self, text=value, bg=bgc, fg=vfgc).pack({"side": "left"})

        class LabelEntry(Frame):
            def __init__(self, name, variable, bgc, fgc, entrysize, master=None):
                Frame.__init__(self, master)
                self.pack()
                Label(master=self, text=name, bg=bgc, fg=fgc).pack({"side": "left"})
                Entry(master=self, textvariable=variable, bg=bgc).pack({"side": "left"})

        class HostGameWindow(Toplevel):
            def __init__(self):
                global myplayername
                Toplevel.__init__(self)
                self.title('Host a Game')
                hostname = socket.gethostname()
                hostipaddr = socket.gethostbyname(hostname)
                hostport = 11489
                players = 0

                portsv = StringVar(value=str(hostport))
                numofplayers = StringVar(value=str(players))
                myname = StringVar(value=myplayername)

                hostgameframe = Frame(master=self, bg='#999', bd=3, relief=RIDGE, padx=5, pady=5).pack({"side": "left"})
                hoststatusframe = Frame(master=self, bg='white', bd=3, relief=RIDGE).pack({"side": "left"})
                hostbuttonframe = Frame(master=hostgameframe, bd=2, relief=RAISED, padx=5, pady=5).pack({"side": "bottom"})
                InfoLabel(master=hostgameframe, name='Hostname:', value=hostname, bgc='#999', nfgc='blue', vfgc='red').pack({"side": "top"})
                InfoLabel(master=hostgameframe, name='IP Address:', value=hostipaddr, bgc='#999', nfgc='blue', vfgc='red').pack({"side": "top"})
                LabelEntry(master=hostgameframe, name='Host on port:', variable=portsv, bgc='#999', fgc='blue', entrysize=len(str(hostport))).pack({"side": "top"})
                LabelEntry(master=hostgameframe, name='Players Joining:', variable=numofplayers, bgc='#999', fgc='blue', entrysize=2).pack({"side": "top"})
                LabelEntry(master=hostgameframe, name='Player Name:', variable=myname, bgc='#999', fgc='blue', entrysize=16).pack({"side": "top"})
                Button(master=hostbuttonframe, text='Host Game', width=10).pack({"side": "left"})
                Button(master=hostbuttonframe, text='Start Game', width=10).pack({"side": "left"})

            def close():
                self.destroy()

        def HostGameDialog():
            HostGameWindow()

        Button(master=self, text='Host a Game', command=HostGameDialog).pack()




root = Tk()
app = Application(master=root)
#root.wm_iconbitmap(default='INSERT ICON HERE')
#root.wm_title("TITLE OF PROGRAM")
#app.master.maxsize(640, 480)
app.master.minsize(640, 480)
app.master.resizable(0, 0)
app.mainloop()
app.quit()

Now for some reason when I click the 'Host a Game' Button, it calls the HostGameDialog() function and it creates the HostGameWindow() , BUT the window that gets created is sized down as small as it can be and all the GUI elements that should be contained in the HostGameWindow() class instead appear in the main Application() frame. And the thing which is really wierd to me is that it doesn't give any errors, it just puts all the widgets inside the main application frame instead of the Toplevel() that gets created.

What the heck am I doing wrong? Why aren't any the widgets placed inside the Toplevel() ? I've been at it for hours now and nothing is making sense. Please if you know anything that could be of some help to me let me know.

Wow, I've never had to wait so long for reply here before, this must be a pretty nifty problem, I still don't know what to do. Any ideas are greatly appreciated!

I guess no one know what to make of this... I'll keep checking here though!

SOLVED! turns out its not a good idea to create AND pack a widget on the same line if you create a reference to it. Creating and packing a widget on the same line only works if you just call the Widget(args*).pack(args*) without creating a reference to it.

Answer 1

When you do x=a().b() , what is stored in x is the result of b() .

Consider the following line of code:

hostgameframe = Frame(self, bg='#999', bd=3, 
    relief=RIDGE, padx=5, pady=5).pack({"side": "left"})

If we collapse all of the options (for clarity) we're left with this:

hostgameframe = Frame(...).pack(...)

Can you see what's happening? hostgameframe is being set to the result of pack(...) . pack always returns None , so hostgameframe is None . When you later create another widget and set this as it's master, that widget ends up going in the main window.

So, to solve your problem you need to separate the creation of the widget from the layout. Personally I think this is a best practice that you should always adhere to. For cases where you don't need to keep a reference to the widget, combining them into one statement is harmless. Even so, I think your code will be easier to manage if you get in the habit of always separating widget creation from widget layout.

hostgameframe = Frame(self, bg='#999', bd=3, relief=RIDGE, padx=5, pady=5)
hostgameframe.pack({"side": "left"})