Layout Trouble

Bulkan-Savun_Evcimen · September 19, 2006, 12:32am

Hi All,

Just wondering why doesnt the GenericDirCtrl in the following code expand and fill out the whole leftPanel ?


import wx
class ConvertPanel(wx.Panel):

def init(self,parent):
    wx.Panel.__init__(self, parent, -1)

    sz = wx.BoxSizer(wx.HORIZONTAL)

    leftPanel = wx.Panel(self,-1)
    leftPanel.SetBackgroundColour('RED')
    leftPanelSizer = wx.BoxSizer

(wx.VERTICAL)
    dir = wx.GenericDirCtrl(leftPanel,-1,size=(200,266),style=0)
    leftPanelSizer.Add(dir,1,wx.EXPAND)

    rightPanel = wx.Panel(self,-1)
    rightPanel.SetBackgroundColour

(‘YELLOW’)

rightPanelSizer = wx.BoxSizer(wx.VERTICAL)
    sz.Add(leftPanel,1,wx.EXPAND)
    sz.Add(rightPanel,1,wx.EXPAND)

    self.SetSizer(sz)
    self.SetBackgroundColour('BLUE')

class TestFrame(wx.Frame):

def init(self):

wx.Frame.init(self,None, -1, title = “ConvertPanel”)

cp = ConvertPanel(self)
if name == ‘main’:

app = wx.PySimpleApp()

frame = TestFrame()

frame.Show()

app.MainLoop()

Cheers

···

–
http://bulkan.googlepages.com/home

Bulkan-Savun_Evcimen · September 19, 2006, 1:40am

Hi all,

At the moment im trying to create a GUI for my program PyPsp ( http://sourceforge.net/projects/pypsp ) and the previous post was just to get me started on the Sizers. Ive drawn up the two Panels i need to add to a Notebook. But im stuck. I do not know where to begin in which Sizer is best suited for the layout ive drawn. Ive attached a image that contains one of the two panels, if anyone has any idea’s on the layout code, then i will greatly appreciate it.

Cheers

···

On 9/19/06, Bulkan-Savun Evcimen bulkan@gmail.com wrote:

Hi All,

Just wondering why doesnt the GenericDirCtrl in the following code expand and fill out the whole leftPanel ?
import wx class ConvertPanel(wx.Panel): def init(self,parent): wx.Panel.__init__(self, parent, -1) sz = wx.BoxSizer(wx.HORIZONTAL) leftPanel = wx.Panel(self,-1) leftPanel.SetBackgroundColour('RED') leftPanelSizer = wx.BoxSizer (wx.VERTICAL) dir = wx.GenericDirCtrl(leftPanel,-1,size=(200,266),style=0) leftPanelSizer.Add(dir,1,wx.EXPAND) rightPanel = wx.Panel(self,-1) rightPanel.SetBackgroundColour (‘YELLOW’) rightPanelSizer = wx.BoxSizer(wx.VERTICAL) sz.Add(leftPanel,1,wx.EXPAND) sz.Add(rightPanel,1,wx.EXPAND) self.SetSizer(sz) self.SetBackgroundColour (‘BLUE’) class TestFrame(wx.Frame): def init(self): wx.Frame.init(self,None, -1, title = “ConvertPanel”) cp = ConvertPanel(self) if name == ‘main’: app = wx.PySimpleApp() frame = TestFrame() frame.Show() app.MainLoop()
Cheers

–

http://bulkan.googlepages.com/home

–
http://bulkan.googlepages.com/home

Horst_Herb2 · September 19, 2006, 1:56am

B: vertical box sizer, contains wx.GeericDirCtrl + horizontal box sizer "D"
C: verical box sizer, contains w.Gauge, + horizontal box sizer "E" +
wx.ListCtrl
D: horizontal box sizer, conatins wx.List + Add button
E: horizontal box sizer, contains start and abort buttons

It's really easy - think boxes within boxes, and each box either adds members
horizontally or vertically

Horst

···

On Tuesday 19 September 2006 11:40, Bulkan-Savun Evcimen wrote:

At the moment im trying to create a GUI for my program PyPsp (
PyPsp - Open Source PSP Video Manager download | SourceForge.net ) and the previous post was just to
get me started on the Sizers. Ive drawn up the two Panels i need to add to
a Notebook. But im stuck. I do not know where to begin in which Sizer is
best suited for the layout ive drawn. Ive attached a image that contains
one of the two panels, if anyone has any idea's on the layout code, then i
will greatly appreciate it.

A: Horizontal box sizer -> contains sizers "B" and "C"

Bulkan-Savun_Evcimen · September 19, 2006, 3:28am

Thanks for the tip, i will give this a try!

Cheers

···

On 9/19/06, Horst Herb subscriptions@gnumed.net wrote:

On Tuesday 19 September 2006 11:40, Bulkan-Savun Evcimen wrote:

At the moment im trying to create a GUI for my program PyPsp (
http://sourceforge.net/projects/pypsp
) and the previous post was just to
get me started on the Sizers. Ive drawn up the two Panels i need to add to
a Notebook. But im stuck. I do not know where to begin in which Sizer is
best suited for the layout ive drawn. Ive attached a image that contains

one of the two panels, if anyone has any idea’s on the layout code, then i
will greatly appreciate it.

A: Horizontal box sizer → contains sizers “B” and “C”
B: vertical box sizer, contains wx.GeericDirCtrl + horizontal box sizer “D”
C: verical box sizer, contains w.Gauge, + horizontal box sizer “E” +
wx.ListCtrl
D: horizontal box sizer, conatins wx.List + Add button
E: horizontal box sizer, contains start and abort buttons

It’s really easy - think boxes within boxes, and each box either adds members
horizontally or vertically

Horst

–

http://bulkan.googlepages.com/home

Bulkan-Savun_Evcimen · September 19, 2006, 7:09am

Do you mean ;

A (Panel): uses a BoxSizer(Horizontal), and Contains two Panels “B” and “C”

B (Panel): BoxSizer(Vertical), wx.GenericDirCtrl + “D”
C (Panel): BoxSizer(Vertical), wx.Gauge + “E” + wx.ListCtrl
D (Panel): BoxSizer(Horizontal), conatins wx.ListBox + Add button
E (Panel): BoxSizer(Horizontal), contains start and abort buttons

Im getting confused in how you say that A is a vertical BoxSizer which contains two other sizers, as a window can contain only one sizer (?)

Cheers

···

On 9/19/06, Horst Herb subscriptions@gnumed.net wrote:

On Tuesday 19 September 2006 11:40, Bulkan-Savun Evcimen wrote:

At the moment im trying to create a GUI for my program PyPsp (
http://sourceforge.net/projects/pypsp
) and the previous post was just to
get me started on the Sizers. Ive drawn up the two Panels i need to add to
a Notebook. But im stuck. I do not know where to begin in which Sizer is
best suited for the layout ive drawn. Ive attached a image that contains

one of the two panels, if anyone has any idea’s on the layout code, then i
will greatly appreciate it.

A: Horizontal box sizer → contains sizers “B” and “C”
B: vertical box sizer, contains wx.GeericDirCtrl + horizontal box sizer “D”
C: verical box sizer, contains w.Gauge, + horizontal box sizer “E” +
wx.ListCtrl
D: horizontal box sizer, conatins wx.List + Add button
E: horizontal box sizer, contains start and abort buttons

It’s really easy - think boxes within boxes, and each box either adds members
horizontally or vertically

–

http://bulkan.googlepages.com/home

Kent_Quirk · September 19, 2006, 12:22pm

Bulkan-Savun Evcimen wrote:

On
Tuesday 19 September 2006 11:40, Bulkan-Savun Evcimen wrote:

At the moment im trying to create a GUI for my program PyPsp (

http://sourceforge.net/projects/pypsp
) and the previous post was just to

get me started on the Sizers. Ive drawn up the two Panels i need
to add to

a Notebook. But im stuck. I do not know where to begin in which
Sizer is

best suited for the layout ive drawn. Ive attached a image that
contains

one of the two panels, if anyone has any idea’s on the layout
code, then i

will greatly appreciate it.

A: Horizontal box sizer → contains sizers “B” and “C”

B: vertical box sizer, contains wx.GeericDirCtrl + horizontal box sizer
“D”

C: verical box sizer, contains w.Gauge, + horizontal box sizer “E” +

wx.ListCtrl

D: horizontal box sizer, conatins wx.List + Add button

E: horizontal box sizer, contains start and abort buttons

It’s really easy - think boxes within boxes, and each box either adds
members

horizontally or vertically

Do you mean ;

A (Panel): uses a BoxSizer(Horizontal), and Contains two Panels “B”
and “C”

B (Panel): BoxSizer(Vertical), wx.GenericDirCtrl + “D”

C (Panel): BoxSizer(Vertical), wx.Gauge + “E” + wx.ListCtrl

D (Panel): BoxSizer(Horizontal), conatins wx.ListBox + Add button

E (Panel): BoxSizer(Horizontal), contains start and abort buttons

Im getting confused in how you say that A is a vertical BoxSizer which
contains two other sizers, as a window can contain only one sizer (?)

A window can only be bound to one sizer, but a sizer can contain either
windows, spacers, or other sizers. You can Add a sizer to a sizer. So
you don’t need all those nested panels.

However, it’s been my experience that it’s quite hard to get deeply
nested box sizers to behave properly under resizing. For a layout like
the one you’ve described, I’d seriously consider a GridBagSizer. It’s
perfect for that sort of layout…although if you want things like the
Start and Abort buttons to be the same size, you might want to put THEM
into a GridSizer first, and then add the GridSizer to a GridBagSizer.

The key with sizers is to start small and work your way up to the
complex layouts you’re thinking of. If you try to do it all at once
you’ll be messing with sizer parameters until you pull all your hair
out.

···

On 9/19/06, Horst Herb subscriptions@gnumed.net > wrote:

Bulkan-Savun_Evcimen · September 19, 2006, 12:46pm

Bulkan-Savun Evcimen wrote:

On
Tuesday 19 September 2006 11:40, Bulkan-Savun Evcimen wrote:

At the moment im trying to create a GUI for my program PyPsp (

http://sourceforge.net/projects/pypsp
) and the previous post was just to

get me started on the Sizers. Ive drawn up the two Panels i need
to add to

a Notebook. But im stuck. I do not know where to begin in which
Sizer is

best suited for the layout ive drawn. Ive attached a image that
contains

one of the two panels, if anyone has any idea’s on the layout
code, then i

will greatly appreciate it.

A: Horizontal box sizer → contains sizers “B” and “C”

B: vertical box sizer, contains wx.GeericDirCtrl + horizontal box sizer
“D”

C: verical box sizer, contains w.Gauge, + horizontal box sizer “E” +

wx.ListCtrl

D: horizontal box sizer, conatins wx.List + Add button

E: horizontal box sizer, contains start and abort buttons

It’s really easy - think boxes within boxes, and each box either adds
members

horizontally or vertically

Do you mean ;

A (Panel): uses a BoxSizer(Horizontal), and Contains two Panels “B”
and “C”

B (Panel): BoxSizer(Vertical), wx.GenericDirCtrl + “D”

C (Panel): BoxSizer(Vertical), wx.Gauge + “E” + wx.ListCtrl

D (Panel): BoxSizer(Horizontal), conatins wx.ListBox + Add button

E (Panel): BoxSizer(Horizontal), contains start and abort buttons

Im getting confused in how you say that A is a vertical BoxSizer which
contains two other sizers, as a window can contain only one sizer (?)

A window can only be bound to one sizer, but a sizer can contain either
windows, spacers, or other sizers. You can Add a sizer to a sizer. So
you don’t need all those nested panels.

How would you add a Sizer to a Sizer ? Just a quick example maybe the layout of the left side (the one containing the GenericDirCtrl, the ListBox and the Add button)

However, it’s been my experience that it’s quite hard to get deeply
nested box sizers to behave properly under resizing. For a layout like
the one you’ve described, I’d seriously consider a GridBagSizer. It’s
perfect for that sort of layout…although if you want things like the
Start and Abort buttons to be the same size, you might want to put THEM
into a GridSizer first, and then add the GridSizer to a GridBagSizer.

I think i need to look at GridBagSizer, i just the LeftPanel layout working (all layed out) but it seems to ugly. See below

The key with sizers is to start small and work your way up to the
complex layouts you’re thinking of. If you try to do it all at once
you’ll be messing with sizer parameters until you pull all your hair
out.

import wx

class ConvertPanel(wx.Panel):
def init(self,parent):
wx.Panel.init(self, parent, -1)
box = wx.BoxSizer(wx.HORIZONTAL)
self.leftPanel
= self.createLeftPanel()
box.Add(self.leftPanel,1,wx.EXPAND)
self.SetSizer(box)

def createLeftPanel(self):
leftPanel = wx.Panel(self,-1)
box = wx.BoxSizer(wx.VERTICAL)

  self.dir = wx.GenericDirCtrl(leftPanel,-1)
  box.Add(self.dir,1,wx.EXPAND)

  self.buttonPanel = wx.Panel(self,-1)
  box.Add(self.buttonPanel,1,wx.EXPAND)

  buttonPanelSizer = wx.BoxSizer

(wx.HORIZONTAL)
self.buttonPanel.SetSizer(buttonPanelSizer)

  self.outputTypeList = wx.ListBox(self.buttonPanel,-1,choices=("MP4","AVC"))
  buttonPanelSizer.Add(self.outputTypeList

,1,wx.EXPAND)

  leftPanel.SetSizer(box)
  return leftPanel

···

On 9/19/06, Kent Quirk kent_quirk@cognitoy.com wrote:

On 9/19/06, Horst Herb < > > subscriptions@gnumed.net> > > wrote:

–
http://bulkan.googlepages.com/home

Mel_Wilson · September 19, 2006, 2:57pm

Bulkan-Savun Evcimen wrote:

How would you add a Sizer to a Sizer ? Just a quick example maybe the layout
of the left side (the one containing the GenericDirCtrl, the ListBox and the
Add button)

Just in the ordinary way. Here's something I posted before:

         # Prepare sizers for laying out the console components
         hs = self.sizer = wx.BoxSizer (wx.HORIZONTAL)
         self.leftTabsSizer = wx.BoxSizer (divisional_sizer_style)
         hs.Add (self.leftTabsSizer, 2, wx.GROW)

         cs = wx.BoxSizer (wx.VERTICAL)
         self.generalTabsSizer = wx.GridSizer (0, 4)
         self.keyboardSizer = wx.BoxSizer (wx.VERTICAL)
         self.keyboardSizer.Add ((5,5),0)
         self.expressionSizer = wx.BoxSizer (wx.HORIZONTAL)
         self.expressionSizer.Add ((5,5), 0)
         cs.Add (self.generalTabsSizer, 1, wx.GROW)
         cs.Add (self.keyboardSizer, 1, wx.GROW)
         cs.Add (self.expressionSizer, 1, wx.GROW)
         hs.Add (cs, 3, wx.GROW)

self.rightTabsSizer = wx.BoxSizer (divisional_sizer_style)
hs.Add (self.rightTabsSizer, 2, wx.GROW)

         self.SetAutoLayout (True)
         self.SetSizer (hs)
         hs.Fit (self)
         hs.SetSizeHints (self)

self.SetSize ( (400,300) )

This layout gives a vertical column down each side, and a
center column with 3 stacked boxes. The proportions given
in the .Add calls ensure left-right symmetry.
Note that there are no controls there at all. In the
application they're added later based on a configuration
file and run-time commands. Adding a control to the appropriate
sizer automagically puts it in the appropriate place on the layout.

Cheers, Mel.

Chris_Barker1 · September 19, 2006, 4:36pm

Bulkan-Savun Evcimen wrote:

Do you mean ;

A (Panel): uses a BoxSizer(Horizontal), and Contains two Panels "B" and "C"
B (Panel): BoxSizer(Vertical), wx.GenericDirCtrl + "D"

Im getting confused in how you say that A is a vertical BoxSizer which
contains two other sizers, as a window can contain only one sizer (?)

This is one of the major sources of confusion (and power) with wxPython:

There are three parallel, yet distinct hierarchies when building your GUI:

The wx parent-child hierarchy:
- controls on Panels on Panels, on Frames, etc.

The Python class hierarchy:
- subclasses of wxPanels, etc, and the controls on them.

The Sizer hierarchy:
-- controls in sizers, in sizers, in... on a Panel, etc.

The trick as that these different hierarchies can be mixed and matched in unlimited ways.

* The key point you NEED to know:

Sizers are ONLY used to do layout of controls, they don't have anything to do with the parent-child relationships or Python classes. However, I'm pretty sure that the controls in a given Sizer hierarchy have to have the same parent.

* My advise for good design:

Use a Python class (usually a subclass of wx.Panel) to group controls that have are logically used together. Usually, controls that work together also should be arranged together in your GUI, so this works well. If you find yourself writing code like:

self.panel1 = wx.Panel(self, ...)
self.panel2 = wx.Panel(self.panel1, ...)
self.AButton = wx.Button(self.panel2, ....)

You've got a LOT of nested parent-child relationships all in one Python class. Chances are You'd be better of with panel2 as it's own class, and probably panel1 also.

For instance, I'm not sure what functionality you're going for, but it looks like it might make sense for the stuff in the upper right of your layout (wx.Gauge and Start and Abort) to be all on a custom wx.Panel class.

See:
http://wiki.wxpython.org/index.cgi/wxPython_Style_Guide

For some more hints.

-Chris

···

--
Christopher Barker, Ph.D.
Oceanographer

NOAA/OR&R/HAZMAT (206) 526-6959 voice
7600 Sand Point Way NE (206) 526-6329 fax
Seattle, WA 98115 (206) 526-6317 main reception

Chris.Barker@noaa.gov

Robin · September 19, 2006, 6:52pm

Christopher Barker wrote:

* The key point you NEED to know:

Sizers are ONLY used to do layout of controls, they don't have anything to do with the parent-child relationships or Python classes. However, I'm pretty sure that the controls in a given Sizer hierarchy have to have the same parent.

Correct. Any widget managed by a sizer or any of the sub-sizers added to it all need to have the same parent window, and that is the window that you use when calling window.SetSizer.

There is a bit of fuzziness there though as you can logically think of a sizer hierarchy as crossing parent-child boundaries, or rather, that their *effects* can cross that boundary. For example, let's say that you have a panel that contains three other child-panels, each with their own set of controls and a sizer(s) to manage the layout of those controls. Now if you use a sizer to manage the layout of the child-panels within the parent-panel, then the sizers on the child-panels will be used to determine what is the best size for each of those panels, and that will be used by the parent-panel's sizer to determine what its best size is, and how to do the layout of the child-panels.

···

--
Robin Dunn
Software Craftsman
http://wxPython.org Java give you jitters? Relax with wxPython!