通常,大多數應用程序通過保持 HTML 簡單來解決大多數浏覽器問題 ― 或者說,根據最低共同特性來編寫。然而,即便如此,也仍然存在字體和布局的問題,發行新浏覽器和升級現有浏覽器時,也免不了測試應用程序的痛苦。替代方案 ― 只支持一種浏覽器 ― 通常不是一種用戶友好的解決方案。
明顯的解決方案是在應用程序中嵌入自己的表現 HTML 的窗口構件。當然,從頭開始編寫這樣的窗口構件工作量很大,因此,求助於預先封裝的解決方案好象是合理的。
商界有許多選擇及幾個開放源碼軟件包(參閱本文後面的 參考資料)。本文將向您顯示如何以 Python 作為綁定的語言選擇(也支持 C++、Perl 和其它語言)使用作為 wxWindows 軟件包一部分分發的 wxHtml 窗口構件。
雖然沒有任何 wxPython 經驗而熟谙 Python 的開發人員應該能夠從頭開始,但本文還是假定您具有基本的 wxPython 知識。在本文中,我們將創建一個獨立的浏覽器應用程序,同時,保持體系結構足夠簡單以致將浏覽器功能遷移到現有的應用程序中是一項簡單的任務。
世界上最基本的浏覽器
第一步是組裝支持使用 wxHtml 窗口構件的應用程序所必需的最少代碼。下列代碼實現用 wxHtml 窗口構件作為其主窗口內容的基本 wxPython 應用程序。
清單 1. 基本示例浏覽器代碼
from wxPython.wx import *
from wxPython.html import *
import os,sys
class exHtmlWindow(wxHtmlWindow):
def __init__(self, parent, id, frame):
wxHtmlWindow.__init__(self,parent,id)
class exHtmlPanel(wxPanel):
def __init__(self, parent, id, frame):
wxPanel.__init__(self,parent,-1)
self.html = exHtmlWindow(self, -1, frame)
self.box = wxBoxSizer(wxVERTICAL)
self.box.Add(self.html, 1, wxGROW)
self.SetSizer(self.box)
self.SetAutoLayout(true)
class exFrame (wxFrame):
def __init__(self, parent, ID, title):
wxFrame.__init__(self,parent,ID,title,wxDefaultPosition,wxSize(600,750))
panel = exHtmlPanel(self, -1, self)
class exApp(wxApp):
def OnInit(self):
frame = exFrame(NULL, -1, "Example Browser")
frame.Show(true)
self.SetTopWindow(frame)
return true
app = exApp(0)
app.MainLoop()
假定您已正確安裝 wxPython,那麼在 Python 解釋器中運行上述代碼將產生一個具有空的白面板(wxHtml 窗口構件)的大窗口。如果出現任何語法錯誤,請檢查空格問題 ― 尤其是如果您將代碼剪切粘貼到解釋器或編輯器的情況。如果 Python 解釋器顯示無法導入 wxPython,請檢查安裝以確保安裝正確。
當然,一啟動該浏覽器,立刻出現的是:我們缺少某些東西 ... 例如裝入頁面的機制。對於某些應用程序,這一非常基本的設置實際上可能已經夠了 — 如果您已知道您要交付什麼,那麼用戶就無需選擇自己的頁面。簡單的更改是向 exHtmlPanel 傳遞額外的參數,那就是您想訪問的頁面:
清單 2. 修改 exHtmlPanel 以裝入頁面
class exHtmlPanel(wxPanel):
+ def __init__(self, parent, id, frame, file):
wxPanel.__init__(self, parent, -1)
self.html = exHtmlWindow(self, -1, frame)
self.box = wxBoxSizer(wxVERTICAL)
self.box.Add(self.html, 1, wxGROW)
self.SetSizer(self.box)
self.SetAutoLayout(true)
+ self.html.LoadPage(file)
為了使之更獨立也為了使之更象浏覽器,我們將擴展 ttHtmlPanel 類以添加一些執行標准浏覽器任務的按鈕。當然,如果您實際上是計劃構建一個真正的浏覽器應用程序,那麼在 GUI 設計和可用性方面您可能要考慮的比我們這裡做的更多。
清單 3. 修改 ttHtmlPanel 以添加按鈕
class ttHtmlPanel(wxPanel):
def __init__(self, parent, id, frame):
wxPanel.__init__(self, parent, -1)
self.frame = frame
self.cwd = os.path.split(sys.argv[0])[0]
if not self.cwd:
self.cwd = os.getcwd
self.html = ttHtmlWindow(self, -1, self.frame)
self.box = wxBoxSizer(wxVERTICAL)
self.box.Add(self.html, 1, wxGROW)
subbox = wxBoxSizer(wxHORIZONTAL)
btn = wxButton(self, 1202, "Load File")
EVT_BUTTON(self, 1202, self.OnLoadFile)
subbox.Add(btn, 1, wxGROW | wxALL, 2)
btn = wxButton(self, 1203, "Load Page")
EVT_BUTTON(self, 1203, self.OnLoadPage)
subbox.Add(btn, 1, wxGROW | wxALL, 2)
btn = wxButton(self, 1204, "Back")
EVT_BUTTON(self, 1204, self.OnBack)
subbox.Add(btn, 1, wxGROW | wxALL, 2)
btn = wxButton(self, 1205, "Forward")
EVT_BUTTON(self, 1205, self.OnForward)
subbox.Add(btn, 1, wxGROW | wxALL, 2)
self.box.Add(subbox, 0, wxGROW)
self.SetSizer(self.box)
self.SetAutoLayout(true)
def OnLoadPage(self, event):
dlg = wxTextEntryDialog(self, 'Location:')
if dlg.ShowModal() == wxID_OK:
self.destination = dlg.GetValue()
dlg.Destroy()
self.html.LoadPage(self.destination)
def OnLoadFile(self, event):
dlg = wxFileDialog(self, wildcard = '*.htm*', style=wxOPEN)
if dlg.ShowModal():
path = dlg.GetPath()
self.html.LoadPage(path)
dlg.Destroy()
def OnBack(self, event):
if not self.html.HistoryBack():
wxMessageBox("No more items in history!")
def OnForward(self, event):
if not self.html.HistoryForward():
wxMessageBox("No more items in history!")
如果您以前使用過 wxPython 或任何其它 Python 圖形工具箱,那麼您可以發現我們做的所有事情就是向面板添加另一個容器並將四個按鈕置於其中,帶有對 exHtmlPanel 類中所添加的方法的回調函數。基礎 wxHtml 類巧妙地為我們管理歷史,因此, OnBack 和 OnForward 僅僅是對基礎方法的調用。
假定讀到這些時您已一直在使用 Python 解釋器,那麼您可能注意到:如果關閉應用程序,它從不將控制返回給控制台。這個問題解決起來很簡單,但我們可能應該添加一個菜單欄來提供具有退出選項的文件菜單:
清單 4. 修改 exFrame 以添加帶有退出的文件菜單
class exFrame(wxFrame):
def __init__(self, parent, ID, title):
wxFrame.__init__(self, parent, ID, title, wxDefaultPosition, wxSize(600,750))
panel = exHtmlPanel (self, -1, self)
mnu_file = wxMenu()
mnu_file.Append(101, "E&xit", "Exit the browser")
menuBar = wxMenuBar()
menuBar.Append(mnu_file, "F&ile")
self.SetMenuBar(menuBar)
EVT_MENU(self, 101, self.Exit)
def Exit(self, event):
self.Close(true)
當我們沒有試圖將它變為一個真正的浏覽器的時候,我們在結尾處發現少了兩個添加項:大多數浏覽器都有狀態欄,並且您可能注意到了沒有繪制任何圖像。下列對 exApp 、 exFrame 和 exHtmlPanel 的修改添加了一個狀態欄以及所有來自 wxPython 的內置圖像支持:
清單 5. 添加狀態欄及圖像支持
class exApp(wxApp):
def OnInit(self):
+ wxInitAllImageHandlers()
frame = exFrame(NULL, -1, "Example Browser")
frame.Show(true)
self.SetTopWindow(frame)
return true
class exHtmlPanel(wxPanel):
def __init__(self, parent, id, frame):
wxPanel.__init__(self, parent, -1)
self.frame = frame
self.cwd = os.path.split(sys.argv[0])[0]
if not self.cwd:
self.cwd = os.getcwd
self.html = exHtmlWindow(self, -1, self.frame)
+ self.html.SetRelatedFrame(self.frame, "%s")
+ self.html.SetRelatedStatusBar(0)
...
class exFrame(wxFrame):
def __init__(self, parent, ID, title):
wxFrame.__init__(self, parent, ID, title, wxDefaultPosition, wxSize(600,750))
panel = exHtmlPanel (self, -1, self)
+ self.CreateStatusBar()