Day-17 MFC 이야기와 실습2

카드 짝 맞추기 게임을 MFC를 이용해 만들어보자.

우선 이미지 파일을 C드라이브 및 temp 폴더에 넣어주자.

카드는 총 19장을 사용한다. 0~18번까지 19개의 숫자를 사용하고 0번은 뒷면이고 1~18번은 그림 이미지를 사용할 것이다.

또한 1~18번을 각 두장씩 뿌려서 같은 번호가 두 개씩 나오도록 해야한다. 카드를 섞을 때는 1~17번 까지 두번을 순서대로 뿌린 후 random하게 2개를 뽑아 자리를 바꾸는 행위를 반복해서 카드를 섞는다. 두 개의 같은 번호(같은 이미지)

WM_TIMER 메세지

우리가 보통 행위를 해야지 메세지를 받을 수 있는데 일정 시간마다 메시지를 받을 수 있도록 하는것이 TIMER이다. 일정 시간마다 WM_TIMER 메세지를 받는다. WM_TIMER가 싫다면 CALLBACK 함수를 사용하면 되지만 WM_TIMER 메세지를 처리하는것보다 훨씬 어렵다.

MFC 프로젝트를 만들어보자.

MFC 응용 프로그램을 선택하고 이름은 한글을 되도록 사용하지 말고 영어와 숫자 조합으로 사용하는 것이 좋다.

솔루션용 디렉터리 만들기를 선택하지 않으면 버그가 생길 수 있기 때문에 반드시 선택하자.

Default는 다중 문서가 선택되어 있지만 대화 상자 기반으로 선택하고, SDL 검사를 빼는 것이 좋다.

정보 상자를 빼고 다음을 누르자

고급 기능을 모두 빼고 다음을 누르자.

App, Dlg 파일이 있으면 마침을 눌러 최종적으로 프로젝트를 생성하자.

MFC 응용 프로그램 생성 후 글꼴을 굴림으로 바꾸자.

ExamCard1.cpp 소스 파일에 가서 최소한의 코드만 남긴 후 지워주자.

위와 같은 소스가 최소한의 소스이다.

우선 ExamCard1.h 파일로 이동해 사용할 카드 이미지를 저장할 클래스를 선언하자.

카드의 이미지 파일의 이름은 00x.bmp 이다. 카드는 총 19개가 있으니 000.bmp ~ 019.bmp 까지 총 19개의 이미지 파일이 있다.

CString 클래스는 문자열에 관한 기능을 많이 가지고 있어 초보자들이 사용하기 좋지만 무겁고 느린 클래스이다.

위와 같이 사용할 수 있다.

str 클래스 내부에서 "abc"를 저장할 수 있는 크기를 동적 할당한 후에 "abc"를 복사해서 저장한다.

printf와 똑같은 형식으로 사용할 수 있다. L은 유니코드를 사용하겠다는 것이다. CString 클래스에 내부적으로 5가 저장된다.

이번에는 이미지를 저장하는 소스코드를 작성할 것이다. 이미지는 c:\\temp에 저장을 할 것이다. m_card_list 배열에 각각의 이미지를 로드한다.

m_card_list 배열에 19개의 이미지가 저장되어 있다. 19개의 이미지를 화면에 출력해보자.

(10, 10) 부터 시작하여 20씩 이동하면서 카드를 화면에 나타내보자.

위와 같이 this 포인터를 이용해 카드를 그리면 된다. 위와 같이 작성하고 빌드 후 디버깅을 시작하면 아래와 같이 겹쳐서 아래와 같이 나온다.

이제 본격적으로 게임을 만들어보자. 카드를 화면에 출력해 보았으니 게임할 틀을 만들자.

게임할 틀은 위에서 말했들이 18X18 형태이다. 따라서 헤더파일에 게임 틀을 만들 배열을 선언하자.

짝 맞추기 게임을 하려면 같은 숫자가 두 개씩 있어야 한다. % 연산자를 보다 쉽게 같은 숫자를 두 개씩 사용할 수 있다.

또한 srand 함수를 이용해 난수를 발생해보자. rand 함수도 난수를 발생시키는 함수이다. 하지만 rand 함수는 난수가 고정되어 발생해 반복되어 게임이 무작위로 섞이지 않고 같은 순서로 바뀐다. 난수 발생의 조건을 바꾸기 위해서 srand 함수를 사용한다. seed가 같으면 난수가 동일하게 나와서 seed 값을 바꾸어줘야 하는데 time 함수는 매 초 늘어나고 있기 때문에 난수가 무작위로 발생한다.

카드의 가로는 36, 세로는 56이다. 한 줄에 6개씩 6줄을 만들어야 한다. 6칸, 6줄을 만들기 위해서 % 연산자와 / 연산자를 사용한다.

0번은 뒷면이기 때문에 m_game_table[i] + 1을 하여 0번이 아닌 1번부터 나오도록 한다.

위와 같이 수정을 한 뒤 빌드 후 디버깅을 하자.

위와 같이 나오면 된다. 이번에는 카드를 테이블 형태로 화면에 출력을 했으니 카드를 섞는 작업을 해보자. 카드를 섞는 방법에는 여러가지 방법이 있지만 우리는 카드를 순서대로 배열하고 무작위로 두개의 카드를 뽑아서 위치를 바꾸는 작업을 반복해서 카드를 섞을 것이다. 카드 두개를 섞을 때 확률적으로 같은 이미지가 나올 수 있지만 확률적으로 매우 낮고 if문을 사용할 경우 효율성이 떨어지기 때문에 반복 과정을 늘려서 사용하는 것이 좋다.

위와 같이 작성하면 무작위로 섞을 수 있다. 빌드 후 디버깅을 하면 아래와 같이 잘 섞이는 것을 알 수 있다.

이제 게임을 시작하기 위해 처음 3초만 카드를 보여주고 뒷면으로 바꾸는 작업을 해야한다. SetTimer() 함수를 사용해서 처리해보자.

SetTimer() 함수를 호출하고 난 후 클래스 마법사를 이용해서

이후에 타이머 메세지가 왔을 때 처리하는 코드를 작성해주자.

카드의 앞면인지 뒷면인지 구분할 필요가 잇다.따라서 구분해줄 수 있는 변수를 선언하자.

flag가 0이면 뒷면을 그려주고 0이 아니면 이미지를 그려주는 소스이다.

WM_TIMER 메세지가 들어오면 flag=0을 대입해 모두 뒷면으로 만들어주는 소스이다.

위와 같이 소스를 입력하고 빌드후 디버깅 해보면 아래와 같이 앞면이 보이고 3초뒤 뒷면으로 바뀐다.

이제 게임의 준비가 끝났다. 하지만 카드를 클릭해도 아무런 변화가 나타나지 않는다. 카드가 클릭될 때 카드가 뒤집히고 같은 카드를 선택했을 때 사라지도록 소스코드를 수정해보자. 클래스 마법사를 이용해 클래스를 추가하자.

마우스가 클릭되는 위치를 계산해보자. 이미지 카드의 가로와 세로를 이용해서 소스코드를 작성하자.

위와 같이 소스코드를 작성하면 클릭한 카드가 뒷면에서 앞면으로 바뀌면서 이미지가 그려진다. 빌드 후 디버깅해보자.

하지만 같은 카드를 선택해도 사라지지 않고 2개 이상 여러개의 카드를 선택할 수 있다. 2개의 카드만 선택할 수 있도록 소스코드를 수정하자.

카드가 처음 선택되었는지 아닌지 확인하기 위해 새로운 변수를 선언해준다.

변수를 선언하고 카드가 2개를 선택하고 2개의 카드가 같으면 사라지게 소스코드를 작성하자.

같은 위치를 두번 두르는것도 사라지는 경우가 발생한다. 왜냐하면 같은 카드를 누르는 것도 같은 숫자를 고르는것이기 때문이다.

아래와 같이 같은 카드를 두번 누르는 곳을 방지하자.

위의 소스 코드는 동시에 여러개를 누르는 것이 가능하다. 두 개의 이미지가 눌리지 않도록 소스코드를 수정하자.

여기까지 소스코드를 작성하면 기본적인 카드 맞추기 게임이 만들어진다. 빌드 후 디버깅하면 아래와 같이 실행된다.

위와 같이 실행이 잘 될 것이다. 이 상태로 끝내도 재미있지만 힌트 기능이 있었으면 좋겠다는 생각이 든다. 따라서 버튼을 누르면 모든 이미지가 뒷면에서 앞면으로 바뀌는 버튼을 추가해보자.

button을 드래그해서 윈도우 창에 올리자. button1을 클릭한 후 속성을 클릭해 caption을 3으로 바꾸어주자.

이제 3 버튼을 더블 클릭하면 ExamCard1Dlg.cpp 파일의 제일 밑에 오버라이딩 된다. 여기서 3을 누르면 2초동안 이미지를 보여주고 3을 2로 바꾸는 과정을 하는 소스를 작성해보자.

위와 같이 소스를 작성하고 3을 누르면 2로 바뀌고 2를 누르면 1로 바뀌는 것을 알 수 있다.

전체 소스 코드를 적으면 아래와 같다.

ExamCard1Dlg.h

ExamCard1Dlg.cpp

// ExamCard1Dlg.cpp : 구현 파일
//

#include "stdafx.h"
#include "ExamCard1.h"
#include "ExamCard1Dlg.h"
#include "afxdialogex.h"

#ifdef _DEBUG
#define new DEBUG_NEW
#endif

// CExamCard1Dlg 대화 상자

CExamCard1Dlg::CExamCard1Dlg(CWnd* pParent /*=NULL*/)
	: CDialogEx(IDD_EXAMCARD1_DIALOG, pParent)
{
	m_hIcon = AfxGetApp()->LoadIcon(IDR_MAINFRAME);
	
	srand((unsigned int)time(NULL));		// 매초마다 seed 값이 바뀌는 난수를 발생시킨다.

for (int i = 0; i < 36; i++) {
		// m_game_table[i] = i;				// 0 ~ 35까지의 숫자가 들어간다.
		m_game_table[i] = i % 18;			// 18의 나머지로 같은 숫자가 두 개씩 들어간다.
	}
	
	int first, second, temp;
	for (int i = 0; i < 50; i++) {									// 카드를 50번 섞는다.
		first = rand() % 36;										// 난수를 36으로 나눈 나머지 번째 카드를 선택한다.
		second = rand() % 36;										// 난수를 36으로 나눈 나머지 번째 카드를 선택한다.

temp = m_game_table[first];									// 카드가 섞인다.
		m_game_table[first] = m_game_table[second];
		m_game_table[second] = temp;
	}
}

void CExamCard1Dlg::DoDataExchange(CDataExchange* pDX)
{
	CDialogEx::DoDataExchange(pDX);
}

BEGIN_MESSAGE_MAP(CExamCard1Dlg, CDialogEx)
	ON_WM_PAINT()
	ON_WM_QUERYDRAGICON()
	ON_WM_TIMER()
	ON_WM_LBUTTONDOWN()
	ON_BN_CLICKED(IDC_BUTTON1, &CExamCard1Dlg::OnBnClickedButton1)
END_MESSAGE_MAP()

// CExamCard1Dlg 메시지 처리기

BOOL CExamCard1Dlg::OnInitDialog()
{
	CDialogEx::OnInitDialog();

// 이 대화 상자의 아이콘을 설정합니다.  응용 프로그램의 주 창이 대화 상자가 아닐 경우에는
	//  프레임워크가 이 작업을 자동으로 수행합니다.
	SetIcon(m_hIcon, TRUE);			// 큰 아이콘을 설정합니다.
	SetIcon(m_hIcon, FALSE);		// 작은 아이콘을 설정합니다.

CString str;

for (int i = 0; i < 19; i++) {
		str.Format(L"c:\\temp\\%03d.bmp", i);			// 001.bmp, 002.bmp ~ 019.bmp
		m_card_list[i].Load(str);						// m_card_list 배열에 19장의 카드 이미지가 모두 저장된다.
	}

SetTimer(1, 3000, NULL);			// 내가 현재 사용할 TIMER ID=1, 3000MS = 3초, 3초마다 메세지를 준다.
										// CALLBACK 함수의 사용 여부가 3번째 인자이다. NULL은 함수 호출을 하지 않는다는 의미이다.

return TRUE;  // 포커스를 컨트롤에 설정하지 않으면 TRUE를 반환합니다.
}

// 대화 상자에 최소화 단추를 추가할 경우 아이콘을 그리려면
//  아래 코드가 필요합니다.  문서/뷰 모델을 사용하는 MFC 응용 프로그램의 경우에는
//  프레임워크에서 이 작업을 자동으로 수행합니다.

void CExamCard1Dlg::OnPaint()
{
	if (IsIconic())
	{
		CPaintDC dc(this); // 그리기를 위한 디바이스 컨텍스트입니다.

SendMessage(WM_ICONERASEBKGND, reinterpret_cast<WPARAM>(dc.GetSafeHdc()), 0);

// 클라이언트 사각형에서 아이콘을 가운데에 맞춥니다.
		int cxIcon = GetSystemMetrics(SM_CXICON);
		int cyIcon = GetSystemMetrics(SM_CYICON);
		CRect rect;
		GetClientRect(&rect);
		int x = (rect.Width() - cxIcon + 1) / 2;
		int y = (rect.Height() - cyIcon + 1) / 2;

// 아이콘을 그립니다.
		dc.DrawIcon(x, y, m_hIcon);
	}
	else
	{
		CPaintDC dc(this);
		int index;
		for (int i = 0; i < 36; i++) {
			index = m_game_table[i] + 1;
			if (index == 0) continue;							// 없어진 카드이기 때문에 그리지 않는다.
			
			if (m_preview_flag == 0) index = 0;
																// 0번은 뒷면이기 때문에 +1을 해주어 뒷면이 나오지 않게 한다.
			m_card_list[index].Draw(dc, (i%6)*36, (i/6)*56);	// 카드의 가로는 36, 세로는 56이다.
		}
		// CDialogEx::OnPaint();
	}
}

// 사용자가 최소화된 창을 끄는 동안에 커서가 표시되도록 시스템에서
//  이 함수를 호출합니다.
HCURSOR CExamCard1Dlg::OnQueryDragIcon()
{
	return static_cast<HCURSOR>(m_hIcon);
}

void CExamCard1Dlg::OnTimer(UINT_PTR nIDEvent)
{

if (nIDEvent == 1) {					// 1번 타이머가 들어왔을 때 하는 행위이다.
		KillTimer(1);						// 더 이상 타이머 메세지를 발생시키지 말라는 함수이다.
		m_preview_flag = 0;					// 뒷면으로 만들기 위해서이다.
		Invalidate();						// WM_PAINT 메세지가 발생한다. 화면 갱신 함수이다.
		
	} else CDialogEx::OnTimer(nIDEvent);

CDialogEx::OnTimer(nIDEvent);
}

void CExamCard1Dlg::OnLButtonDown(UINT nFlags, CPoint point)
{
	if (m_preview_flag) return;									// 카드가 뒤집어 지기전에 클릭하는것을 막는다.
	if (point.x < 36 * 6 && point.y < 56 * 6) {					// 카드 내부에 마우스가 클릭되었을 때
		int x = point.x / 36;									// 0~5 사이의 값이 나온다.
		int y = point.y / 56;									// 0~5 사이의 값이 나온다.
		int pos = y * 6 + x;									// 몇 번째 카드인지 구한다.
		int index = m_game_table[pos] + 1;						// 0번은 뒷면이기 때문에 +1을 한다.
		if (index == 0) return;									// 눌러진 카드를 또 누를 수 없다.

CClientDC dc(this);
		m_card_list[index].Draw(dc, x * 36, y * 56);

if (m_first_card_index == -1) m_first_card_index = pos;
		else {
			if (m_first_card_index != pos) {						// 같은 위치를 두 번 클릭할 때를 방지한다.

if (m_game_table[m_first_card_index] == m_game_table[pos]) {
					m_game_table[m_first_card_index] = -1;			// 똑같은 카드를 맞추면 카드를 없앤다.
					m_game_table[pos] = -1;
				}

m_first_card_index = -1;							// 카드를 다시 선택해야 하기 때문에 -1로 바꿔야 한다. 다시 뒷면으로 뒤집어야 한다.
	//			Invalidate();										// 없어지거나 뒤집어진다. 맞추면 카드가 순식간에 없어지거나 틀리면 너무 빠르게 뒤집어 져서 확인할 수 없다.
				m_preview_flag = 2;
				SetTimer(1, 1000, NULL);							// 단점이 있다. 굉장히 빠르게 누르면 여러가지를 누를 수 있다.
			}
		}
	}
}

void CExamCard1Dlg::OnBnClickedButton1()
{
	CString str;
	GetDlgItemText(IDC_BUTTON1, str);
	int num = _wtoi(str);						// CString 클래스의 문자열을 int형태로 바꾼다.
	if (num > 0) {
		str.Format(L"%d", num - 1);
		SetDlgItemText(IDC_BUTTON1, str);
		m_preview_flag = 1;
		Invalidate();							// WM_PAINT 발생
		SetTimer(1, 2000, NULL);				// 2초 뒤 뒷면으로 바꾼다.
	}
}

ExamCard1.cpp

'Programming > TIPS 17기' 카테고리의 다른 글

Day-16 MFC이야기와 실습1 (0)	2017.08.20
Day-15 Win32 API 이야기와 실습2 (0)	2017.08.17
Day-14 Win32 API 이야가와 실습1 (0)	2017.08.15
Day-13 C++ 이야기3 (0)	2017.08.14
Day-12 C++ 이야기2 (0)	2017.08.11

marco