Simple Sizer Question Causing a Lot of Problems

Hello -

I am trying to accomplish something pretty straightforward, but I am
running into a problem that is causing from frustration. I know it is
going to be a simple one line solution, but it is escaping me at this
point.

I am trying to create a window that has 2 panels in it. The top panel
is grey and starts at the orgin. The second panel is blue and starts
right below it and fills the rest of the window (800 additional
pixels). I am using a GridBagSizer. When the button is clicked on
the first panel, I am trying to swap out the second panel with a new
one. Right now I have just two panels that I am trying to go back and
forth with each time the button is clicked.

The initial rendering of the window looks great, exactly as I would
expect. However, when I click on the button, it renders the new panel
over top of Top Panel. For some reason it disregards my first panel
and just overwrites it.

Any help in what I am doing wrong? I have a feeling I am missing a
Resize or a Layout somewhere.

My brief application is attached.

If you have any other suggestions on how to swap panels in and out,
please offer them up. I would welcome any suggestions.

Thank you in advance,

John

···

-------------------------------------------
import wx

class TopPanel( wx.Panel ):
    def __init__( self, parent ):

        self.parent = parent

        wx.Panel.__init__( self, parent, -1, pos=(-1,-1), size=(1440,
100), style=wx.TAB_TRAVERSAL, name="BarkerPanel" )

        self.SetBackgroundColour( wx.Colour(255,255,255 ) )

        # Home Button
        self.home_btn = wx.Button(self, -1, "Home", (125,-1), (-1,-1))
        self.Bind(wx.EVT_BUTTON, self.parent.onHomeBtn,
self.home_btn )

        self.button_sizer = wx.BoxSizer(wx.HORIZONTAL)
        self.button_sizer.Add( self.home_btn, 0, wx.EXPAND )

        self.gbs = wx.GridBagSizer( 0, 0 )
        self.gbs.Add( self.button_sizer, (0,0), (1,1),
flag=wx.EXPAND )

        self.SetSizer( self.gbs )

class Panel1( wx.Panel ):
    def __init__( self, parent ):
        wx.Panel.__init__( self, parent, -1, pos=(-1,-1), size=(1440,
800), style=wx.TAB_TRAVERSAL, name="Panel1" )

        self.SetBackgroundColour( wx.Colour(255,0,0) )

        self.gbs = wx.GridBagSizer( 0, 0 )

        self.SetSizer( self.gbs )

class Panel2( wx.Panel ):
    def __init__( self, parent ):
        wx.Panel.__init__( self, parent, -1, pos=(-1,-1), size=(1440,
800), style=wx.TAB_TRAVERSAL, name="Panel2" )

        self.SetBackgroundColour( wx.Colour(0,0,255) )

        self.gbs = wx.GridBagSizer( 0, 0 )

        self.SetSizer( self.gbs )

class MainWndFrame(wx.Frame):
    def __init__( self ):
        wx.Frame.__init__( self, parent=None, id=-1, title="", pos=
(0,0), size=(1440, 900), style=wx.BORDER_NONE|wx.WS_EX_BLOCK_EVENTS,
name="LcdFrame" )

        # Counter to toggle back and forth
        self.counter = 0

        # Create the Barker Panel
        self.top_panel = TopPanel( self )

        # Create the Main Window
        self.content_panel = Panel1( self )

        self.gbs = wx.GridBagSizer( 0, 0 )

        self.gbs.Add( self.top_panel, (0,0), (1,1),
flag=wx.EXPAND )
        self.gbs.Add( self.content_panel, (1,0), (1,1),
flag=wx.EXPAND )

        self.gbs.AddGrowableCol( 0 )
        self.gbs.AddGrowableRow( 1 )

        self.SetSizer( self.gbs )
        self.Layout()

    def onHomeBtn( self, event ):
        print self.counter

        self.gbs.Hide( self.content_panel )

        if self.counter % 2 == 0:
            print "Here"
            self.content_panel = Panel2( self )
        else:
            print "Here 2"
            self.content_panel = Panel1( self )

        self.gbs.Show( self.content_panel )

        self.Refresh( False )

        self.counter += 1
        self.Layout()

class MyApp(wx.App):
    def OnInit(self):
        frame = MainWndFrame()
        self.SetTopWindow( frame )
        frame.Show()
        return 1

if __name__ == "__main__":
    app = MyApp(0)
    app.MainLoop()

Hello,

···

On Aug 14, 2009, at 7:20 PM, John wrote:

Hello -

I am trying to accomplish something pretty straightforward, but I am
running into a problem that is causing from frustration. I know it is
going to be a simple one line solution, but it is escaping me at this
point.

I am trying to create a window that has 2 panels in it. The top panel
is grey and starts at the orgin. The second panel is blue and starts
right below it and fills the rest of the window (800 additional
pixels). I am using a GridBagSizer. When the button is clicked on
the first panel, I am trying to swap out the second panel with a new
one. Right now I have just two panels that I am trying to go back and
forth with each time the button is clicked.

The initial rendering of the window looks great, exactly as I would
expect. However, when I click on the button, it renders the new panel
over top of Top Panel. For some reason it disregards my first panel
and just overwrites it.

Any help in what I am doing wrong? I have a feeling I am missing a
Resize or a Layout somewhere.

My brief application is attached.

If you have any other suggestions on how to swap panels in and out,
please offer them up. I would welcome any suggestions.

1) I would suggest just using a simple BoxSizer for this since you only need two items in it at a time.

2) I posted an example of doing just this earlier today so look through the messages from earlier today.

Cody

Hello -

I am trying to accomplish something pretty straightforward, but I am

running into a problem that is causing from frustration. I know it is

going to be a simple one line solution, but it is escaping me at this

point.

I just almost finished this and Cody responded with help. There’s
a few differences, so I’ll just post this too if it is helpful…

I tried to figure out what was going on but found your code to have

aspects that made it a bit confusing (like having gridBagSizers
everywhere, though only one was used, the count thing, etc.).
See the point about sample apps below.

If you have any other suggestions on how to swap panels in and out,

please offer them up. I would welcome any suggestions.

Yes, attached is a simplified version of your code that just uses
a wxBoxSizer, and a small function that swaps shown/hidden panels.
(This is a different approach than Cody’s, which Destroys() panels;

here I am hiding and showing them…Not sure if there are any pros
and cons to either, but it is just a different way).

Couple of points:

  • If you’re going to post a sample app, I found it harder to deal with when
    you set it up with no close box. I changed that in my sample.

  • Indents in Python are conventionally 4 spaces, not 3.

  • For the purposes of a sample app, you should not put sizers
    on all the subpanels, since there is nothing in them. Just keep it
    as simple as possible. See:

http://wiki.wxpython.org/MakingSampleApps

  • Sizers are smart as regards Hide() and Show(), and so if something
    is hidden, they will resize the shown panel accordingly as long as you
    call Layout() on the parent panel or frame afterwards.

  • But…This sort of thing is better handled in any of the book controls,

like a wxToolbook, since that’s just what they do. See the demo.

Che

swapping_panels.py (2.42 KB)

···

On Fri, Aug 14, 2009 at 8:20 PM, John jmw136@gmail.com wrote: