Search code examples
pythonwxpythonwxwidgets

Elements between panels are not aligned within a sizer


I have two panels to which I am both adding to a single sizer at the top level, however the elements within those panels are not aligned with each other.

Here is a simple example to demonstrate what I am trying to achieve.

import wx

class MyPanel(wx.Panel):
    def __init__(self, parent):
        super(MyPanel, self).__init__(parent=parent)
        mygridsizer = wx.GridBagSizer()    

        sizer = wx.BoxSizer(orient=wx.HORIZONTAL)
        sizer.Add(wx.StaticText(self,label="Hello world"))
        sizer.Add(wx.Button(self, label="hello"))
        mygridsizer.Add(sizer, pos=(0,0))
        mygridsizer.Add(wx.ComboBox(self), pos=(0,1))
        self.SetSizer(mygridsizer)

class MyPanel2(wx.Panel):
    def __init__(self, parent):
        super(MyPanel2, self).__init__(parent=parent)
        sizer = wx.BoxSizer(orient=wx.HORIZONTAL)
        sizer.Add(wx.Button(self, label="non-aligned button"))
        self.SetSizer(sizer)

class MainFrame(wx.Frame):
    def __init__(self, parent):
        super(MainFrame, self).__init__(None)
        sizer = wx.GridSizer(3, 1)
        panel1 = MyPanel(parent=self)
        panel2 = MyPanel2(parent=self)
        sizer.Add(panel1)
        sizer.Add(panel2)
        self.SetSizer(sizer)

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

With the example above, what can I do to align the buttons of both the panels?


Solution

  • The problem is the sizer is aligning the Panels, if you want the buttons aligned you should make them part of the same sizer (not part of two Panels with their own sizers). You could also do something like this for a quick hack (essentially adding a spacer the same size as the text):

    import wx
    
    class MyPanel(wx.Panel):
        def __init__(self, parent):
            super(MyPanel, self).__init__(parent=parent)
            mygridsizer = wx.GridBagSizer()    
    
            sizer = wx.BoxSizer(orient=wx.HORIZONTAL)
            sizer.Add(wx.StaticText(self,label="Hello world"))
            sizer.Add(wx.Button(self, label="hello"))
            mygridsizer.Add(sizer, pos=(0,0))
            mygridsizer.Add(wx.ComboBox(self), pos=(0,1))
            self.SetSizer(mygridsizer)
    
    class MyPanel2(wx.Panel):
        def __init__(self, parent):
            super(MyPanel2, self).__init__(parent=parent)
            sizer = wx.BoxSizer(orient=wx.HORIZONTAL)
            t = wx.StaticText(self,label="Hello world")
            t.Hide()
            t.GetSize()
            sizer.Add(t.GetSize())
            sizer.Add(wx.Button(self, label="non-aligned button"))
            self.SetSizer(sizer)
    
    class MainFrame(wx.Frame):
        def __init__(self, parent):
            super(MainFrame, self).__init__(None)
            sizer = wx.GridSizer(3, 1)
            panel1 = MyPanel(parent=self)
            panel2 = MyPanel2(parent=self)
            sizer.Add(panel1)
            sizer.Add(panel2)
            self.SetSizer(sizer)
    
    if __name__ == '__main__':
        app = wx.App()
        frame = MainFrame(None)
        frame.Show()
        app.MainLoop()