用Visual C++打造IE浏覽器(1)

前言

　　IE浏覽器作為微軟Windows系統捆綁銷售的一個浏覽工具，用來浏覽千姿百态的網頁，目前它已經占據了浏覽器市場的半壁江山，成為Windows使用者不可或缺的工具。首先，它的界面設計的很漂亮，如扁平按紐（按鈕上的圖像為灰色，當滑鼠放在按鈕上時，按鈕突起，這種狀态稱為搖桿，并且其上的圖像變得鮮豔醒目）、按鈕上的文字說明以及按鈕邊上的小黑三角形狀的下拉箭頭（單擊時顯示下拉菜單）、工具條上的位址輸入欄等，都展現了Windows2000的風格；其次，它的收藏欄可以收藏使用者喜愛的網絡位址，這一切都為IE的流行打下了堅實的基礎。說了那麼多，也許讀者朋友們感覺到IE實作起來一定非常困難，其實IE也是個"紙老虎"，實作它的難點主要是在界面效果和顯示收藏夾上，筆者在本文中有針對性的叙述了IE界面、收藏網頁的顯示、網頁的浏覽等功能的實作，仔細看過這篇文章後，相信讀者朋友們一定可以打造出一個屬于自己的浏覽器。本文中的代碼在Windows2000、Visual C++6.0環境下編譯通過，程式運作正常。程式運作界面如下：

圖一、浏覽器的運作界面

　　一、浏覽器的界面實作

　　首先啟動Visual C++6.0，生成一個名為MYIE單文檔項目，注意在此過程中不要選擇工具條和狀态條選項，這樣才能更友善我們在後續工作中用代碼實作Windwos2000風格的工具條、狀态條；在工具條中添加位址欄；項目的視圖類的基類為ChtmlView，該類的Navigate2（）成員函數專門用來現實超文本格式的文檔。在主架構類CmainFrame中定義CStatusBar m_wndStatusBar（狀态條對象）、CToolBar m_wndToolBar（工具欄對象）、CReBar m_wndReBar（、CComboBoxEx m_wndAddress（擴充的組合框對象，用來作為位址欄）、CAnimateCtrl m_wndAnimate（動畫控件，用來在工具欄上顯示動畫）、圖像清單對象CImageList img（存放顯示在工具欄上的圖示）等對象。向目前項目AVI資源檔案，ID标志IDR_MFCAVI，添加Bitmap(位圖)資源，ID标志分别為IDB_COLDTOOLBAR、IDB_HOTTOOLBAR，分别如下所示：

圖二、包含按鈕圖示的位圖

　　1）IE風格工具條

　　IE風格界面的實作主要在主架構類的CMainFrame::OnCreate（）函數中實作，它的主要思想如下： CReBar對象用來作為工具條、位址欄、動畫控件的容器，CImageList對象，然後分别裝載工具欄上按鈕的熱點圖像和正常狀态下顯示的圖像，并将該對象附給工具條對象，使之建立關聯。為了顯示扁平工具欄，需要用CreateEx()函數建立CToolBar對象m_wndToolBar，用ModifyStyle（）函數将工具欄的風格設為扁平類型，注意這裡不能用CToolBar::Create（） 或 CToolBar:: SetBarStyle（）設定這種新風格。CToolBar 類不支援TBSTYLE_FLAT，要解決這個問題，必須繞過CToolBar類，使用CWnd::ModifyStyle（）。要将某一個工具欄按鈕設定為附帶有下拉按鈕，可以調用SetButtonInfo（）設定按鈕的風格為TBSTYLE_DROPDOWN。至于按鈕帶有中文提示，用工具欄的SetButtonText（）就可以輕松實作了。下面是實作IE風格界面的代碼和注釋：

int CMainFrame::OnCreate(LPCREATESTRUCT lpCreateStruct)

{

CImageList img; //圖像清單對象；

CString str; //字元串對象；

if (CFrameWnd::OnCreate(lpCreateStruct) == -1)

return -1;

if (!m_wndReBar.Create(this)) //建立CReBar對象；

{ TRACE0("Failed to create rebar/n");

return -1; }

if (!m_wndToolBar.CreateEx(this)) //使用CreateEx()函數建立工具條對象；

{ TRACE0("Failed to create toolbar/n");

return -1; }

//設定工具欄中的按鈕最大最小尺寸；

m_wndToolBar.GetToolBarCtrl().SetButtonWidth(50, 150);

//設定工具欄上的按鈕支援下拉箭頭風格；

m_wndToolBar.GetToolBarCtrl().SetExtendedStyle(TBSTYLE_EX_DRAWDDARROWS);

//向圖像清單裝載熱點圖像資源，IDB_HOTTOOLBAR為熱點圖像資源ID img.Create(IDB_HOTTOOLBAR, 22, 0, RGB(255, 0, 255));

m_wndToolBar.GetToolBarCtrl().SetHotImageList(&img);

img.Detach();

//圖象清單裝載正常狀态的圖像資源，IDB_COLDTOOLBAR為圖像資源ID

img.Create(IDB_COLDTOOLBAR, 22, 0, RGB(255, 0, 255));

m_wndToolBar.GetToolBarCtrl().SetImageList(&img);

img.Detach();

//設定工具條為扁平風格

m_wndToolBar.ModifyStyle(0, TBSTYLE_FLAT | TBSTYLE_TRANSPARENT);

//設定工具條上的按鈕個數為9個；

m_wndToolBar.SetButtons(NULL, 9);

// 裝載字元串資源，設定按鈕上的文本和按鈕的辨別号；

m_wndToolBar.SetButtonInfo(0, ID_GO_BACK, TBSTYLE_BUTTON, 0);

str.LoadString(IDS_BACK);

m_wndToolBar.SetButtonText(0, str);

m_wndToolBar.SetButtonInfo(1, ID_GO_FORWARD, TBSTYLE_BUTTON, 1);

str.LoadString(IDS_FORWARD);

m_wndToolBar.SetButtonText(1, str);

m_wndToolBar.SetButtonInfo(2, ID_VIEW_STOP, TBSTYLE_BUTTON, 2);

str.LoadString(IDS_STOP);

m_wndToolBar.SetButtonText(2, str);

m_wndToolBar.SetButtonInfo(3, ID_VIEW_REFRESH, TBSTYLE_BUTTON, 3);

str.LoadString(IDS_REFRESH);

m_wndToolBar.SetButtonText(3, str);

m_wndToolBar.SetButtonInfo(4, ID_GO_START_PAGE, TBSTYLE_BUTTON, 4);

str.LoadString(IDS_HOME);

m_wndToolBar.SetButtonText(4, str);

m_wndToolBar.SetButtonInfo(5, ID_GO_SEARCH_THE_WEB, TBSTYLE_BUTTON, 5);

str.LoadString(IDS_SEARCH);

m_wndToolBar.SetButtonText(5, str);

m_wndToolBar.SetButtonInfo(6, ID_FAVORITES_DROPDOWN, TBSTYLE_BUTTON | TBSTYLE_DROPDOWN, 6);

str.LoadString(IDS_FAVORITES);

m_wndToolBar.SetButtonText(6, str);

m_wndToolBar.SetButtonInfo(7, ID_FILE_PRINT, TBSTYLE_BUTTON, 7);

str.LoadString(IDS_PRINT);

m_wndToolBar.SetButtonText(7, str);

m_wndToolBar.SetButtonInfo(8, ID_FONT_DROPDOWN, TBSTYLE_BUTTON | TBSTYLE_DROPDOWN, 8);

str.LoadString(IDS_FONT);

m_wndToolBar.SetButtonText(8, str);

// 設定工具欄上的按鈕尺寸和顯示在按鈕上的圖示尺寸；

CRect rectToolBar;

m_wndToolBar.GetItemRect(0, &rectToolBar);

m_wndToolBar.SetSizes(rectToolBar.Size(), CSize(30,20));

//建立組合框，用來作為位址欄；

if (!m_wndAddress.Create(CBS_DROPDOWN | WS_CHILD, CRect(0, 0, 200, 120), this, AFX_IDW_TOOLBAR + 1))

{ TRACE0("Failed to create combobox/n");

return -1; }

//建立動畫控件對象，并打開AVI資源IDR_MFCAVI；

m_wndAnimate.Create(WS_CHILD | WS_VISIBLE, CRect(0, 0, 10, 10), this, AFX_IDW_TOOLBAR + 2);

m_wndAnimate.Open(IDR_MFCAVI);

//将工具條、位址欄、動畫控件等添加到CReBar對象中；

m_wndReBar.AddBar(&m_wndToolBar);

m_wndReBar.AddBar(&m_wndAnimate, NULL, NULL, RBBS_FIXEDSIZE | RBBS_FIXEDBMP);

str.LoadString(IDS_ADDRESS);

m_wndReBar.AddBar(&m_wndAddress, str, NULL, RBBS_FIXEDBMP | RBBS_BREAK);

//再次設定工具條風格，使之有工具欄提示功能；

m_wndToolBar.SetBarStyle(m_wndToolBar.GetBarStyle() |

CBRS_TOOLTIPS | CBRS_FLYBY | CBRS_SIZE_FIXED);

//設定狀态條；

if (!m_wndStatusBar.Create(this) || !m_wndStatusBar.SetIndicators(indicators,

sizeof(indicators)/sizeof(UINT)))

{ TRACE0("Failed to create status bar/n");

return -1; }

…….//實作"Favorites"菜單的部分，該部分在第二部分介紹；

return 0;

}