wxpython nesting panels and sizers

Question

I'm relatively new to wxPython and am trying to build a GUI. The idea is as follows: I want to columns next to each other. The left column has a width of 1/3 of the total width and contains a list of buttons stacked vertically. The right column has the remaining 2/3 width and contains two vertically stacked staticTexts.

I've tried to create a main panel with a horizontal box sizer, containing two panels with vertical boxsizers. All the buttons (and probably the text) seem to be stacked on the same place though.

My code:

wx.Frame.__init__(self, None, wx.ID_ANY, "Load coordinates", size=(600,600))
mainPanel = wx.Panel(self, wx.ID_ANY, size=(600,600))
btnPanel = wx.Panel(self, wx.ID_ANY, size=(600,300))
txtPanel = wx.Panel(self, wx.ID_ANY, size=(600,300))

# create the buttons and bindings
btn1 = wx.Button(btnPanel, 1, label="1")
btn2 = wx.Button(btnPanel, 2, label="2")
btn3 = wx.Button(btnPanel, 3, label="3")
btn4 = wx.Button(btnPanel, 4, label="4")
btn5 = wx.Button(btnPanel, 5, label="5")

# create static text field
text1 = wx.StaticText(txtPanel, 6) 

# put the buttons in a sizer
btnSizer = wx.BoxSizer(wx.VERTICAL)
btnSizer.Add(btn1, 1, wx.ALL|wx.LEFT|wx.EXPAND, 1)
btnSizer.Add(btn2, 1, wx.ALL|wx.LEFT|wx.EXPAND, 1)
btnSizer.Add(btn3, 1, wx.ALL|wx.LEFT|wx.EXPAND, 1)
btnSizer.Add(btn4, 1, wx.ALL|wx.LEFT|wx.EXPAND, 1)

# create line for visual
btnLine = wx.StaticLine(self)
btnSizer.Add(btnLine, 1, wx.ALL|wx.LEFT|wx.EXPAND, 20)

# last button
btnSizer.Add(btn5, 1, wx.ALL|wx.LEFT|wx.EXPAND, 1)

# put text in a sizer
txtSizer = wx.BoxSizer(wx.VERTICAL)
txtSizer.Add(text1, 1, wx.ALL|wx.LEFT|wx.EXPAND, 1)

btnPanel.SetSizer(btnSizer)
txtPanel.SetSizer(txtSizer)

# add panels to main panel
mainSizer = wx.BoxSizer(wx.HORIZONTAL)
mainSizer.Add(btnPanel, 1, wx.EXPAND, 5)
mainSizer.Add(txtPanel, 1, wx.EXPAND, 5)
mainPanel.SetSizer(mainSizer)

Can anybody see why this is not working as expected?

Mike Driscoll Mike Driscoll · Accepted Answer · 2015-03-19T13:07:09

Actually you almost always make the panel the parent of your widgets. Not only does this provide the correct look-and-feel across all platforms, but it also enables the ability to tab correctly across the widgets. Also you shouldn't be using your own ids, especially ones that are so low. Those ids are probably reserved by wxPython itself and could cause some really strange behavior.

Here's an example that shows how to do what you want (or close to it):

import wx

########################################################################
class MyPanel(wx.Panel):
    """"""

    #----------------------------------------------------------------------
    def __init__(self, parent):
        """Constructor"""
        wx.Panel.__init__(self, parent)

        main_sizer = wx.BoxSizer(wx.HORIZONTAL)
        btn_sizer = wx.BoxSizer(wx.VERTICAL)
        txt_sizer = wx.BoxSizer(wx.VERTICAL)

        for i in range(5):
            btn = wx.Button(self, label='%s' % i)
            btn_sizer.Add(btn, 0, wx.ALL|wx.LEFT)

        txt = wx.TextCtrl(self, style=wx.TE_MULTILINE)
        txt_sizer.Add(txt, 1, wx.EXPAND)

        main_sizer.Add(btn_sizer, 1)
        main_sizer.Add(txt_sizer, 2, wx.EXPAND)

        self.SetSizer(main_sizer)


########################################################################
class MainFrame(wx.Frame):
    """"""

    #----------------------------------------------------------------------
    def __init__(self):
        """Constructor"""
        wx.Frame.__init__(self, None, title='Nesting Panels')
        panel = MyPanel(self)
        self.Show()

if __name__ == '__main__':
    app = wx.App(False)
    frame = MainFrame()
    app.MainLoop()

wxpython nesting panels and sizers

2 Answers