XCode2009.04.08 14:04

이번에는 저번 시간에 얘기 했던 Hello World를 Interface builder를 이용해서 View에 나타나도록 해 보겠습니다.


이름이 HelloWorld2 라는 프로젝트를 생성합니다.(생성 방법은 이전 강좌 참조)


프로젝트를 생성 하면 Resources 폴더에 MainWindow.xib 파일이 자동 생성 됩니다.

이 파일이 하는 역할이 실제 iPhone에서 화면에 보여지는 View들을 비주얼하게 작성할수 있는 파일입니다.

이 파일을 더블클릭 합니다



더블클릭하면 다음과 같은 Interface Builder창이 뜨게 됩니다.




혹시나 이중에 Window Identity 창이 안뜰 경우도 있는데 이때는 메뉴에서 [Tools]-[Inspector]를 선택하면 열리게 됩니다.


우선 윈도우에 View를 하나 추가 해야합니다. Library 화면 모양이 다를경우 하단에 속성을 보고 참고 하시면 됩니다.



위 그림과 같이 UIView를 선택하여 드래그 해서 윈도우에 넣습니다. 윈도우에 View를 추가 하면 아래와 같은 모양의 화면이 됩니다.



이어서 UILabel, UIButton을 아래 그림처럼 넣어 보세요.



그리고 이제 View에 Oulet, Action을 추가 해야합니다. 우선 View이름을 mainView로 수정하고 Oulet과 Action을 추가 해 봅시다. 아래 그림처럼 따라 하시면 됩니다.(우선 버튼이나 레이블이 아닌 바탕영역을 클릭하고, View Identity창에서 입력합니다)

View 클래스명은 mainView, Action에는 btnClick, Oulet에는 lblText, type에 UILabel




이제부터 중요합니다. XCode에서는 기존 윈도우 프로그래밍과 다르게 코드와 Window를 역어줄 무언가가 필요합니다.

중간 단계를 하는 녀석이 Oulet이며, Action도 위에서 정한 이름으로 매핑 시켜야 합니다. 매핑 방법이 좀 특이하니 화면을 잘 보시기 바랍니다.





View Connections 창에서 lblText의 우측 동그라미를 클릭후 창의 Label로 드래그 하여 연결시켜 줍니다.




버튼의 경우 연결하면 위 그림처럼 메뉴가 나오는데 Touch Down을 선택합니다. 그러면 아래와 같은 View Connections화면이 될것입니다.



그러면 실제 화면은 모두 만들었습니다. 이렇게 만든 화면에서 우리가 지정한 View Connections 부분을 클래스 파일로 저장을 시켜야 하는데, 윈도우에서 레이블이나 버튼이 아닌 흰 바탕을 클릭하고 [File]-[Write Class Files]를 선택하고 Save를 합니다.



이때 아래와 같이 현재 프로젝트에 소스를 추가 할것인지 묻는 창이 나타나는데, 체크박스에 체크하고 Add를 선택합니다.




그러면 아래와 같이 mainView.h, mainView.m 파일이 추가된 것을 볼수 있습니다.



이 파일의 위치를 아래 그림과 같이 Classes 폴더로 이동 시킵니다.


이제부터 코딩을 합니다. ㅡ..ㅡ;


윈도우 프로그래밍에 비해서 아주 번거로운 작업이 필요하죠? ^^;


mainView.h파일의 소스를 아래와 같이 바꿔 줍니다.




그리고 mainView.m을 아래와 같이 코딩합니다.






모두 되었습니다.


저장하고 실행을 하시면 아래 처럼 정상적으로 iPhone Simulator이 실행이 되고



버튼을 클릭 하면 아래와 같이 Hello World가 출력이 됩니다.



저작자 표시 비영리 동일 조건 변경 허락
신고
Posted by dotnetpower
TAG ,

티스토리 툴바