wxpython佈局

我們目前已經學會了四個控件,也編出了幾個窗口實例,它們都有一個共同的特點,就是醜,主要原因是沒有進行合理地佈局。

此前的佈局方式簡單粗暴,即明確規定每個控件的大小和位置,從而使之固定。這種佈局方式可稱之爲絕對定位佈局,缺點是控件尺寸固定,並不會隨着窗口的放縮而同步變化。而且所有的控件都處於同一層次中,邏輯混亂,難於修改。

一個比較初級但很直觀的想法是,我們可不可以按照比例來調整控件的佈局?我等菜鳥所能想到的需求,彼等大佬自然早已解決,BoxSizer便是爲此而生。

我們可以將BoxSizer理解爲一個容器或者一個箱子,裏面的控件要麼水平排列,要麼豎直排列。而且BoxSizer之間也可以互相嵌套,從而實現一種非常靈活的佈局方式。如圖所示:

在這裏插入圖片描述

在上圖中,第一步,將按鈕0、1、2裝進一個BoxSizer;將3、4、5、6裝入第二個BoxSizer;再將7-11裝入第三個BoxSizer。這三個BoxSizer都是橫向的。

第二步,將這三個BoxSizer裝入一個縱向的BoxSizer中。

第三步,再將這個縱向的BoxSizer與按鈕12裝入主BoxSizer中。於是這個佈局便完成了。

其代碼如下,爲了表現清晰,所以並沒有寫得很精簡。

import wx

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

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

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

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

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

        #左側BoxSizer,wx.VERTICAL表示這個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)

        #在框架中設置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之外,只有一個初始化參數,即orient,默認爲wx.HORIZONTAL,即橫向;如果輸入wx.VERTICAL,則爲縱向。

wx.BoxSizer通過Add方法裝填控件,其常用的調用格式爲:

Add (self, window, proportion=0, flag=0, border=0)
  • window爲BoxSizer所裝填的控件
  • proportion聲明這個控件的尺寸是否隨着窗口的放縮而改變,如果改變的話其比例爲多少
  • flag聲明裝填風格,如果想擁有多種風格,風格之間用"|"連接
  • border爲邊界間隔

其中,proportion的參數爲0時,表示尺寸不變;爲正整數時,分別按照這個值的比例進行縮放。

Flags相對來說比較複雜,常用的可選值大致有三類,分別是聲明邊界、聲明對齊和聲明填充。

Add方法通過wx.TOP、wx.BOTTOM、wx.LEFT、wx.RIGHT、wx.ALL來聲明邊界。例如,如果選擇了wx.LEFT,即說明左側的邊界寬度爲border。

Add通過wx.ALIGN_LEFT、wx.ALIGN_RIGHT、wx.ALIGN_RIGHT、wx.ALIGN_TOP、wx.ALIGN_BOTTOM、wx.ALIGN_CENTER來聲明對齊方式,如果選擇wx.ALIGN_LEFT,則表示左對齊。此外,對於居中而言,還支持水平或豎直的居中,字段爲wx.ALIGN_CENTER_HORIZONTAL、wx.ALIGN_CENTER_VERTICAL。

wx.EXPAND是一個常用的值,表示裝載的控件將填充所有的剩餘空間。一般來說,如果選了這個,那麼proportion的值就不能爲0了。

至此,我們就已經有足夠的能力編寫出右側選項卡中的參數佈局了,下面則考慮左側畫圖區的實現。

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章