Color Picker (SDI에서 Dialog 로 나타낸 것)

 

 위의 그림은  컬러 선택을 위한 셀프 드로잉 컨트롤입니다. CodeGuru에도 있구, 비주얼 C++ 6 완벽가이드 책에도 나와있더군요. 거긴 다이얼로그 베이스로 만들어져 있었는데 그걸 SDI에서 모달 다이얼로그 박스로 출력되게 만들어 보았습니다. 뭐 같은 거니까 바꾸는 건 간단하지요..

 1. 우선 소스를 받습니다.   예제 소스도 있어요.. ColorPicker.h / cpp, ColorPopup.h / cpp  이렇게 4개의 파일이 들어있습니다. 그리고는 복사해 넣은 다음에 프로젝트에 추가...

2. 컬러 선택을 할 다이얼로그를 하나 만듭니다. 다이얼로그 ID 는 IDD_COLORDLG 로 하기로 하죠.

3. 위의 그림처럼 다이얼로그 위에다 컨트롤들을 배치합니다.
 간단히 설명하자면 우선 제일 위에 Static Text 컨트롤이 위치하고, 그 오른쪽에 셀프 드로잉 컨트롤로 둔갑할 버튼 컨트롤을 하나 둡니다. 보이기엔 콤보박스 비스무레하게 보이지만 버튼이 둔갑한 겁니다. 아래를 Group Box로 감싸고 그 안 왼쪽에는 picture 컨트롤을 놓고, 오른쪽에는 RGB를 표시할 Static Text와 Edit Box를 3개씩 놓습니다.

 Button Control - ID : IDC_COLORPICK   캡션 : 컬러 선택
 Group Box       - ID : IDC_STATIC          캡션 : 선택된 컬러
 Picture Control - ID : IDC_FRAME
 Static Control   - ID : IDC_STATIC          캡션 : RED :
                          ID : IDC_STATIC          캡션 : GREEN:
                          ID : IDC_STATIC          캡션 : BLUE:
 Edit Box          - ID : IDC_RED ,  IDC_GREEN ,   IDC_BLUE              

4. 컨트롤들을 다 올려놓았으면 이 다이얼로그 박스에 연결될 클래스를 만듭니다. 클래스 이름은 CColorPickerDlg 라고 하죠. 그리고는 다이얼로그 헤더파일의 위에  #include "ColorPicker.h"  를 써넣어 줍니다.

5. 클래스 위저드를 사용해서 컨트롤들을 변수와 연결시켜 줍니다. Edit Box들은 각각 intm_nRed, m_nGreen, m_nBlue 로 정해준 후, 최소값 0, 최대값 255로 정해줍니다. 그런 다음 버튼 컨트롤은 우선 CButton 형으로 하고, m_ctrlColorPicker 라는 변수이름을 주죠. 그리고는 ColorPickerDlg.h 파일을 열어

로 바꾸어 줍니다. 여기까지만 하고 컴파일하면 컬러 선택 컨트롤을 볼 수 있습니다. 물론 CView 같은 다른 클래스에서 이 다이얼로그를 DoModal() 같은 함수를 써서 불러 주어야만 하겠지요..

6. 컨트롤 초기화

  컬러 선택 컨트롤에는 SetDefaultText, SetCustomText 라는 함수가 있는데, 이건 컬러 선택 컨트롤의 아래위로 출력될 문자열을 지정할 수 있습니다.

 클래스 위저드에서 CColorPickerDlg 클래스의 WM_INITDIALOG 메시지를 오버라이딩 합니다.

7. 컬러 선택 컨트롤에 입력된 값을 얻어내기 위해 CColorPickerDlg 클래스에 COLORREFm_crColor 변수를 선언합니다.

8. ColorPickerDlg 함수의 다음 부분을 고칩니다. 컬러 값 초기화와 컬러 선택 콘트롤과의 연결을 위한 코드입니다. DDX_ColorPicker 함수는 MFC에서 지원하는 함수가 아니고, 따로 만들어준 함수입니다.

9. 컬러 선택 컨트롤은 상황에 따라 다음과 같은 통지 메시지를 발생시킵니다.

 여기서는 컬러 선택 컨트롤과 에디트 박스의 값이 바뀌었을 때 서로서로 값을 바꾸어 주기 위해 통지 메시지를 처리합니다. 에디트 박스의 통지메시지는 클래스 위저드에서 처리할 수 있지만 컬러 선택 컨트롤은 클래스 위저드에서 지원하지 않으므로 직접 코드를 써 주어야 합니다.

 클래스 위저드를 열어 에디트 박스 3개(IDC_RED, IDC_GREEN, IDC_BLUE)의 EN_CHANGE 메시지를 처리하고, 컬러 선택 컨트롤을 처리한 코드는 우선 다음과 같습니다.

 이 코드를 다음과 같이 고칩니다.

10. 직접 추가한 ON_MESSAGE의 핸들러를 CColorPickerDlg 클래스의 멤버함수처럼 추가합니다. -->  LRESULT OnSelChange(WPARAM wParam, LPARAM lParam)

 OnChangeEdit의 핸들러도 입력하구요.

 그리고 CColorPickerDlg 클래스에 UpdateSelColor() 함수를 추가하고, 클래스 위저드를 사용하여 WM_PAINT 메시지를 오버라이딩합니다. 코드는 다음과 같습니다.

11. 뷰에서 DoModal 함수를 불러서 실행시키거나 하며 잘 뜰 겁니다. 필요하다면 여기서 CColorPicker, CCoorPopup, CColorPickerDlg 클래스를 갤러리에 추가해 넣고 필요할 때마다 추가해 써도 편하겠죠..