layout organization

Hello,
I have wrote the code attached, that's a simple 'save as' window layout,
but it seems tsome components are being hidden for others. Can someone
please tell me what's missing to make it work? Thank you,
Sarah Barreto Marques

Núcleo de Pesquisa em Sistemas de Informação - NSI/IF Fluminense
Napnee - IF Fluminense

www.audiogames.com.br

@sarahbmarques

savewindow.py (904 Bytes)

You've created a Frame, a Panel, and a FlexGridSizer, and then you've added
stuff to the grid - but you never associated the grid with the panel. Add
this line just before the SetFocus() line:
    self.panel.SetSizer(self.grid)

···

On Thu, Mar 28, 2013 at 7:59 PM, Sarah Marques <sarahbmarques@gmail.com>wrote:

Hello,
I have wrote the code attached, that's a simple 'save as' window layout,
but it seems tsome components are being hidden for others. Can someone
please tell me what's missing to make it work? Thank you,
Sarah Barreto Marques

I don't know what you _want_ it to look like; it could be that the
FlexGridSizer is not the right sizer for your design. Have you played
with the wxPython demo? You can try out the various sizers and see what
they do (and see an example of how to code them, too!)

If you'd like help with your layout, give us a drawing or a quick sketch on
line-drawing characters, like this:

···

On Tue, Apr 2, 2013 at 9:52 AM, Sarah Marques <sarahbmarques@gmail.com>wrote:

Hi, I have added the line you mentioned to the code, but as I suspected,
the window components keep on messed up. Please, what's the problem now?

  +--------------------+
  > Example Question |
  > [OK] [Cancel] |
  +--------------------+

(trust me, it looks better in a fixed-width font!) so we know what you're
trying to achieve.

On Wed, Apr 3, 2013 at 9:36 PM, Sarah Marques
<sarahbmarques@gmail.com>wrote:Well, I haven't specified the exact
design because this subject is not

so familiar to me, since I'm visually impaired. I asked you for help
because people tell me the design is messed up and I don't know what to
do, since I built all my windows based on examples I downloaded from
wxPython website. I supose this window I sent should have its combobox
labeled, and the two buttons bellow, side by side. I used the flexGrid
because docs explained that it would organize components like a grid and
it would expand and rearrange if needed, it is, if I add one more
component for example, right? The examples I got has something to do
with the book, so where can I find the examples you mentioned? Thank
you!

GridSizers are grids, just as their name suggests. They contain a
rectangular array of cells, some number of columns wide and some number of
rows high. You specify the number of rows and columns when you create the
sizer; as you add items to the grid, the cells are filled from top left to
bottom right.

In your case you've specified 4 rows but haven't specified columns, so
everything you add to the sizer is stacked vertically. The simplest thing
to do is to change
    self.grid=wx.FlexGridSizer(rows=4, hgap=8, vgap=8)
to
    self.grid=wx.FlexGridSizer(rows=2, cols=2, hgap=8, vgap=8)

This will get your first two items into the top row, and the two buttons
into the bottom row. However, it still isn't going to be pretty, because
the items in the various cells are different shapes.

wxPython's sizers are very powerful - you can achieve very precise,
beautiful designs. However, they are NOT simple, and they are NOT
forgiving - a very simple error can make your entire layout disappear into
a tiny dot in the top-left corner. Be aware! (Don't worry, though - as
soon as you find the error, everything comes back!)

I again definitely recommend the wxPython demo, which you can download from
the same page as wxPython itself:
http://wxpython.org/download.php#stable
Look for "wxPython Demo for Windows".

Boa sorte!

Sarah,

I attach an alternative way of doing your simple layout using wx.lib.sized_controls.

They do a lot of the sizers setup for you, but at the same time allow you to control things - see SetSizerType and SetSizerProps.

In addition to the sizers I often use a panel to group controls together. For your sample I used one panel (paneControls) for the controls and one for the buttons (paneButtons).

I centered the paneButtons panel.

I also called self.Fit() at the end so the overall frame is only as large as it needs to be to hold all the controls and buttons without having extra wasted space.

Last but not least I use the WIT - http://wiki.wxpython.org/Widget%20Inspection%20Tool , which I extremely useful especially to debug sizer based layouts - to access it run the sample and press ctrl-alt-i and the WIT window will open which allows you to inspect each widget. You mentioned that you are visually impaired, so I don't know how much the WIT will help you.

Werner

savewindow-alt.py (1.06 KB)