wx佈局管理boxsizer

布局管理layout management — wx.BoxSizer

2014年4月17日 admin 发表回复

下面我们将编写一个程序，令三个按钮每个都占一行并被放置在窗口顶部. 同时这些按钮会随同窗口一起得到缩放.[more…]

#!/usr/bin/python
#coding=utf-8

#wxboxsizer.py

import wx

class MyFrame(wx.Frame):
    def __init__(self, parent, id, title):
        wx.Frame.__init__(self, parent, id, title, (-1, -1), 
                          wx.Size(250, 50))
        panel = wx.Panel(self, -1)
        box = wx.BoxSizer(wx.HORIZONTAL)
        box.Add(wx.Button(panel, -1, '按钮1'), 0)
        box.Add(wx.Button(panel, -1, '按钮2'), 2)
        box.Add(wx.Button(panel, -1, '按钮3'), 1)
        panel.SetSizer(box)
        self.Centre()

class MyApp(wx.App):
    def OnInit(self):
        frame = MyFrame(None, -1, 'wxboxsizer.py')
        frame.Show()
        return True
    
app = MyApp(0)
app.MainLoop()

我们可以水平或垂直地摆放部件.

Box = wx.BoxSizer(integer orient)

这里的定位方式（orientation）可以是wx.VERTICAL或wx.HORIZONTAL. 往wx.BoxSizer中添加部件是通过Add() 方法完成的. 为更好地理解这个方法，我们需要看看这个方法的参数.

Add(wx.Window window, integer proportion=0, integer flag = 0, 
    integer border = 0)

图：wxboxsizer.py
比例（proportion）参数定义了添加部件在定义的定位方式方向上占据的空间比例. 假设我们有三个按钮，它们的比例值分别为0、1和2. 它们是添加到一个水平的wx.BoxSizer中的. 那么比例值0的按钮在sizer的宽度（水平大小）改变时，它不会变化（也就是说这个按钮的宽度一直保持不变）. 比例值2的按钮一直会占据可用宽度的2/3，比例值1的按钮则一直会占据可用宽度的1/3.
而运用标志(flag)参数，你可以对wx.BoxSizer中的部件进行更多的配置. 通过border参数，我们可以控制这些部件的边框（更准确地说是“外边距（padding）”），就是在部件之间添加一些像素的空白.而为了应用边框参数，我们需要定义哪一边需要使用边框.我们可以在这些标志中选择：

• wx.LEFT
• wx.RIGHT
• wx.BOTTOM
• wx.TOP
• wx.ALL

通过竖线 “|”操作符（operator）,比如wx.LEFT | wx.BOTTOM，来联合使用这些标志.如果我们使用wx.EXPAND标志，那么部件将占有sizer定位方向的竖直 (perpendicular) 方向上所有可用的空间.最后，我们还能定义这些部件的排列方式，通过以下标志实现：

• wx.ALIGN_LEFT
• wx.ALIGN_RIGHT
• wx.ALIGN_TOP
• wx.ALIGN_BOTTOM
• wx.ALIGN_CENTER_VERTICAL
• wx.ALIGN_CENTER_HORIZONTAL
• wx.ALIGN_CENTER

例子：

#!/usr/bin/python
#coding=utf-8

#borders.py

import wx

class MyFrame(wx.Frame):
    def __init__(self, parent, id, title):
        wx.Frame.__init__(self, parent, id, title, (-1, -1), 
                          wx.Size(450, 300))
        
        panel = wx.Panel(self, -1)
        box = wx.BoxSizer(wx.HORIZONTAL)
        box.Add(wx.Button(panel, -1, '按钮1'), 1, wx.ALL, 20)
        box.Add(wx.Button(panel, -1, '按钮2'), 0, wx.EXPAND)
        box.Add(wx.Button(panel, -1, '按钮3'), 0, wx.ALIGN_CENTER)
        
        panel.SetSizer(box)
        self.Centre()

class MyApp(wx.App):
    def OnInit(self):
        frame = MyFrame(None, -1, 'layout3.py')
        frame.Show(True)
        return True
    
app = MyApp(0)
app.MainLoop()

本例中有三个按钮. 在第一个按钮的四周有一些空白. 并且它是唯一在窗口缩放时会改变宽度的按钮. 第二个占据了垂直方向上分配给它的所有空间. 第三个是排列在中间的.
我们可以结合不同的wx.BoxSizer. 比如，我们可以将许多水平方向的wx.BoxSizer放入一个垂直方向的wx.BoxSizer，相反，也可以把许多垂直方向的wx.BoxSizer放入一个水平方向的wx.BoxSizer.这样就可以生成相当复杂的布局了.

#!/usr/bin/python
#coding=utf-8

#borders.py

import wx

class MyFrame(wx.Frame):
    def __init__(self, parent, id, title):        
        wx.Frame.__init__(self, parent, id, title)

        hbox = wx.BoxSizer(wx.HORIZONTAL)

        pnl1 = wx.Panel(self, -1, style=wx.SIMPLE_BORDER)
        pnl2 = wx.Panel(self, -1, style=wx.RAISED_BORDER)
        pnl3 = wx.Panel(self, -1, style=wx.SUNKEN_BORDER)
        pnl4 = wx.Panel(self, -1, style=wx.NO_BORDER)

        hbox.Add(pnl1, 1, wx.EXPAND | wx.ALL, 3)
        hbox.Add(pnl2, 1, wx.EXPAND | wx.ALL, 3)
        hbox.Add(pnl3, 1, wx.EXPAND | wx.ALL, 3)
        hbox.Add(pnl4, 1, wx.EXPAND | wx.ALL, 3)
        
        self.SetSize((400, 120))
        self.SetSizer(hbox)
        self.Centre()
        
class MyApp(wx.App):
    def OnInit(self):
        frame = MyFrame(None, -1, 'borders.py')
        frame.Show(True)
        return True
    
app = MyApp(0)
app.MainLoop()

这里我们示出wxPython中4个不同的边框样式. 边框是一种简单的窗口装饰.
可用的边框有：

• wx.SIMPLE_BORDER
• wx.RAISED_BORDER
• wx.SUNKEN_BORDER
• wx.NO_BORDER

图：borders.py