iPhone 개발을 위해서는 개발툴인 XCode(Visual Studio와 같은개념)iPhone SDK3.0(.Net Compact Frame work와 같은개념)이상을 설치해야한다.

물론 운영체제인 OSX10.5.7 이상버젼이 설치되어 있어야함은 말할 필요도 없다. 스티브 잡스 아저씨가 이거 외에는 절대 개발 안된다고 했다.

 

설치는 이미 완료되었다는 가정하에 진행하겠다. (사실 설치는 컴맹이 아니면 설치파일 클릭하고 다음,다음 누르다보면 완료된다.)

 

설치된 XCode를 실행해보자. 저자도 사실 처음 설치하고 어디있는지 좀 헤매었다. 윈도우 탐색기와 같은 Finder를 실행시킨다.(아래 이미지 아이콘)

[그림1]

 

XCode실행 파일의 위치는 Developer>Applications 에 위치하고 있다.

 

[그림2]

[그림3]

[그림4]

[그림4]XCode 파일을 더블클릭한다.

실행이 되면 아래 네모부분처럼 하단에 아이콘이 생성된다. 파란 종이위헤 망치모양(장도리?) 아이콘이다.

 

[그림5]

그리고 상단의 메뉴역시 XCode메뉴로 변경이된다.

[그림6]

[Welcom To XCode]라고 적힌 프로젝트 시작화면이 뜨는데 그냥 닫기를 누른다.

 

[File]메뉴의 [New Project…]를 클릭한다.

[그림7]

[그림8]

 

[그림8] 에서 처럼 [View-based Application]을 선택하고 [Choose…]를 클릭한다.

 

[그림9] 에서 처럼 프로젝트명을 입력합니다. 저자는 GoMediHomePage 라는 명칭을 입력했습니다.

[그림9]

다음과 같이 XCode가 파일들을 생성하게됩니다.

[그림10]

왼쪽 TreeGroup&Files 메니져입니다. 오른쪽 상단은 왼쪽에 선택된 영역에 속하는 파일들이 보여지고 그 하단은 파일의 상세 내용 또는 소스코드가 보여지게 됩니다.

[그림10]은 현재 왼쪽 Tree의 최상단이 선택되어 있으므로 프로젝트내의 모든 파일들이 표시된 상태입니다.

[그림11]

[GoMediHomePageViewController.xib] 파일을 더블 클릭합니다. 이파일은 화면 디자인을 하는 파일이라고 생각하시면 됩니다.

[그림12]

 

[그림12]과 같이 인터페이스 빌더가 실행이됩니다. 왼쪽창은 문서윈도우 이며 오른쪽 빈 창은 뷰 디자인 윈도우 입니다.

 

[그림13]

상단 메뉴의 [Tools][Library][Inspector]를 실행합니다. 단축키는 [윈도우키+Shift+L] [윈도우키+Shift+I] 입니다.

[그림14]

아래와 같이 창이 열립니다. 인스펙터창은 Visual Studio 의 속성창과 비슷하고 Library창은 도구상자와 비슷한 개념입니다.

 

[그림15]

라이브러리 창에서 [Label] [Round Rect Button] [UIImageView] 를 각각 끌어다가 View윈도우에 놓습니다.

결과는 [그림16] 과 같습니다.

[그림16]

버튼을 클릭하고 인스펙터 창에서 [Title]부분을 다음과 같이 수정합니다. 그리고 버튼 크기도 적당히 드래그하여 늘여줍니다.

[그림17]

[그림18]

라벨 또한 Text 수정합니다.

 

UIImageView 에 추가할 이미지를 리소스에 추가합니다. 웹에서 적당한 이미지를 다운로드받고 Finder에서 끌어다가 Resources폴더에 드래그해서 떨구어줍니다.

 

[그림19]

 

[그림20]

카피할것인지 물어봅니다. [Add]를 클릭합니다.

 

다시 왼쪽창에서 Tree 최상단을 클릭하고 [GoMediHomePageViewController.xib] 파일을 더블 클릭합니다.

다시 View윈도우의 [UIImageView]를 클릭하고 인스펙터 창의 Image 부분의 콤보박스를 클릭하면 조금전에 추가한 이미지의 파일명이 뜨게 됩니다. 이것을 선택하면 해당 이미지가 이미지뷰에 뜨게 됩니다. 역시 적당한 크기와 위치로 드래그해 줍니다.

 

[그림21]

[그림22]

[그림23]

[그림24]

문서윈도우에서 닫기 버튼을 클릭합니다.(빨강,주황,초록 버튼 중 빨간 동그라미 부분) [그림24]와 같이 저장여부를 물어옵니다. [Save]를 클릭해서 저장해줍니다.

[그림25]

[그림25] 의 -(IBAction) onGoToMediexpert; 부분을 헤더파일에 추가합니다. 홈페이지로 이동하는 버튼을 클릭했을 때 쓰일 이벤트를 헤더파일에 선언하는 것입니다. 그리고 저장합니다.

[그림26]

반드시 [그림26]과 같이 저장을 해야 다음단계에서 이벤트가 뜨게됩니다. (단축키는 [윈도우키+S]입니다.)

그다음 다시 [GoMediHomePageViewController.xib] 파일을 더블 클릭합니다.

그리고 [그림27]과 같이 문서윈도우의 [File’s Owner]에서 마우스 오른쪽 버튼을 클릭하면 방금전에 헤더파일에 선언했던 [onGoToMediexpert] 이벤트가 뜨게 됩니다.

[그림27]

[그림28]

이벤트의 오른쪽에 빈동그라미 부분을 드래그해서 이벤트가 발생할 객체인 [메디엑스퍼트 홈페이지] 버튼으로 드래그해서 놓습니다. 그럼 이벤트와 버튼이 연결되는것입니다. 이때 버튼에는 이벤트가 여러 개 있는데 이중에서 버튼이 눌러졌다가 놓일 때 발생하는 이벤트인 [Touch Up Inside]를 선택해줍니다.

[그림29]

[그림30]

이 같은 과정의 결과로 [그림31]과 같이 이벤트와 버튼이 연결된 것을 볼 수 있습니다.

굉장히 직관적인 과정이죠? 검은색의 상자를 왼쪽상단 X 버튼을 눌러 닫습니다.

 

[그림31]

마찬가지로 문서윈도우 닫기 버튼을 클릭하고 저장을 합니다.

[그림32]

[GoMediHomePageViewController.m] 파일의 제일 마지막 부분에 [그림32]과 같이 코딩을 합니다.

@end윗 부분의 -(IBAction) 부분..

이제 완성되었습니다. 컴파일하고 실행시켜보겠습니다.

 

[그림33]

[그림34]

[그림33]를 클릭하고 [그림34]처럼 모두 저장을 클릭합니다.

[그림35]

컴파일이 오류없이 정상적으로 완료되면 XCode 창 오른쪽 하단에 Suddeeded라는 표시가 뜨게되고 아이폰 에뮬레이터가 뜨게됩니다.

 

[그림36]

버튼을 클릭하면 브라우져를 통해 홈페이지가 뜨게 됩니다. 이때 [Alt]키와 마우스 드래그를 통해 그 유명한 멀티터치로 풀브라우징 되는 홈페이지를 확대 또는 축소해서 보실수 있습니다.

[그림37]

 

종료는 상단의 에뮬레이터 메뉴에서 종료를 하셔도 되고 하단의 실행중인 아이콘에서 마우스 오른쪽 버튼을 클릭해서 [그림37]과 같이 종료하여도 됩니다.

 

문서의 내용이 다소 긴듯하지만 차근차근 반복하시다보면 쉽게 익히실 수 있을듯합니다.

이상  Goldrush였습니다.

 

감사합니다.

 

[인용시 출처를 밝혀주세요.]

 



출처 : http://blog.naver.com/PostView.nhn?blogId=goldrushing&logNo=130085734179
Posted by 오늘마감