[MFC] Tab Control을 사용하지 않고 여러 Form 스위칭하기(예제 포함)

지난 포스팅에서 메인 다이얼로그에 새로운 다이얼로그를 붙이는 예제를 보여드렸었습니다.
[MFC] Dialog에 Form(Dialog) 붙이기(예제 포함)

[MFC] Dialog에 Form(Dialog) 붙이기(예제 포함)

Form 스위칭? Tab Control과 다른 점은?

이번에는 이 방법을 응용하여 여러 Form을 스위칭하는 방법을 소개하려고 합니다. 사실 이 기능은 MFC의 Tab Control과 동일한 기능인데요. 아시다시피 MFC UI 컨트롤의 커스터마이징에는 한계가 있습니다. 하지만 이번에 소개하는 방법은 어렵지도 않고 사용자가 원하는대로 꾸밀 수 있다는 것이 장점입니다.

먼저 동작을 보여드리겠습니다.

Form Switching 예시

이 예제는 라디오 버튼이 필요합니다. 물론 꼭 라디오 버튼일 필요는 없지만, 직관적인 시각 효과를 위해 라디오 버튼을 사용했습니다.

예제 코드 Concept

이전 예제와 마찬가지로 Main Dialog에 스위칭 되는 Form이 보여질 Picture Control을 배치합니다. 그리고 Form 개수와 동일한 개수의 Radio Button을 추가합니다. Radio 버튼이 클릭되면 해당 Form이 보여지는 것입니다.

예제 프로그램 컨셉

스위칭 되는 Form의 크기가 제각각인데요. Form이 Picture control보다 크면 스크롤바가 생성되고, 작으면 생성되지 않습니다.

따라 하기

예제 코드는 본문 하단에 첨부되어 있습니다. 중요한 부분만 설명하고, 자세한 내용은 첨부된 코드를 참고해주세요!

리소스 편집기에서 여러 Dialog를 추가합니다. 더불어, Dialog에 클래스를 추가할 때 반드시 CFormView를 기본 클래스로 생성합니다. 아래 그림은 Main Dialog의 UI 배치 모습입니다.

Main Dialog

스위칭 될 Form은 아래 그림과 같이 생성합니다.

스위칭 될 Form

각 Form 클래스의 헤더 파일에는 다음과 같이 정의합니다. 예제에서는 각 Form의 클래스 명을 CMyForm1~3으로 정의했습니다. 또한, 가상 함수로 Create와 OnInitialUpdate를 정의합니다.

#pragma once


// CMyForm1 대화 상자

class CMyForm1 : public CFormView
{
	DECLARE_DYNAMIC(CMyForm1)

public:
	CMyForm1();
	CMyForm1(UINT nIDTemplate);
	virtual ~CMyForm1();

// 대화 상자 데이터입니다.
#ifdef AFX_DESIGN_TIME
	enum { IDD = IDD_FORM_FORM1 };
#endif

protected:
	virtual void DoDataExchange(CDataExchange* pDX);    // DDX/DDV 지원입니다.

	DECLARE_MESSAGE_MAP()
public:
	virtual BOOL Create(LPCTSTR lpszClassName, LPCTSTR lpszWindowName, DWORD dwStyle, const RECT& rect, CWnd* pParentWnd, UINT nID, CCreateContext* pContext = NULL);
	virtual void OnInitialUpdate();
};

Main Dialog의 헤더 파일에는 다음과 같이 정의합니다. Main Dialog에 Form을 동적 생성하는 AllocForms()와 Radio Button이 선택될 때, 선택된 Form을 보여주기 위한 ShowForm(int idx)함수를 정의합니다.

// ExamFormSwitchingDlg.h: 헤더 파일
//

#pragma once
#include "CMyForm1.h"
#include "CMyForm2.h"
#include "CMyForm3.h"

// CExamFormSwitchingDlg 대화 상자
class CExamFormSwitchingDlg : public CDialogEx
{
// 생성입니다.
public:
	CExamFormSwitchingDlg(CWnd* pParent = nullptr);	// 표준 생성자입니다.

// 대화 상자 데이터입니다.
#ifdef AFX_DESIGN_TIME
	enum { IDD = IDD_ExamFormSwitching_DIALOG };
#endif

	protected:
	virtual void DoDataExchange(CDataExchange* pDX);	// DDX/DDV 지원입니다.

	CMyForm1 *m_pForm1;
	CMyForm2 *m_pForm2;
	CMyForm3 *m_pForm3;
	
	void AllocForms();
	void ShowForm(int idx);
// 구현입니다.
protected:
	HICON m_hIcon;

	// 생성된 메시지 맵 함수
	virtual BOOL OnInitDialog();
	afx_msg void OnSysCommand(UINT nID, LPARAM lParam);
	afx_msg void OnPaint();
	afx_msg HCURSOR OnQueryDragIcon();
	DECLARE_MESSAGE_MAP()
public:
	afx_msg void OnDestroy();
	afx_msg void OnBnClickedRadioForm1();
	afx_msg void OnBnClickedRadioForm2();
	afx_msg void OnBnClickedRadioForm3();
};

Form이 생성되는 AllocForms()함수는 다음과 같이 구현합니다. 반복되는 코드가 많죠? 이렇게 반복되는 코드는 함수화하거나 상속 관계의 부모 클래스를 생성하여 간소화하면 깔끔하게 정리할 수 있습니다.

void CExamFormSwitchingDlg::AllocForms()
{
	CCreateContext context;
	ZeroMemory(&context, sizeof(context));

	CRect rectOfPanelArea;

	GetDlgItem(IDC_STATIC_RECT)->GetWindowRect(&rectOfPanelArea);
	ScreenToClient(&rectOfPanelArea);
	
	m_pForm1 = new CMyForm1();
	m_pForm1->Create(NULL, NULL, WS_CHILD | WS_VSCROLL | WS_HSCROLL, rectOfPanelArea, this, IDD_FORM_FORM1, &context);
	m_pForm1->OnInitialUpdate();
	m_pForm1->ShowWindow(SW_SHOW);

	m_pForm2 = new CMyForm2();
	m_pForm2->Create(NULL, NULL, WS_CHILD | WS_VSCROLL | WS_HSCROLL, rectOfPanelArea, this, IDD_FORM_FORM2, &context);
	m_pForm2->OnInitialUpdate();
	m_pForm2->ShowWindow(SW_HIDE);

	m_pForm3 = new CMyForm3();
	m_pForm3->Create(NULL, NULL, WS_CHILD | WS_VSCROLL | WS_HSCROLL, rectOfPanelArea, this, IDD_FORM_FORM3, &context);
	m_pForm3->OnInitialUpdate();
	m_pForm3->ShowWindow(SW_HIDE);

	GetDlgItem(IDC_STATIC_RECT)->DestroyWindow();
}

마지막으로 ShowForm(int idx)는 다음과 같이 구현합니다. 특정 인덱스를 인자로 넘기면, 해당되는 Form을 보여주고 나머지는 숨기는 것입니다.

void CExamFormSwitchingDlg::ShowForm(int idx)
{
	switch (idx)
	{
	case 0:
		m_pForm1->ShowWindow(SW_SHOW);
		m_pForm2->ShowWindow(SW_HIDE);
		m_pForm3->ShowWindow(SW_HIDE);
		break;
	case 1:
		m_pForm1->ShowWindow(SW_HIDE);
		m_pForm2->ShowWindow(SW_SHOW);
		m_pForm3->ShowWindow(SW_HIDE);
		break;
	case 2:
		m_pForm1->ShowWindow(SW_HIDE);
		m_pForm2->ShowWindow(SW_HIDE);
		m_pForm3->ShowWindow(SW_SHOW);
		break;
	}
}

정말 간단하죠? 여기서 Radio Button을 커스터마이징하여 예쁘게 꾸며주면 더욱 멋진 UI를 만들 수 있습니다. MFC에서 UI는 코딩하기 나름인 점을 꼭 기억하세요!

ExamFormSwitching.zip

0.14MB