이 팁은 담비님(천리안 FREKBS)님이 1999년 04월 08일에 천리안 프로그래머포럼에 올리신 것입니다.
담비님으로부터는 전제하여 올리는 데 대해 허락을 받았습니다.
좋은 정보를 공유하도록 허락해주신 담비님께 감사드립니다.
───────────────────────────────────────
안녕하세요! 담비입니다.
출처 :
http://www.inprise.co.jp/tips/cbuilder/cb003/index.html
간단한 Image Viewer의 작성
─────────────
간단한 응용프로그램을 작성하는 순서에 따라 일반적인 C++ Builder에 의한
응용프로그램의 개발 Step의 예를 소개한다.
이 문서에는 Image Viewer를 작성한다. 이미지뷰어는 비트맵 데이타를 표시하는
프로그램이다. 비트맵은 등배(100%), 확대(200%), 축소(50%)의 표시가 가능하다.
비트맵 파일을 열기위해서 다이알로그 박스를 이용한다.
목차는 다음과 같다.
1. 폼의 설계
2. 메뉴의 설계
3. Common Dialog의 사용
4. Method의 추가
5. Event Handler의 Share
6. Application의 완성
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
1. 폼의 설계
C++ Builder의 어플리케이션의 개발은 폼의 설계로부터 시작한다. 폼상에 컴포넌트를
배치하고, 그것들의 프로퍼티를 설정하며, 이벤트 핸들러를 기술하는 것이
C++ Builder의 개발 스텝이 된다.
처음에는, 폼상에 ScrollBox를 배치한다. ScrollBox는 컴포넌트 팔레트의 Additional
페이지에 있다. 다음에는, 배치했던 ScrollBox의 위에 같은 페이지에 있는 Image
Component를 배치한다. 그리고, [Win95] 페이지에 있는 StatusBar를 폼위에
(ScrollBox의 위가 아닌 곳에)배치한다. 배치된 각각의 콤포넌트의 프로퍼티를,
오브젝트 인스펙터를 사용하여 다음을 설정한다.
ScrollBox1
Align = alClient
Image1
Left = 0
Top = 0
Strech = true
StatusBar1
SimplePanel = true
Align 프로퍼티는 컴포넌트의 레이아웃을 제어한다. StatusBar는 미리 Align
프로퍼티가 alBottom에 설정되어 있기 때문에 폼의 하단부에 배치된다.
ScrollBox의 Align 프로퍼티를 alClient로 설정하면, ScrollBox는 폼의 나머지
영역 전체에 표시된다.
See 명령을 사용하여 Figure1을 참조할것.
(그림이 커서 잘 보이지 않으면 다운받으세요)
2. 메뉴의 설계
메인 메뉴는, MainMenu 컴포넌트를 이용해 작성한다. [Standard] 페이지로부터
MainMenu 컴포넌트를 폼에 배치한다. MainMenu같은 컴포넌트는, 컴포넌트 자신이
실행시에는 표시되지 않는 비표시 컴포넌트이다. 비표시 컴포넌트는, 폼상의
어느곳에나 배치해도 상관없다.
See 명령을 사용하여 Figure2을 참조할것.
(그림이 커서 잘 보이지 않으면 다운받으세요)
배치된 MainMenu 콤포넌트를 더블클릭하면, 메뉴디자이너가 표시된다.
메뉴디자이너는 메뉴항목을 설계하기 위한 툴이다. 메뉴항목은, 메뉴디자이너에
표시된 플레이스 폴더를 사용해 작성한다.(그림에서 화살표시 된 부분)
메뉴항목의 설정을 행하는것은 오브젝트 인스펙터이다. 메뉴이디자이너에서 엔터를
누르면 오브젝트 인스펙터에 새로이 작성되는 메뉴항목의 프로퍼티가 표시된다.
메뉴항목의 표시 문자열은, Caption 프로퍼티에서 설정한다. 이 어플리케이션에서
작성하는 메인메뉴는 다음과 같은 계층이 된다.
┌─────┬──────┐
│&File │ &View │
└┬────┴┬─┬───┤
│&Open... │ │&50% │
│&Close │ │&100% │
│- │ │&200% │
│E&xit │ └───┘
└─────┘
&에 연결되는 문자는, accelerator를 표시한다. &F와 같이 기술한다면, F에 밑줄이
표시되고, F가 accelerator로서 기능을 수행한다. 또, Caption에 하이픈(-)을
설정하면, 단락짓기 선을 나타낼수 있다. View 메뉴의 3개 항목의, 라디오
항목으로서 기능을 시킨다. 이것들의 메뉴 항목의 RadioItem 프로프티를 true로
설정하고 GroupIndex를 1로 설정한다. 메뉴의 설계가 끝나면, 메뉴디자이너를
닫는다.
3. Common Dialog의 사용
비트맵 파일을 지정하는 다이얼로그 박스는, [Dialgs] 페이지의 OpenDialog 컴포넌트
를 이용한다. OpenDialog 컴포넌트는, commondialog를 캡슐화한 컴포넌트이다.
OpenDialog 컴포넌트를 폼상에 배치시키고, 오브젝트 인스펙터에서 Filter 프로퍼티
의 값의 옆에 표시되어있는 [...] 단추를 누른다. 표시된 [Filter Editor]다이얼로그
에서 다음의 항목을 입력한다.
Filter Name : 비트맵(*.bmp)
Filter : *.bmp
설계폼의 Open메뉴를 선택하면, Code Editor에 이벤트 핸들러가 표시된다.
여기에 다음과 같이 OpenDialog를 사용하는 코드를 기술한다.
void __fastcall TForm1::Open1Click(TObject *Sender)
{
if (OpenDialog1->Execute()){
Image1->Picture->LoadFromFile(OpenDialog1->FileName);
Caption = ExtractFileName(OpenDialog1->FileName);
}
}
Close메뉴와 Exit메뉴도 함께 작성한다. 각각의 메뉴를 선택하여, 다음의 코드를
기술한다.
// Close메뉴
void __fastcall TForm1::Close1Click(TObject *Sender)
{
Image1->Picture = NULL;
Caption = "";
}
// Exit메뉴
void __fastcall TForm1::Exit1Click(TObject *Sender)
{
if (Application->MessageBox(
"프로그램을 종료합니다. 좋습니까?",
"확인",
MB_ICONQUESTION : MB_YESNO) == ID_YES)
Close();
}
4. Method의 추가
Image 콤포넌트의 Stretch 프로퍼티를 true로 설정하였다면, 비트맵을 Image 컴포넌
트 맞춰 표시할 수 있다. 이것을 이용해 비트맵의 확대, 축소를 행한다.
Image 컴포넌트의 크기를, 비트맵의크기에 의해 변경하는 메소드를 작성하고,
이것을 이용해 확대, 축소 기능을 사용한다. 이 메소드를 폼의 멤버함수로 작성해본
다. 폼은 디폴트로 TForm1이라는 이름의 클래스이다. 이 클래스의 선언은 유닛의
헤더파일에 있다. 코드 에디터로 마우스의 오른쪽 단추를 눌로 표시되는 메뉴에서
[Open Source/Header File]메뉴를 선택하면 헤더파일이 표시된다. 여기서, TForm1의
클래스 선언의 Private 멤버로 메소드를 선언한다.
private: // User declarations
void __fastcall SetImageScale(int AScale);
계속해서, 메소드의 정의를 소스파일(디폴트로 Unit1.cpp)에 기술한다.
void __fastcall TForm1::SetImageScale(int AScale)
{
Image1->Width
=(Image1->Picture->Width * AScale) / 100;
Image1->Height
=(Image1->Picture->Height * AScale) / 100;
// 설정한 스케일을 스테이터스 바에 표시
StatusBar1->SimpleText
= IntToStr(AScale) + "%";
}
Open 메뉴의 OnClick 이벤트도 다음과 같이 바뀐다.
void __fastcall TForm1::Open1Click(TObject *Sender)
{
if (OpenDialog1->Execute()){
Image1->Picture->LoadFromFile(OpenDialog1->FileName);
Caption = ExtractFileName(OpenDialog1->FileName);
SetImageScale(100);
N1001->Checked = true;
}
}
N1001은, View메뉴를 100%로 나타낸다.(이것들의 이름은, 메뉴 항목을 작성했을 때
IDE가 자동적으로 작성한 이름이다. 알기 쉬운 이름으로 하기 위해서, 컴포넌트의
Name 프로퍼티를 변경하는 것도 할 수 있다.) 이 항목을 선택된 것으로 하기위해
Checked 프로퍼티를 true로 설정하고 있다.
5. Event Handler의 Share
이벤트 핸들러는 같은 형의 함수이면 복수의 컴포넌트의 이벤트에서 공유할 수 있다.
View 메뉴의 각 항목은, SetImageScale을 호출하기 때문에, 같은 처리가 가능하다.
이것들의 이벤트 핸들러를 공유해, 코딩을 간략화해본다. 먼저, 50% 메뉴를 선택해,
자동저긍로 생성된 N501Click의 이벤트 핸들러의 이름을 변경한다. 이름의 변경은,
오브젝트 인스펙터에서 한다. 오브젝트 인스펙터의 Events 페이지의 OnClick에
표시된 함수명을 변경하면, 코드 에디터에 자동으로 생성된 함수의 이름도 변경된다.
여기서는 ViewClick이라는 이름으로 한다. 이 함수는, SetImageScale을 호출하기
때문에, 각각의 메뉴상에서 인수로 지정하는 값이 다르다. 콤포넌트에 특정 값을
결과로 돌려주기 위해 Tag 프로퍼티를 사용하기로 한다. Tag 프로퍼티는 모든
콤퍼넌트에서 사용되며 특별히 사용되는것없는 정수의 프로퍼티이다. Tag 프포퍼티에
50을 설정하고 이 값을 사용하여 SetImageScale 함수를 호출한다. 선택된 메뉴항목을
특정하는것은, 이벤트 핸들러 함수의 Sender 인수이다.
Sender는 TObject형의 포인터이기때문에 이벤트를 발생시킨 콤포넌트의 포인터가
입력된다. TMenuItem의 포인터에로 Cast하여 선택된 TMenuItem 콤포넌트에 access
한다. ViewClick 함수는 다음과 같다.
void __fastcall TForm1::ViewClick(TObject *Sender)
{
SetImageScale(((TMenuItem *)Sender)->Tag);
((TMenuItem *)Sender)->Checked = true;
}
물론, 50%메뉴(N501)의 Tag 프로퍼티는, 50에 설정되어 있어야만 한다.
100%, 200% 메뉴도 동일하게 Tag 프로퍼티를 100, 200에 설정하며, ViewClick함수를
이벤트 핸들러에 설정한다. 이것들의 항목은, 오브젝트 인스펙터의 오브젝트
실렉터의 오른쪽에 있는 드랍다운 단추를 이용해 N1001, N2001를 선택해서 설정할
수 있다. 이벤트 핸들러의 선택은 동일하게 OnClick 이벤트의 옆에 표시되는
드랍다운 단추를 눌러 표시된 함수로부터 ViewClick을 선택하여 행한다.
6. Application의 완성
이상으로 이미지 뷰어의 기본적인 기능은 완성했다. [Run] 메뉴 또는 [F9]를 눌러
프로그램을 테스트해보기 바란다. 이 어클리케이션에는 몇가지 개선되어져야할
점이 있다. 그러나 C++ Builder에서 테스트가 가능한 어플리케이션을 간단하게
작성하여 인크리멘탈 링크에 의해 수정후의 어플리케이션의 구축을 고속으로
수행할 수 있다. C++ Builder에서는 어플리케이션을 테스트하면서, 문제점을
명확하게 하고 빠른 수정을 할 수 있다는것을 의미한다.
