如何理解wxGridBagSizer？

Question

我在用wxPython为我的应用设计图形界面。
我使用了wx.GridBagSizer，但遇到了一些问题。

第一个布局是我代码运行后得到的，第二个布局是我想要的效果。我觉得我对pos和span这两个属性的理解不太正确。如果能有人解释一下，我会非常感激。下面是我现在的代码：

class MyFrame1 ( wx.Frame ):

def __init__( self, parent ):
    wx.Frame.__init__ ( self, parent, id = wx.ID_ANY, title = wx.EmptyString, pos = wx.DefaultPosition, size = wx.Size( 561,401 ), style = wx.DEFAULT_FRAME_STYLE|wx.TAB_TRAVERSAL )

    self.SetSizeHintsSz( wx.DefaultSize, wx.DefaultSize )

    gbSizer1 = wx.GridBagSizer( 0, 0 )
    gbSizer1.SetFlexibleDirection( wx.BOTH )
    gbSizer1.SetNonFlexibleGrowMode( wx.FLEX_GROWMODE_SPECIFIED )

    gbSizer1.SetMinSize( wx.Size( 0,0 ) ) 
    self.m_panel25 = wx.Panel( self, wx.ID_ANY, wx.DefaultPosition, wx.Size( 10,10 ), wx.TAB_TRAVERSAL )
    self.m_panel25.SetBackgroundColour( wx.SystemSettings.GetColour( wx.SYS_COLOUR_WINDOWTEXT ) )

    gbSizer1.Add( self.m_panel25, wx.GBPosition( 0, 0 ), wx.GBSpan( 1, 3 ), wx.EXPAND |wx.ALL, 5 )

    self.m_panel41 = wx.Panel( self, wx.ID_ANY, wx.DefaultPosition, wx.DefaultSize, wx.TAB_TRAVERSAL )
    gbSizer1.Add( self.m_panel41, wx.GBPosition( 5, 0 ), wx.GBSpan( 1, 1 ), wx.EXPAND |wx.ALL, 5 )

    self.m_panel26 = wx.Panel( self, wx.ID_ANY, wx.DefaultPosition, wx.Size( 10,10 ), wx.TAB_TRAVERSAL )
    self.m_panel26.SetBackgroundColour( wx.SystemSettings.GetColour( wx.SYS_COLOUR_INFOBK ) )

    gbSizer1.Add( self.m_panel26, wx.GBPosition( 0, 3 ), wx.GBSpan( 1, 1 ), wx.ALL, 5 )

    self.m_panel28 = wx.Panel( self, wx.ID_ANY, wx.DefaultPosition, wx.Size( 10,10 ), wx.TAB_TRAVERSAL )
    self.m_panel28.SetBackgroundColour( wx.SystemSettings.GetColour( wx.SYS_COLOUR_INFOBK ) )

    gbSizer1.Add( self.m_panel28, wx.GBPosition( 0, 4 ), wx.GBSpan( 1, 1 ), wx.ALL, 5 )

    self.m_panel27 = wx.Panel( self, wx.ID_ANY, wx.DefaultPosition, wx.Size( 10,10 ), wx.TAB_TRAVERSAL )
    self.m_panel27.SetBackgroundColour( wx.SystemSettings.GetColour( wx.SYS_COLOUR_INFOBK ) )

    gbSizer1.Add( self.m_panel27, wx.GBPosition( 0, 5 ), wx.GBSpan( 1, 1 ), wx.ALL, 5 )

    self.m_panel29 = wx.Panel( self, wx.ID_ANY, wx.DefaultPosition, wx.Size( 10,10 ), wx.TAB_TRAVERSAL )
    self.m_panel29.SetBackgroundColour( wx.SystemSettings.GetColour( wx.SYS_COLOUR_INFOBK ) )

    gbSizer1.Add( self.m_panel29, wx.GBPosition( 0, 6 ), wx.GBSpan( 1, 3 ), wx.EXPAND |wx.ALL, 5 )

    self.m_panel30 = wx.Panel( self, wx.ID_ANY, wx.DefaultPosition, wx.Size( 10,10 ), wx.TAB_TRAVERSAL )
    self.m_panel30.SetBackgroundColour( wx.SystemSettings.GetColour( wx.SYS_COLOUR_INFOTEXT ) )

    gbSizer1.Add( self.m_panel30, wx.GBPosition( 1, 3 ), wx.GBSpan( 5, 6 ), wx.EXPAND |wx.ALL, 5 )

    self.m_panel31 = wx.Panel( self, wx.ID_ANY, wx.DefaultPosition, wx.Size( 10,10 ), wx.TAB_TRAVERSAL )
    self.m_panel31.SetBackgroundColour( wx.SystemSettings.GetColour( wx.SYS_COLOUR_HIGHLIGHT ) )

    gbSizer1.Add( self.m_panel31, wx.GBPosition( 1, 0 ), wx.GBSpan( 1, 3 ), wx.ALL, 5 )

    self.m_panel32 = wx.Panel( self, wx.ID_ANY, wx.DefaultPosition, wx.Size( 10,10 ), wx.TAB_TRAVERSAL )
    self.m_panel32.SetBackgroundColour( wx.SystemSettings.GetColour( wx.SYS_COLOUR_HIGHLIGHT ) )

    gbSizer1.Add( self.m_panel32, wx.GBPosition( 2, 0 ), wx.GBSpan( 1, 3 ), wx.ALL, 5 )

    self.m_panel39 = wx.Panel( self, wx.ID_ANY, wx.DefaultPosition, wx.Size( 10,10 ), wx.TAB_TRAVERSAL )
    self.m_panel39.SetBackgroundColour( wx.SystemSettings.GetColour( wx.SYS_COLOUR_HIGHLIGHT ) )

    gbSizer1.Add( self.m_panel39, wx.GBPosition( 3, 0 ), wx.GBSpan( 1, 3 ), wx.ALL, 5 )

    self.m_panel40 = wx.Panel( self, wx.ID_ANY, wx.DefaultPosition, wx.Size( 10,10 ), wx.TAB_TRAVERSAL )
    self.m_panel40.SetBackgroundColour( wx.SystemSettings.GetColour( wx.SYS_COLOUR_HIGHLIGHT ) )

    gbSizer1.Add( self.m_panel40, wx.GBPosition( 4, 0 ), wx.GBSpan( 1, 3 ), wx.ALL, 5 )


    self.SetSizer( gbSizer1 )
    self.Layout()

    self.Centre( wx.BOTH )

Answer 1

我觉得你离答案很近了。注意一下做出的修改。这样怎么样：

import wx

class MyFrame1 ( wx.Frame ):

    def __init__( self, parent ):
        wx.Frame.__init__ ( self, parent, id = wx.ID_ANY, title = wx.EmptyString, pos = wx.DefaultPosition, size = wx.Size( 561,401 ), style = wx.DEFAULT_FRAME_STYLE|wx.TAB_TRAVERSAL )

        self.SetSizeHintsSz( wx.DefaultSize, wx.DefaultSize )

        gbSizer1 = wx.GridBagSizer( 0, 0 )
        gbSizer1.SetFlexibleDirection( wx.BOTH )
        gbSizer1.SetNonFlexibleGrowMode( wx.FLEX_GROWMODE_SPECIFIED )

        gbSizer1.SetMinSize( wx.Size( 0,0 ) )
        self.m_panel25 = wx.Panel( self, wx.ID_ANY, wx.DefaultPosition, wx.Size( 40,10 ), wx.TAB_TRAVERSAL )
        self.m_panel25.SetBackgroundColour( wx.SystemSettings.GetColour( wx.SYS_COLOUR_WINDOWTEXT ) )

        gbSizer1.Add( self.m_panel25, wx.GBPosition( 0, 0 ), wx.GBSpan( 1, 3 ), wx.EXPAND |wx.ALL, 5 )

        self.m_panel41 = wx.Panel( self, wx.ID_ANY, wx.DefaultPosition, wx.DefaultSize, wx.TAB_TRAVERSAL )
        gbSizer1.Add( self.m_panel41, wx.GBPosition( 5, 0 ), wx.GBSpan( 1, 1 ), wx.EXPAND |wx.ALL, 5 )

        self.m_panel26 = wx.Panel( self, wx.ID_ANY, wx.DefaultPosition, wx.Size( 10,10 ), wx.TAB_TRAVERSAL )
        self.m_panel26.SetBackgroundColour( wx.SystemSettings.GetColour( wx.SYS_COLOUR_INFOBK ) )

        gbSizer1.Add( self.m_panel26, wx.GBPosition( 0, 3 ), wx.GBSpan( 1, 1 ), wx.ALL, 5 )

        self.m_panel28 = wx.Panel( self, wx.ID_ANY, wx.DefaultPosition, wx.Size( 10,10 ), wx.TAB_TRAVERSAL )
        self.m_panel28.SetBackgroundColour( wx.SystemSettings.GetColour( wx.SYS_COLOUR_INFOBK ) )

        gbSizer1.Add( self.m_panel28, wx.GBPosition( 0, 4 ), wx.GBSpan( 1, 1 ), wx.ALL, 5 )

        self.m_panel27 = wx.Panel( self, wx.ID_ANY, wx.DefaultPosition, wx.Size( 10,10 ), wx.TAB_TRAVERSAL )
        self.m_panel27.SetBackgroundColour( wx.SystemSettings.GetColour( wx.SYS_COLOUR_INFOBK ) )

        gbSizer1.Add( self.m_panel27, wx.GBPosition( 0, 5 ), wx.GBSpan( 1, 1 ), wx.ALL, 5 )

        self.m_panel29 = wx.Panel( self, wx.ID_ANY, wx.DefaultPosition, wx.Size( 40,10 ), wx.TAB_TRAVERSAL )
        self.m_panel29.SetBackgroundColour( wx.SystemSettings.GetColour( wx.SYS_COLOUR_INFOBK ) )

        gbSizer1.Add( self.m_panel29, wx.GBPosition( 0, 6 ), wx.GBSpan( 1, 3 ), wx.EXPAND |wx.ALL, 5 )

        self.m_panel40 = wx.Panel( self, wx.ID_ANY, wx.DefaultPosition, wx.Size( 40,10 ), wx.TAB_TRAVERSAL )
        self.m_panel40.SetBackgroundColour( wx.SystemSettings.GetColour( wx.SYS_COLOUR_INFOTEXT ) )

        gbSizer1.Add( self.m_panel40, wx.GBPosition( 1, 3 ), wx.GBSpan( 5, 6 ), wx.EXPAND |wx.ALL, 5 )

        self.m_panel31 = wx.Panel( self, wx.ID_ANY, wx.DefaultPosition, wx.Size( 40,10 ), wx.TAB_TRAVERSAL )
        self.m_panel31.SetBackgroundColour( wx.SystemSettings.GetColour( wx.SYS_COLOUR_HIGHLIGHT ) )

        gbSizer1.Add( self.m_panel31, wx.GBPosition( 1, 0 ), wx.GBSpan( 1, 3 ), wx.ALL, 5 )

        self.m_panel32 = wx.Panel( self, wx.ID_ANY, wx.DefaultPosition, wx.Size( 40,10 ), wx.TAB_TRAVERSAL )
        self.m_panel32.SetBackgroundColour( wx.SystemSettings.GetColour( wx.SYS_COLOUR_HIGHLIGHT ) )

        gbSizer1.Add( self.m_panel32, wx.GBPosition( 2, 0 ), wx.GBSpan( 1, 3 ), wx.ALL, 5 )

        self.m_panel39 = wx.Panel( self, wx.ID_ANY, wx.DefaultPosition, wx.Size( 40,10 ), wx.TAB_TRAVERSAL )
        self.m_panel39.SetBackgroundColour( wx.SystemSettings.GetColour( wx.SYS_COLOUR_HIGHLIGHT ) )

        gbSizer1.Add( self.m_panel39, wx.GBPosition( 3, 0 ), wx.GBSpan( 1, 3 ), wx.ALL, 5 )

        self.m_panel40 = wx.Panel( self, wx.ID_ANY, wx.DefaultPosition, wx.Size( 40,10 ), wx.TAB_TRAVERSAL )
        self.m_panel40.SetBackgroundColour( wx.SystemSettings.GetColour( wx.SYS_COLOUR_HIGHLIGHT ) )

        gbSizer1.Add( self.m_panel40, wx.GBPosition( 4, 0 ), wx.GBSpan( 1, 3 ), wx.ALL, 5 )


        self.SetSizer( gbSizer1 )
        self.Layout()

        self.Centre( wx.BOTH )


def main():
    app = wx.App(False)
    MainFrame = MyFrame1(None)
    MainFrame.Show()
    app.MainLoop()

if __name__ == '__main__':
    main()

当上面的代码运行时，它会输出：

编辑

首先，我之前没有使用过GridBagSizer，所以如果我提供的信息有误导的地方，我先说声抱歉。不过在这个例子中，wx.Size是wx.Panel类的一部分，而wx.GBSpan是wx.GridBagSizer类的一部分。因此，你可能可以扩展面板以适应这个跨度，但我现在不太确定怎么做。

• http://wxpython.org/docs/api/wx.GBSpan-class.html
• http://www.wxpython.org/docs/api/wx.Panel-class.html

看起来wx.GBSpan()默认是1行1列的单元格。

所以，wx.GBSpan(rowspan=1,colspan=1)和wx.GBSpan(1, 1)是一样的。

如果你看看Robin Dunn在邮件列表档案中的回答...

http://wxpython-users.1045709.n5.nabble.com/Problem-with-GridBagSizer-and-span-td2359250.html

> Hi all 
> 
> I understand what the 'span' argument to wx.GridBagSizer.Add() means, but it 
> is not behaving as I would expect. 
> 
> Assume I have two columns in my GBS, one with a width of 20 and one with a 
> width of 30. 
> 
> If I add a row containing an element with a width of 40, spanning both 
> columns, I expected that the existing sizes and positions would not change, 
> as there is ample room to fit the new row into the available width. 
> 
> In practice, the overall width is increased, and ugly spaces start to 
> appear.
... [show rest of quote]

IIRC when an item spans columns then its width is divided evenly across 
all the columns.  In other words, for an item that is 100 pixels wide 
that is spanned across 5 columns, then each column takes 'ownership' of 
20 pixels for that item.  So even if everything else in that column is 
only 10 pixels wide, the sizer is still going to assume that the col 
needs 20 pixels because of that column's share of the spanning item. 

比如说，关于你的代码：

self.m_panel29 = wx.Panel( self, wx.ID_ANY, wx.DefaultPosition, wx.Size( 10,10 ), wx.TAB_TRAVERSAL )
self.m_panel29.SetBackgroundColour( wx.SystemSettings.GetColour( wx.SYS_COLOUR_INFOBK ) )
gbSizer1.Add( self.m_panel29, wx.GBPosition( 0, 6 ), wx.GBSpan( 1, 3 ), wx.EXPAND |wx.ALL, 5 )

wx.GBSpan(rowspan=1, colspan=3)和wx.Size(10, 10)的宽度是10，高度也是10。

关于大小和扩展面板，值得看看以下内容：

• 让WxPython面板项扩展
• http://wiki.wxpython.org/wxGridBagSizer