1. 程式人生 > >MFC實現多TAB頁的切換

MFC實現多TAB頁的切換

1. 新建一個MFC工程, 取名MyTab, 選擇Dialog based, 然後Finish.
2. 刪除對話方塊上預設新增的三個控制元件. 新增Tab Control控制元件並在Property屬性中設定ID為IDC_TABTEST 在More Styles裡勾上Bottom. 調速尺寸使其佈滿整個對話方塊, 我這邊Tab Control的尺寸最後為164X203. 在ClassWizard為其新增變數, 變數名為m_tab. 型別為CTabCtrl.
3. 在對話方塊的初始化函式OnInitDialog裡面新增如下程式碼:
clip_image001m_tab.InsertItem(0,"引數一");  //新增引數一選項卡

clip_image001[1]m_tab.InsertItem(1,"引數二");  //新增引數二選項卡
clip_image001[2]m_tab.InsertItem(2,"結果");    //新增結果選項卡

4.在對話方塊資源裡面新增三個對話方塊資源, ID分別命名為IDD_PARA1, IDD_PARA2, IDD_RESULT. 字型為宋體, 字號為9, style為Child, Border為None, 寬度調整為161. 再分別為其新增對應的基於CDialog類CPara1, CPara2, CResult.
5. 在CMyTabDlg類中新增三個成員變數m_para1, m_para2, m_result, 分別是三個子對話方塊的例項. 程式碼如下:

clip_image001[3]CResult m_result;
clip_image001[4]CPara2 m_para2;
clip_image001[5]CPara1 m_para1;
6. 在IDD_PARA1對話方塊上新增靜態文字控制元件內容為"引數一" 再在後面插入一個文字框控制元件, 用ClassWizard將其關聯為一個int型變數,名為m_nPara1;
在IDD_PARA2對話方塊上新增靜態文字控制元件內容為"引數二" 再在後面插入一個文字框控制元件, 用ClassWizard將其關聯為一個int型變數,名為m_nPara2;
在IDD_RESULT對話方塊上新增靜態文字控制元件內容為"結果" 再在後面插入一個文字框控制元件, 用ClassWizard將其關聯為一個int型變數,名為m_nResult;
7. 為CPara1類新增成員函式int GetParaValue() 程式碼如下:

clip_image001[6]int CPara1::GetParaValue()
clip_image002clip_image003...{
clip_image004 return m_nPara1;
clip_image005}
為CPara2類新增成員函式int GetParaValue() 程式碼如下:
clip_image001[7]int CPara2::GetParaValue()
clip_image002[1]clip_image003[1]...{
clip_image004[1] return m_nPara2;
clip_image005[1]}
為CResult類新增成員函式void SetResultValue(int nResult) 程式碼如下:
clip_image001[8]void CResult::SetResultValue(int nResult)
clip_image002[2]clip_image003[2]...{
clip_image004[2]     m_nResult = nResult;
clip_image005[2]}
8. 在IDD_MYTAB_DIALOG對話方塊的初始化函式OnInitDialog裡面新增如下程式碼:
clip_image001[9]//關聯對話方塊,並且將IDC_TABTEST控制元件設為父視窗
clip_image001[10]m_para1.Create(IDD_PARA1,GetDlgItem(IDC_TABTEST));
clip_image001[11]m_para2.Create(IDD_PARA2,GetDlgItem(IDC_TABTEST));
clip_image001[12]m_result.Create(IDD_RESULT,GetDlgItem(IDC_TABTEST));
clip_image001[13]
clip_image001[14]//獲得IDC_TABTEST客戶區大小
clip_image001[15]CRect rs;
clip_image001[16]m_tab.GetClientRect(&rs);
clip_image001[17]//調整子對話方塊在父視窗中的位置
clip_image001[18]rs.top+=1;
clip_image001[19]rs.bottom-=60;
clip_image001[20]rs.left+=1;
clip_image001[21]rs.right-=2;
clip_image001[22]
clip_image001[23]//設定子對話方塊尺寸並移動到指定位置
clip_image001[24]m_para1.MoveWindow(&rs);
clip_image001[25]m_para2.MoveWindow(&rs);
clip_image001[26]m_result.MoveWindow(&rs);
clip_image001[27]
clip_image001[28]//分別設定隱藏和顯示
clip_image001[29]m_para1.ShowWindow(true);
clip_image001[30]m_para2.ShowWindow(false);
clip_image001[31]m_result.ShowWindow(false);
clip_image001[32]
clip_image001[33]//設定預設的選項卡
clip_image001[34]m_tab.SetCurSel(0);

9. 新增Tab Control控制元件的TCN_SELCHANGE事件響應函式OnSelchangeTabtest(NMHDR* pNMHDR, LRESULT* pResult) ,函式體程式碼如下:

clip_image001[35]int CurSel = m_tab.GetCurSel();
clip_image001[36] switch(CurSel)
clip_image002[3]clip_image003[3] ...{
clip_image004[3] case 0:
clip_image004[4]         m_para1.ShowWindow(true);
clip_image004[5]         m_para2.ShowWindow(false);
clip_image004[6]         m_result.ShowWindow(false);
clip_image004[7] break;
clip_image004[8] case 1:
clip_image004[9]         m_para1.ShowWindow(false);
clip_image004[10]         m_para2.ShowWindow(true);
clip_image004[11]         m_result.ShowWindow(false);
clip_image004[12] break;
clip_image004[13] case 2:
clip_image004[14]         m_para1.ShowWindow(false);
clip_image004[15]         m_para2.ShowWindow(false);
clip_image004[16]         m_result.ShowWindow(true);
clip_image004[17] break;
clip_image004[18] default:
clip_image004[19]         ;
clip_image005[3]     }    
clip_image001[37]
clip_image001[38]    *pResult = 0;

10. 在IDD_MYTAB_DIALOG對話方塊下面新增一個按鈕, 標題為"計算" 為其新增事件響應函式, 程式碼如下:

clip_image001[39]m_para1.UpdateData(true);
clip_image001[40]     m_para2.UpdateData(true);
clip_image001[41]     m_result.SetResultValue(m_para1.GetParaValue()+m_para2.GetParaValue());
clip_image001[42]     m_result.UpdateData(false);   

11. 最後演示結果如下:

clip_image007

clip_image009

clip_image010

12. 這個小程式很簡單,但是他說明了Tab Control控制元件的基本用法.

用法2

VC中的CTabCtrl用法與VB、Delphi的選項卡控制元件有很大的不同,每個屬性頁是用一個“窗體”(對話方塊)來實現,於是要為每個屬性頁對話方塊建類,還要關聯、初始化„„實在麻煩得多。但是CTabCtrl可重用性比ActiveX的選項卡控制元件好,因為一個屬性頁可以被多個不同的選項卡對話方塊呼叫,就像MFC中很多屬性選項卡有“General”這一選項頁,可以被多個控制元件的屬性頁呼叫,作為“通用”的,有符合現代軟體工程可重用性要求。

下面發一個最簡單的程式碼,使用CTabCtrl控制元件實現屬性頁功能。

1、建立一個基於對話方塊的應用程式;

2、畫CTabCtrl控制元件,類嚮導中關聯變數名為m_tab,新建三個對話方塊屬性設為Child,None,用ClassWizard生成新的類,基類為Cdialog,分別為Cpage0,Cpage1,Cpage2,ID號分別為IDD_DIALOG0,IDD_DIALOG1,IDD_DIALOG2。在主對話方塊中加入三個變數,Cpage0 page0;Cpage1 page1;Cpage2 page2。別忘了在主對話方塊的標頭檔案中要加入#include "Page0.h",#include "Page1.h",#include "Page2.h"

3、在主對話方塊的OnInitDialog()內初始化 :

// TODO: Add extra initialization here

//初始化m_tab控制元件

m_tab.InsertItem(0," 呵呵,茂葉工作室 ");

m_tab.InsertItem(1," 嘻嘻 ");

m_tab.InsertItem(2," 哈哈,www.maoyeah.com ");

//建立屬性頁各頁

page0.Create(IDD_DIALOG0,GetDlgItem(IDC_TAB1));

page1.Create(IDD_DIALOG1,GetDlgItem(IDC_TAB1));

page2.Create(IDD_DIALOG2,GetDlgItem(IDC_TAB1));

//設定頁面的位置在m_tab控制元件範圍內

CRect rect;

m_tab.GetClientRect(&rect);

rect.top+=20;

rect.bottom-=5;

rect.left+=5;

rect.right-=5;

page0.MoveWindow(&rect);

page1.MoveWindow(&rect);

page2.MoveWindow(&rect);

page1.ShowWindow(TRUE);

m_tab.SetCurSel(1);

4、m_tab控制元件屬性頁選擇時顯示各頁:

void CMy3Dlg::OnSelchangeTab1(NMHDR* pNMHDR, LRESULT* pResult)

{

// TODO: Add your control notification handler code here

int CurSel;

CurSel=m_tab.GetCurSel();

switch(CurSel)

{

case 0:

page0.ShowWindow(TRUE);

page1.ShowWindow(FALSE);

page2.ShowWindow(FALSE);

break;

case 1:

page0.ShowWindow(FALSE);

page1.ShowWindow(TRUE);

page2.ShowWindow(FALSE);

break;

case 2:

page0.ShowWindow(FALSE);

page1.ShowWindow(FALSE);

page2.ShowWindow(TRUE);

break;

default: ;

}

*pResult = 0;

}