2009. 10. 13. 20:09

아이폰 어플 개발 첫걸음 - Hello World! 만들기


아이폰 에뮬레이터에 Hello World! 띄우기

프로그램 첫걸음 책을보면 항상 Hello World를 띄우는 내용이 있습니다.
오늘은 아이폰에 Hello World! 메세지를 띄워보는 프로그램을 만들어보겠습니다.

먼저 XCODE를 띄우고 상단 메뉴에서 New Project...를 선택합니다.
그럼 다음과 같은 화면이 나오고 생성할 종류를 선택해줍니다.
아이폰 어플을 만들때문에 1번표시처럼 iPhoneOS항목에 Application을 선택합니다.
그리고 오른쪽 뷰에서 2번 항목의 Window-based Application을 선택하고 3번 Choose...를 클릭합니다.



다음과 같이 프로젝트 이름을 입력하는 창이 나옵니다.
1번 항목에 프로젝트이름을 입력하고 2번 Save버튼을 클릭합니다.



프로젝트 이름을 입력하였다면 다음으로 프로젝트 관리자 창이 나타납니다.
여기에서 모든 작업이 거의 이루어 집니다.
Build an Go(망치그림)이 컴파일하고 에뮬레이터로 띄워주는 버튼입니다.



우선 리소스를 먼저 추가하고 코드부분을 추가하겠습니다.
MS의 툴에 익숙해져서인지 리소스 부분부터 만지게 되네요. 소스부분에 먼저 만들어 놓는것보다 리소스에
먼저 해놓으면 이미지를 보고 코드넣을때 더 찾기 편해서
인지도 모르겠습니다.
하지만 어느쪽은 먼저 하시던 이 프로젝트에서는 상관은 없습니다.
단지 뷰창을 한번더 왔다갔다 해야한다는거..


아마 MS툴에 익숙하셨던 분이시라면 컨트롤들을 추가하면 각각의 ID값이 있어서 이벤트 발생이라던지 컨트롤변수들을 수월하게 생성할수 있는데 여기에서는 코드부분과 리소스부분을 따로 작성해서 연결시켜주는 작업을 합니다.

그럼 컨트롤들을 윈도우에 그리기 위해서 *.XIB파일을 더블클릭합니다.
이게 리소스 파일입니다. *.H는 헤더파일. *.M은 소스 파일이라고 생각하시면 될거 같네요.



리소스파일을 더블클릭하면 다음과 같은 화면들이 출력됩니다.
왼쪽은 뷰를 관리하는 창이고 오른쪽은 ControlBox Library입니다.

Library의 각 항목을 클락하면 해당 컨트롤들이
리스트형식으로 나타납니다.

오른쪽에 있는 컨트롤 박스에서 추가하고자하는

컨트롤들을 Window상에 드래그 드롭하면 해당
리소스들이 입력될것입니다.

아래 그림과같이 아이폰에 표기될 빈 윈도우 화면에서
오른쪽 모양처럼 나오게 컨트롤들을 추가할것입니다.
추가방법은 위의 그림 오른쪽에 있는 ControlBox에서 추가하고 싶은 아이콘을 드래그하여 Window화면에
드롭하면 완료가 됩니다.
그럼 오른쪽 화면처럼 Label과 Text Field와 Button을 추가해서 넣습니다.



상단 풀다운 메뉴에서 Tool -> Attributes Inspector를 클릭하면 컨트롤들의 세부내용을 정의할수 있습니다.
VisualStudio등에서 보는 Resource Attributes상자하고 같다고 생각하시면 됩니다.
여기에서 각 컨트롤들의 크기와 모양, 텍스트등과 같은 속성들을 정의합니다.



컨트롤의 생성을 모두 끝냈다면 헤더파일에 컨트롤들의 정의를 넣어보겠습니다.
1번의 헤더파일을 클릭합니다. 여기서 더블클릭하면 Eidt창이 별도로 열립니다.


HelloWorldAppDelegate.h 파일에 다음을 추가합니다.
 #import <UIKit/UIKit.h>

@interface HelloWorldAppDelegate : NSObject <UIApplicationDelegate> {
    UIWindow *window;
  //========= 추가되는곳 ===========//
    IBOutlet UIButton *Button1;             // 변수 이름은 각자 마음에 드시는것으로 하면 됩니다.
    IBOutlet UILabel *Label01;        
    IBOutlet UITextField *Text01     
}

@property (nonatomic, retain) IBOutlet UIWindow *window;
   //======= 추가되어진 항목 ================//
    - (IBAction) OnButtonClick:(id) sender;  // 버튼이 눌렸을때의 이벤트를 지정합니다.
@end


이제 해당 이벤트의 액션을 1번항목의 파일을 클릭하여 소스파일에 등록해 보겠습니다.


HelloWorldAppDelegate.m 파일에 다음을 추가합니다.
- (void)dealloc {
    [window release];
    [super dealloc];
}

// 버튼에 대한 클릭이벤트의 액션을 추가한 부분입니다.
- (IBAction) OnButtonClick:(id) sender
{
    [Text01 resignFirstResponder];  // 가상키보드의 변화를위해 EditBox의 Focus를 잃게 합니다
      Label01.text = Text01.text;
}
@end


다 입력을 하셨으면 아까 작업해둔 리소스창으로 갑니다.
각 컨트롤을 연결하고 이벤트를 발생시키기 위한 작업을 합니다.

1번 항목을 마우스 우측버튼을 클릭해서 2번창을 띄웁니다.
그리고 3번내용처럼 각 컨트롤 및 이벤트를 파란색화살표처럼 끌어서 해당 컨트롤위에 놓습니다.
이렇게 같은 방법으로 아래 나열된 Button, Label, Text를 모두 연결을 해줍니다.

App Delegate창에서 Received Actions의 OnButtonClick이벤트는 버튼과 연결을 해주는데 연결을 하면
클릭이벤트를 선택하라는 메세지가
나타납니다. 여기서 Touch Up Inside나 Touch Down을 선택해줍니다.



모두 정상적으로 끝냈다면 다음 화면처럼 링크된 표시가 하얀색동그라미로 나타납니다.
이제 연결도 모두 완료가 됐으니 실질적인 프로그램은 모두 완료하였습니다.
이제 컴파일하고 정상적으로 프로그램이 돌아가는지 확인해보겠습니다.



Command(ALT)+R을 누르거나 관리자에서 망치버튼을 클릭하여 컴파일하고 시뮬레이터로 띄웁니다.
그럼 다음과 같은 아이폰이 나타나고 프로그램으로 만들었던 내용이 표시가 됩니다.
EditBox에 내용을 쓰고 "눌러주세요" 버튼을 클릭하면 라벨창에 EditBox내용이 표시가 됩니다.


이상으로 간단하게 나마 아이폰상에 메세지를 출력하는 프로그램을 만들어보았습니다.
아직 툴 자체가 익숙하지 않아서 그런지 모든게 어렵고 낯설기만 하네요


Posted by Messace
,