Step by Step使用wxFormBuilder設(shè)計(jì)用戶圖形界面并集成入PyCharm

wxFormBuilder （簡(jiǎn)稱wxFB）是一個(gè)可以用于多種編程語言的圖形用戶界面設(shè)計(jì)工具。使用它可以方便的生成Pyhton，C++，PHP的源碼文件。此處描述如何設(shè)計(jì)一個(gè)簡(jiǎn)單的用戶輸入界面，并將它集成入基于PyCharm IDE的Python項(xiàng)目中。

wxFB界面基本介紹

wxFormBuilder的界面如下：
其中
項(xiàng)目樹：包含所有用到的控件，布局器。通過項(xiàng)目樹可以實(shí)現(xiàn)對(duì)項(xiàng)目布局結(jié)構(gòu)的調(diào)整和編輯對(duì)象的選擇。
控件及工具欄：提供用于圖形用戶界面所需要使用的各種控件和布局器。
工作區(qū)：可視化的圖形用戶界面，提供所見即所得的設(shè)計(jì)區(qū)域。
配置區(qū)：用于配置項(xiàng)目屬性，控件屬性，布局器屬性以及需要綁定的事件處理。
生成代碼模板區(qū)：只做展示用于生成圖形用戶界面的對(duì)應(yīng)代碼模板，實(shí)際使用中，不要隨意修改。

設(shè)計(jì)需求

在如圖所示的窗口里，由文本輸入框中輸入后，按下Display按鈕可以在按鈕旁邊空白處顯示剛才輸入的內(nèi)容。

wxFB項(xiàng)目設(shè)置

從菜單中選取:File/New Project或直接按下：Ctrl+N。而后在配置區(qū)對(duì)項(xiàng)目進(jìn)行配置。也可以在設(shè)計(jì)過程中，從項(xiàng)目樹中選擇頂層選中根節(jié)點(diǎn)，而后在配置區(qū)進(jìn)行項(xiàng)目屬性設(shè)置。

常用設(shè)置參數(shù)如下：
name：是wxFB的項(xiàng)目名。
path：是存放wxFB項(xiàng)目文件的存儲(chǔ)路徑。
file：是生成代碼文件的名字
relative_path:保持默認(rèn)選中狀態(tài)，確保引用文件為相對(duì)路徑。
code_generation:由于此處使用的編程語言為Python，所以將Pyhton對(duì)應(yīng)的復(fù)選框選中。

添加容器

對(duì)于任何控件和布局器而言，它們需要在指定的容器中運(yùn)行。這需要首先在“控件及工具欄”中選擇“Forms”頁面，而后單擊圖中（2）處的Frame 圖標(biāo)，而后在“工作區(qū)”中將出現(xiàn)一個(gè)空Frame。最后在“配置區(qū)”設(shè)置這個(gè)Frame的名字和Frame上顯示的title。后面可以看到使用wxFB實(shí)際是使用此處的name創(chuàng)建了一個(gè)名字叫MyFrame1的類。在Python中集成時(shí)，需要對(duì)基于這個(gè)創(chuàng)建的類進(jìn)行操作。所以起個(gè)好名字很重要。（本文的MyFrame1僅作示例）

添加布局器

在添加布局器前需要先分析一下目標(biāo)用戶圖形界面的基本布局構(gòu)成，從上圖上可以看到整個(gè)界面猶如一個(gè)左窄右寬的“田”字型。因此適合使用FlexGrid布局。
從“控件及工具欄”Layout頁面下單擊（2）處的FlexGrid布局器。由于需要2行，2列控件，所以在（3)處設(shè)置為2行，2列結(jié)構(gòu)

添加控件

從“控件及工具欄”中按用戶界面中從左上到右下的控件順序依次單擊控件：StaticText→TextCtrl→Button-→StaticText.如果順序錯(cuò)了，可以在項(xiàng)目樹中拖動(dòng)相應(yīng)控件在項(xiàng)目樹中上下移動(dòng)，以實(shí)現(xiàn)重新調(diào)整控件位置的調(diào)整。

加入控件后在“配置區(qū)”中為各個(gè)控件配置基本屬性。如：

將第一個(gè)StaticText的Label設(shè)置為：“Input：”
將按鈕的Label設(shè)置為：“Display”，如下圖所示在“Events”頁面的“OnButtonClick”中輸入處理當(dāng)鼠標(biāo)單擊按鈕時(shí)所需要綁定的處理方法函數(shù)名。注意在wxFB中只是關(guān)注于用戶圖形界面的設(shè)計(jì)。至于如何實(shí)現(xiàn)單擊按鈕后的動(dòng)作，需要后續(xù)在Python IDE中實(shí)現(xiàn)。
至此基本用戶界面完成設(shè)計(jì)。按F8或從選擇執(zhí)行菜單：File/Generate Code即可在目標(biāo)存儲(chǔ)目錄下生成用Python語言格式的代碼文件。

集成入Pyhton IDE–PyCharm

新建Python項(xiàng)目后為了管理方便，在Python文件目錄下添加一個(gè)“l(fā)ib”文件夾（使用PyCharm菜單“File\New…”而后選擇Dictonary）。而后將用wxFB生成的源文件拷貝到這個(gè)目錄下。如下圖所示
而后在主函數(shù)文件（main.py)中加入對(duì)wxFB創(chuàng)建類的調(diào)用與顯示：

#coding=utf-8
import wx
import lib.myTest1  #加載lib文件夾下由wxFB創(chuàng)建的文件

app=wx.App(False)
frame=lib.myTest1.MyFrame1(None)    
frame.Show()
app.MainLoop()

在PyCharm中單擊lib文件下的myTest1.py,即可打開由wxFB創(chuàng)建的代碼文件。找到在上文指定的處理方法函數(shù)定義部分OnDispBtn(),加入處理內(nèi)容。

def OnDispBtn( self, event ):    #wxFB中定義的入口
	InputData=self.m_textCtrl2.GetValue()   #取文本編輯框輸入的文字內(nèi)容，需要在PyCharm寫入
	self.m_staticText3.SetLabel(InputData)  #將輸入文本提供給靜態(tài)文本，需要在Pycharm寫入

至此完成向Python的集成。運(yùn)行即可得到所需界面。

所以使用wxFB可以快捷方便的構(gòu)建用戶圖形界面。文章來源地址http://www.zghlxwxcb.cn/news/detail-757108.html

到了這里，關(guān)于Step by Step使用wxFormBuilder設(shè)計(jì)用戶圖形界面并集成入PyCharm的文章就介紹完了。如果您還想了解更多內(nèi)容，請(qǐng)?jiān)谟疑辖撬阉鱐OY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！