我們目前已經(jīng)學(xué)會(huì)了四個(gè)控件，也編出了幾個(gè)窗口實(shí)例，它們都有一個(gè)共同的特點(diǎn)，就是丑，主要原因是沒(méi)有進(jìn)行合理地布局。

此前的布局方式簡(jiǎn)單粗暴，即明確規(guī)定每個(gè)控件的大小和位置，從而使之固定。這種布局方式可稱(chēng)之為絕對(duì)定位布局，缺點(diǎn)是控件尺寸固定，并不會(huì)隨著窗口的放縮而同步變化。而且所有的控件都處于同一層次中，邏輯混亂，難于修改。

一個(gè)比較初級(jí)但很直觀的想法是，我們可不可以按照比例來(lái)調(diào)整控件的布局？我等菜鳥(niǎo)所能想到的需求，彼等大佬自然早已解決，BoxSizer便是為此而生。

我們可以將BoxSizer理解為一個(gè)容器或者一個(gè)箱子，里面的控件要么水平排列，要么豎直排列。而且BoxSizer之間也可以互相嵌套，從而實(shí)現(xiàn)一種非常靈活的布局方式。如圖所示：

在上圖中，第一步，將按鈕0、1、2裝進(jìn)一個(gè)BoxSizer；將3、4、5、6裝入第二個(gè)BoxSizer；再將7-11裝入第三個(gè)BoxSizer。這三個(gè)BoxSizer都是橫向的。

第二步，將這三個(gè)BoxSizer裝入一個(gè)縱向的BoxSizer中。

第三步，再將這個(gè)縱向的BoxSizer與按鈕12裝入主BoxSizer中。于是這個(gè)布局便完成了。

其代碼如下，為了表現(xiàn)清晰，所以并沒(méi)有寫(xiě)得很精簡(jiǎn)。

import wx

class testBox(wx.Frame):
  def __init__(self,parent=None):
    wx.Frame.__init__(self,parent=parent)

    #生成12個(gè)按鈕
    btns = [wx.Button(self,label=str(i)) for i in range(13)]
    myStyle = wx.EXPAND|wx.ALL #設(shè)置裝填風(fēng)格

    #左側(cè)第一行的BoxSizer
    box1 = wx.BoxSizer()
    for i in range(3):
      box1.Add(btns[i],1,myStyle,border=10)

    #左側(cè)第二行的BoxSizer
    box2 = wx.BoxSizer()
    for i in range(3,7):
      box2.Add(btns[i],1,myStyle,border=10)

    #左側(cè)第三行的BoxSizer
    box3 = wx.BoxSizer()
    for i in range(7,12):
      box3.Add(btns[i],1,myStyle,border=10)

    #左側(cè)BoxSizer，wx.VERTICAL表示這個(gè)BoxSizer為縱向
    leftBox = wx.BoxSizer(wx.VERTICAL)
    leftBox.Add(box1,1,myStyle,border=10)
    leftBox.Add(box2,1,myStyle,border=10)
    leftBox.Add(box3,1,myStyle,border=10)

    #總BoxSizer
    mainBox = wx.BoxSizer()
    mainBox.Add(leftBox,1,myStyle,border=10)
    mainBox.Add(btns[12],1,myStyle,border=10)

    #在框架中設(shè)置mainBox
    self.SetSizer(mainBox)

class MyApp(wx.App):
  def OnInit(self):
    self.SetAppName("testbox")
    self.Frame = testBox()
    self.Frame.Show()
    return True

if __name__ == "__main__":
  test = MyApp()
  test.MainLoop()

wx.BoxSizer控件除了self之外，只有一個(gè)初始化參數(shù)，即orient，默認(rèn)為wx.HORIZONTAL，即橫向；如果輸入wx.VERTICAL，則為縱向。

wx.BoxSizer通過(guò)Add方法裝填控件，其常用的調(diào)用格式為：

Add (self, window, proportion=0, flag=0, border=0)

• window為BoxSizer所裝填的控件
• proportion聲明這個(gè)控件的尺寸是否隨著窗口的放縮而改變，如果改變的話其比例為多少
• flag聲明裝填風(fēng)格，如果想擁有多種風(fēng)格，風(fēng)格之間用"|"連接
• border為邊界間隔

其中，proportion的參數(shù)為0時(shí)，表示尺寸不變；為正整數(shù)時(shí)，分別按照這個(gè)值的比例進(jìn)行縮放。

Flags相對(duì)來(lái)說(shuō)比較復(fù)雜，常用的可選值大致有三類(lèi)，分別是聲明邊界、聲明對(duì)齊和聲明填充。

Add方法通過(guò)wx.TOP、wx.BOTTOM、wx.LEFT、wx.RIGHT、wx.ALL來(lái)聲明邊界。例如，如果選擇了wx.LEFT，即說(shuō)明左側(cè)的邊界寬度為border。

Add通過(guò)wx.ALIGN_LEFT、wx.ALIGN_RIGHT、wx.ALIGN_RIGHT、wx.ALIGN_TOP、wx.ALIGN_BOTTOM、wx.ALIGN_CENTER來(lái)聲明對(duì)齊方式，如果選擇wx.ALIGN_LEFT，則表示左對(duì)齊。此外，對(duì)于居中而言，還支持水平或豎直的居中，字段為wx.ALIGN_CENTER_HORIZONTAL、wx.ALIGN_CENTER_VERTICAL。

wx.EXPAND是一個(gè)常用的值，表示裝載的控件將填充所有的剩余空間。一般來(lái)說(shuō)，如果選了這個(gè)，那么proportion的值就不能為0了。

至此，我們就已經(jīng)有足夠的能力編寫(xiě)出右側(cè)選項(xiàng)卡中的參數(shù)布局了，下面則考慮左側(cè)畫(huà)圖區(qū)的實(shí)現(xiàn)。

以上就是本文的全部?jī)?nèi)容，希望對(duì)大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。

最新評(píng)論