Download
1 / 40
410 likes | 857 Views
MFC 두번째 시간. 그래피 에디터 만들기 - 마우스를 이용하여 간단한 도형을 그릴 수 있는 조그마한 그래픽 에디터 프로그램을 만들기 - 직선 , 원 , 사각형을 이용해서 간단한 그림을 그리기 기능 - 마우스 이용 방법과 GDI 함수를 이용해서 도형을 그리는 방법 , 직선 , 원 , 사각형과 같은 객체를 클래스로 작성하는 방법 습득 - 툴바를 이용해서 원하는 도형을 선택한 후 , 마우스를 이용해서 그림 그리기 - 펜의 종류 , 색상 , 굵기를 선택해서 도형 그리기.
E N D
MFC 두번째 시간 그래피 에디터 만들기 - 마우스를 이용하여 간단한 도형을 그릴 수 있는 조그마한 그래픽 에디터 프로그램을 만들기 - 직선, 원, 사각형을 이용해서 간단한 그림을 그리기 기능 - 마우스 이용 방법과 GDI 함수를 이용해서 도형을 그리는 방법, 직선, 원, 사각형과 같은 객체를 클래스로 작성하는 방법 습득 - 툴바를 이용해서 원하는 도형을 선택한 후, 마우스를 이용해서 그림 그리기 - 펜의 종류, 색상, 굵기를 선택해서 도형 그리기
AppWizard를 이용한 SDI 애플리케이션 만들기 1. Microsoft Visual C++ 6.0 실행 후 SDI 애플리케이션 만들기
Menu 추가하기 2. Workspace의 ResourceView로 이동하여 Menu 항목 선택하면 메뉴를 수정할 수 있는 편집모드가 나온다.
Menu 추가하기 3. “그리기” 메뉴 추가
Menu 추가하기 4. “직선”, “원”, “도형” 메뉴 추가시 ID를 적절한 이름으로 대체
Toolbar 버튼 추가하기 5. Workspace – ResourceView – Toolbar – IDR_MAINFRAME 선택
Toolbar 버튼 추가하기 편집 도구 6. 새 toolbar 편집하기
Toolbar 버튼 추가하기 7. 편집된 toolbar 버튼을 추가하고, 툴바 버튼과 연결시킬 커맨트 ID를 선택 (메뉴 삽입시에 입력한 ID 사용 – (예) ID_MENUITEM_line)
Toolbar 버튼 추가하기 8. 다른 메뉴와 툴바 버튼에 대해서 같은 작업 반복 (rectangle)
Toolbar 버튼 추가하기 9. 다른 메뉴와 툴바 버튼에 대해서 같은 작업 반복 (circle)
메뉴와 툴바 활성화하기 9. WM_COMMAND 메시지 핸들러와 UI 업데이트 핸들러 추가
메뉴와 툴바 활성화하기 10. 모든 그리기 메뉴에 대해서 수행
그리기 코드 삽입 11. 코드 삽입 // GraphicView.h #define LINE_MODE 100 #define CIRCLE_MODE 200 #define RECT_MODE 300 class CGraphicView : public CView { // 중략 int m_nCurDrawMode; // 현재 그릴 도형이 저장 // 중략 } // GraphicView.cpp CGraphicView::CGraphicView() { // TODO: add construction code here m_nCurDrawMode = LINE_MODE; // 직선을 기본으로 선택 }
그리기 코드 삽입 void CGraphicView::OnLine() { // TODO: Add your command handler code here m_nCurDrawMode = LINE_MODE; } void CGraphicView::OnCircle() { // TODO: Add your command handler code here m_nCurDrawMode = CIRCLE_MODE; } void CGraphicView::OnRect() { // TODO: Add your command handler code here m_nCurDrawMode = RECT_MODE; }
그리기 코드 삽입 12. 다른 메뉴 또는 버튼을 선택했을 때 메뉴와 툴바 버튼이 체크 상태로 두게 하기 위한 작업
그리기 코드 삽입 다른 메뉴 또는 버튼을 선택했을 때 메뉴와 툴바 버튼이 체크 상태로 두게 하기 위한 작업 –코딩 작업 void CGraphicView::OnUpdateCircle(CCmdUI* pCmdUI) { // TODO: Add your command update UI handler code here pCmdUI->SetCheck(m_nCurDrawMode == CIRCLE_MODE); } void CGraphicView::OnUpdateLine(CCmdUI* pCmdUI) { // TODO: Add your command update UI handler code here pCmdUI->SetCheck(m_nCurDrawMode == LINE_MODE); } void CGraphicView::OnUpdateRect(CCmdUI* pCmdUI) { // TODO: Add your command update UI handler code here pCmdUI->SetCheck(m_nCurDrawMode == RECT_MODE); }
마우스를 이용한 그리기 13. WM_LBUTTONDOWN, WM_MOUSEMOVE, WM_LBUTTONUP 메시지에서 그리는 작업을 하기 위하여 classwizard를 이용하여 메시지 핸들러 추가하기
그리기 코드 삽입 14. 모든 마우스 이벤트 선택 후 다음과 같은 코드 삽입 // GraphicView.h class CGraphicView : public CView { // 중략 CPoint m_StartPoint; BOOL m_IsDrawing; CPoint m_OldPoint; // 중략 } // GraphicView.cpp void CGraphicView::OnLButtonDown(UINT nFlags, CPoint point) { // TODO: Add your message handler code here and/or call default m_StartPoint = point; m_OldPoint = point; m_IsDrawing = TRUE; CView::OnLButtonDown(nFlags, point); }
그리기 코드 삽입 void CGraphicView::OnMouseMove(UINT nFlags, CPoint point) { // TODO: Add your message handler code here and/or call default if( m_IsDrawing ) { CClientDC dc(this); int oldMode = dc.SetROP2(R2_NOTXORPEN); dc.MoveTo(m_StartPoint); dc.LineTo(m_OldPoint); dc.MoveTo(m_StartPoint); dc.LineTo(point); m_OldPoint = point; dc.SetROP2(oldMode); } CView::OnMouseMove(nFlags, point); }
그리기 코드 삽입 void CGraphicView::OnLButtonUp(UINT nFlags, CPoint point) { // TODO: Add your message handler code here and/or call default if( m_IsDrawing ) { CClientDC dc(this); // CPen pen(m_PenStyle, m_PenWidth, m_ColorRef); // dc.SelectObject(&pen); dc.MoveTo(m_StartPoint); dc.LineTo(point); m_IsDrawing = FALSE; } CView::OnLButtonUp(nFlags, point); }
HW #1 * Circle과 Rectangle 소스 코드 추가하기
다양한 펜을 이용한 그리기 1. 다양한 펜을 선택할 수 있는 다이얼로그 박스를 만든다. Workspace-ResourceView-Dialog-AddDialog로 새로운 다이얼로그 하나 추가한다.
다양한 펜을 이용한 그리기 2. 다이얼로그의 ID와 Caption을 바꾼다.
그룹박스, 라디오 버튼 추가하기 Controls 툴바 3. Controls 툴바를 이용하여 필요한 resource를 추가한다.
필요한 리소스 모두 추가하기 4. 그룹박스, 라디오버튼, 리스트 박스, 스태틱 건트롤, 에디트 박스, 스핀 컨트롤
그룹박스 추가 방법 라디오 버튼의 속성 첫번쨰 라디오 버튼을 추가하고, 속성을 설정한다. 캡션을 “SOLID”로 입력하고, ID를 “IDC_PEN_STLYE” 로 입력하고, Group체크를 한다. 속성을 설정할 때, 반드시 첫 번째 라디오 버튼을 Group 속성을 체크 상태로 만들어야 한다. 나머지 라디오 버튼도 같은 과정을 거쳐서 추가한다. 다만, 첫번째 라디오 버튼과 달리 ID를 변경하지 않고, Group 속성을 체크하지 않는다.
필요한 리소스 모두 추가하기 5. 그룹박스, 라디오버튼, 리스트 박스, 스태틱 건트롤, 에디트 박스, 스핀 버튼 * 입력한 라디오버튼은 첫번째만 General Properties 중에 Group을 선택해준다. 나머지는 디폴트 값을 그대로 사용한다. 첫번째 라디어버튼의 ID만 IDC_PEN_STYLE로 변경한다. * 리스트박스의 Properties입력시에 ID를 IDC_COLOR_LIST로 명명한다. * 에디트 박스의 Properties입력시에 ID를 IDC_PEN_WIDTH_EDIT로 한다. * 스핀 버튼의 Properties입력시에 ID를 IDC_PEN_WIDTH_SPIN으로 한다. * 스핀 버튼의 Properties입력시에 Styles에서 Auto buddy와 Set buddyinteger를 체크한다. * Ctrl+T를 이용하여 초기모양을 볼 수 있다.
다이얼로그 클래스 추가하기 6. 다이얼로그 위에서 오른쪽 버튼을 클릭 ClassWizard 선택-Create a new class 선택-CPenDlg로 명명
멤버 변수 사용하기 7. Member Variable탭을 이용하여 다일러그의 컨트롤들을 멤버 변수로 사용할 수 있게 하기 (3개의 멤버 변수 추가)
다이얼로그 클래스 호출 8. 먼저, 메뉴를 추가한다. 9. 캡션 입력 (펜 선택) 10. ID입력 (ID_PEN_SELECT) 11. 메뉴 아이템에 해당하는 툴바 버튼 추가 12. 툴바 버튼과 연결시킬 커멘드 ID를 선택 (메뉴의 ID 선택) 13. ClassWizard를 이용하여 OnPenSelect() 함수 추가 후 다음 코드 삽입 14. GraphicView.cpp의 머리부분에 #include “PenDlg.h “추가 void CGraphicView::OnPenSelect() { // TODO: Add your command handler code here CPenDlg dlg; // 다이얼로그 CPenDlg의 객체를 선언 if(dlg.DoModal() == IDOK) { } }
펜 속성을 위한 변수 // PenDlg.cpp의 코드 살펴보기 CPenDlg::CPenDlg(CWnd* pParent /*=NULL*/) : CDialog(CPenDlg::IDD, pParent) { //{{AFX_DATA_INIT(CPenDlg) m_ColorStr = _T(""); m_Pen_Style = -1; => m_Pen_Style = 0; // 첫번째 라디오 버튼 m_PenWidth = 0; => m_PenWidth = 1; // 두께 1로 설정 //}}AFX_DATA_INIT }
WM_INITDIALOG 메시지 추가 15. 위자드바 클릭 – Add Windows Message Handler 메뉴 사용
펜 속성 변수 추가하기 16. PenDlg.h와 PenDlg.cpp에 다음 코드삽입 static CString m_ColorStrData[6]; static COLORREF m_ColorRefData[6]; static int CPenDls::m_PenStyleData[7]; CString CPenDlg::m_ColorStrData[6] = {"검정", "파랑", "노랑", "사이안","빨강","초록"}; COLORREF CPenDlg::m_ColorRefData[6] = { RGB(0,0,0) ,RGB(0,0,255) ,RGB(255,255,0), RGB(0,255,255), RGB(255,0,0) ,RGB(0,255,0) }; int CPenDlg::m_PenStyleData[7] = { PS_SOLID, PS_DASH, PS_DOT, PS_DASHDOT, PS_DASHDOTDOT, PS_NULL, PS_INSIDEFRAME}; 한번만 초기화 되게 static 사용.
OnInitDialog 함수 작성 17. OnInitDialog 함수에 다음 코드 삽입 BOOL CPenDlg::OnInitDialog() { CDialog::OnInitDialog(); // TODO: Add extra initialization here CListBox * pListBox = (CListBox*) GetDlgItem(IDC_COLOR_LIST); // 리스트 박스 객체 구하기 if( pListBox ) { for( int i=0; i<6; i++) pListBox->AddString(m_ColorStrData[i]); // 리스트 박스에 아이템 추가 } pListBox->SetCurSel(0); // 첫번째아이템 검정 선택 return TRUE; // return TRUE unless you set the focus to a control // EXCEPTION: OCX Property Pages should return FALSE }
펜 속성 삽입을 위한 코드 추가 18. GraphicView.h에 다음 변수 선언 class CGraphicView : public CView { // 중략 int m_PenWidth; int m_PenStyle; COLORREF m_ColorRef; // 중략 } 19. GraphicView.cpp에 다음 코드 삽입 CGraphicView::CGraphicView() { // TODO: add construction code here m_nCurDrawMode = LINE_MODE; m_PenWidth = 1; m_PenStyle = PS_SOLID; m_ColorRef = RGB(0,0,0); }
펜 속성 삽입을 위한 코드 추가 20. PenDlg.h에 추가 class CPenDlg : public CDialog { // 중략 static CString m_ColorStrData[6]; static COLORREF m_ColorRefData[6]; static int m_PenStyleData[7]; COLORREF m_SelectColor; // 선택한 색에 해당한느 RGB값 저장 int m_SelectPenStyle; // 선택한 펜의 스타일 저장 // 중략 }
펜 속성 다이얼로그 선택시의 작업 21. Classwizard를 이용하여 함수 생성 void CPenDlg::OnOK() { // TODO: Add extra validation here UpdateData(); //선택한 색을 지정한다. for(int i=0; i<6; i++) { if(m_ColorStrData[i] == m_ColorStr) m_SelectColor = m_ColorRefData[i]; } //선택한 스타일을 지정한다. m_SelectPenStyle = m_PenStyleData[m_Pen_Style]; CDialog::OnOK(); }
펜 속성 다이얼로그 선택시의 작업 22. GraphicView.cpp void CGraphicView::OnPenSelect() { // TODO: Add your command handler code here CPenDlg dlg; if(dlg.DoModal() == IDOK) { m_PenStyle = dlg.m_SelectPenStyle; m_PenWidth = dlg.m_PenWidth; m_ColorRef = dlg.m_SelectColor; } }
그리기 함수의 수정 23. GraphicView.cpp void CGraphicView::OnLButtonUp(UINT nFlags, CPoint point) { // TODO: Add your message handler code here and/or call default if( m_IsDrawing ) { CClientDC dc(this); CPen pen(m_PenStyle, m_PenWidth, m_ColorRef); dc.SelectObject(&pen); dc.MoveTo(m_StartPoint); dc.LineTo(point); m_IsDrawing = FALSE; } CView::OnLButtonUp(nFlags, point); }
