使用過IE浏覽器的朋友都知道IE界面上的扁平工具條、地址欄,扁平工具欄上的按鈕正常狀態下為扁平態,按鈕上的圖像為灰色,當鼠標放在按鈕上時,按鈕突起(這種狀態稱為手柄),並且其上的圖像變得鮮艷醒目,一些按鈕上還有漢字說明或標有小黑三角的下拉按鈕,單擊時顯示下拉菜單,這些技術是怎麼實現的呢,本文針對這些問題介紹了如何利用VC編程來實現它們。
IE風格的實現主要在主框架類的CMainFrame::OnCreate()實現,它的主要思想如下:首先定義一個CReBar對象,用以作工具條、地址欄的容器,然後分別聲明圖像列表對象img用於存儲工具欄上按鈕的熱點圖像和正常狀態下顯示的圖像。為了顯示扁平工具欄,需要用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)
{
CReBar m_wndReBar;//聲明CReBar對象
CImageList img;//聲明圖像列表對象
CString str;
if (CFrameWnd::OnCreate(lpCreateStruct) == -1)
return -1;
if (!m_wndReBar.Create(this))//創建CReBar對象
{
TRACE0("Failed to create rebar ");
return -1; // fail to create
}
if (!m_wndToolBar.CreateEx(this))//創建工具條對象
{
TRACE0("Failed to create toolbar ");
return -1; // fail to create
}
// set up toolbar propertIEs
m_wndToolBar.GetToolBarCtrl().SetButtonWidth(50, 150);
file://設置工具條上按鈕的最大、最小尺寸
m_wndToolBar.GetToolBarCtrl().SetExtendedStyle(TBSTYLE_EX_DRAWDDARROWS);
file://工具條可以帶有下拉按鈕
img.Create(IDB_HOTTOOLBAR, 22, 0, RGB(255, 0, 255));
file://向圖像列表裝載熱點圖像資源,IDB_HOTTOOLBAR為熱點圖像資源ID
m_wndToolBar.GetToolBarCtrl().SetHotImageList(&img);//工具條裝載熱點圖像
img.Detach();
img.Create(IDB_COLDTOOLBAR, 22, 0, RGB(255, 0, 255));
file://圖象列表裝載正常狀態的圖像資源,IDB_COLDTOOLBAR為圖像資源ID
m_wndToolBar.GetToolBarCtrl().SetImageList(&img);//將圖像裝入工具條
img.Detach();
m_wndToolBar.ModifyStyle(0, TBSTYLE_FLAT | TBSTYLE_TRANSPARENT);
file://工具條為扁平風格
m_wndToolBar.SetButtons(NULL, 9);//工具條上有9個按鈕
// set up each toolbar button
file://以下分別對九個按鈕分別設置風格和按鈕漢語提示
m_wndToolBar.SetButtonInfo(0, ID_BUTTON0, TBSTYLE_BUTTON, 0);
str.LoadString(IDS_ BUTTON0);
m_wndToolBar.SetButtonText(0, str);
m_wndToolBar.SetButtonInfo(1, ID_BUTTON1, TBSTYLE_BUTTON, 1);
str.LoadString(IDS_ BUTTON1);
m_wndToolBar.SetButtonText(1, str);
m_wndToolBar.SetButtonInfo(2, ID_BUTTON2, TBSTYLE_BUTTON, 2);
str.LoadString(IDS_ BUTTON2);
m_wndToolBar.SetButtonText(2, str);
m_wndToolBar.SetButtonInfo(3, ID_BUTTON3, TBSTYLE_BUTTON, 3);
str.LoadString(IDS_ BUTTON3);
m_wndToolBar.SetButtonText(3, str);
m_wndToolBar.SetButtonInfo(4, ID_BUTTON4, TBSTYLE_BUTTON, 4);
str.LoadString(IDS_ BUTTON4);
m_wndToolBar.SetButtonText(4, str);
m_wndToolBar.SetButtonInfo(5, ID_BUTTON5, TBSTYLE_BUTTON, 5);
str.LoadString(IDS_ BUTTON5);
m_wndToolBar.SetButtonText(5, str);
m_wndToolBar.SetButtonInfo(6, ID_BUTTON6, TBSTYLE_BUTTON | TBSTYLE_DROPDOWN, 6);
str.LoadString(IDS_ BUTTON6);
m_wndToolBar.SetButtonText(6, str);
m_wndToolBar.SetButtonInfo(7, ID_BUTTON7, TBSTYLE_BUTTON, 7);
str.LoadString(IDS_ BUTTON7);
m_wndToolBar.SetButtonText(7, str);
m_wndToolBar.SetButtonInfo(8,ID_BUTTON8, TBSTYLE_BUTTON | TBSTYLE_DROPDOWN, 8);
str.LoadString(IDS_ BUTTON8);
m_wndToolBar.SetButtonText(8, str);
file://重新調整按鈕的尺寸
CRect rectToolBar;
m_wndToolBar.GetItemRect(0, &rectToolBar);//得到工具條第一個按鈕的尺寸
m_wndToolBar.SetSizes(rectToolBar.Size(), CSize(30,20));
file://第一個參數為按鈕尺寸,第二個參數為圖像尺寸
file://創建一個組合框作為地址欄
if (!m_wndAddress.Create(CBS_DROPDOWN | WS_CHILD, CRect(0, 0, 200, 120), this, AFX_IDW_TOOLBAR + 1))
{
TRACE0("Failed to create combobox ");
return -1; // fail to create
}
file://加入工具欄、地址欄
m_wndReBar.AddBar(&m_wndToolBar);
str.LoadString(IDS_ADDRESS);
m_wndReBar.AddBar(&m_wndAddress, str, NULL, RBBS_FIXEDBMP | RBBS_BREAK);
file://定義REBARBANDINFO對象,對工具條和地址欄設置理想尺寸
REBARBANDINFO rbbi;
rbbi.cbSize = sizeof(rbbi);
rbbi.fMask = RBBIM_CHILDSIZE | RBBIM_IDEALSIZE | RBBIM_SIZE;
rbbi.cxMinChild = rectToolBar.Width();
rbbi.cyMinChild = rectToolBar.Height();
rbbi.cx = rbbi.cxIdeal = rectToolBar.Width() * 9;
m_wndReBar.GetReBarCtrl().SetBandInfo(0, &rbbi);//設置工具欄尺寸
rbbi.cxMinChild = 0;
CRect rectAddress;
rbbi.fMask = RBBIM_CHILDSIZE | RBBIM_IDEALSIZE;
m_wndAddress.GetEditCtrl()->GetWindowRect(&rectAddress);
rbbi.cyMinChild = rectAddress.Height() + 10;
rbbi.cxIdeal = 200;
m_wndReBar.GetReBarCtrl().SetBandInfo(2, &rbbi);//設置地址欄尺寸
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 ");
return -1; // fail to create
}
return 0;
}