블로그 이미지
'무른모'란 부드럽다라는 뜻을 가진 '무르다'라는 말과 도구, 연장을 뜻하는 '연모'라는 순 우리말의 합성어로 소프트웨어를 말합니다. seanhigher

카테고리

분류 전체보기 (161)
Blog srart (16)
Dev Center (94)
Real Life (13)
Mac life (21)
Naver life (17)
Total662,015
Today10
Yesterday42

'아이폰 프로그래밍'에 해당되는 글 2건

  1. 2010.05.07 꼭 선택해야 한다면 액션시트, 다시한번 확인을 해주는 경고창.
  2. 2010.04.06 Hello world! app 프로젝트.
내가 가지고 있는 정보를 어디론가 보낸다던지, 가지고 있는 파일을 삭제한다는 것은 간단해 보일 수도 있는 작업이다. 하지만, 그 정보가 나의 모든 재산을 누군가가 가로챌 수 있는 정보라면? 내가 꼭 기억해야 할 사실을 삭제되어야 한다면? 매우 중요한 사항을 결정하게 될때, 그것을 다시한번 확인하게 해주는 것은 불의의 사태를 막는 하나의 방법으로 사용될 수 있다.



액션시트와 경고창.
액션시트와 경고창은 그 근본이 크게 다르지 않다. 사용자로부터 지금 하고자 하는 사실이 확실한지를 확인해주는 역할을 하게 된다. 사용자의 입력을 받는 경우라면 버튼을 사용해도 되는데, 궂이 액션시트라는 것과, 경고창이 왜 필요할까? 그것은 선택을 받아야 하는 정보가 어플리케이션을 진행하는데 있어서 꼭 피요한 정보이기 때문이다. 만약 화장실을 가야 하는데 사용자가 남자인지, 여자인지 알려주지 않았다면 어디로 들어가야 할찌 모르고 고민을 하게 된다. 이럴땐, 액션시트를 열어서 '남자' 또는 '여자' 둘중에 선택할 수 있도록 만들어야 한다. 그리고 경고창은 매우 중요한 결정을 할 때 사용될 수 있다. 내가 내년까지 기억해야 할 정보를 깜빡하고 삭제하려고 한다면, 경고창을 보여주면서 그 기록에 대해 다시한번 확인시켜준다.


레이아웃 디자인하기.
새로운 프로젝트를 'alermTest' 란 이름으로 생성한다. 종류를 View-based Application 으로 선택한다. Resources 폴더 안에 있는 'alerm-TestViewController.xib' 파일을 더블클릭하면 인터페이스 빌더를 실행할 수 있다. 레이아웃은 매우 간단하다. 화면의 가운데에 'action' 이라는 버튼을 한개 가져다 놓고, 이름을 'action' 으로 바꾸어주면 끝이다. 인터페이스 빌더를 실행한 후, 라이브러리에서 버튼을 드래그 해서 뷰 영역으로 옮겨놓은 일은 어렵지 않을 것이다.


그림1. 인터페이스 디자인


아웃렛과 액션을 설정하는 간편한 방법.
아웃렛과 액션을 생성하기 위해서는 Xcode 창에서 각각의 소스코드를 입력해서 작성해 주어야 인터페이스 빌더의 화면에 나오게 되었다. 이렇게 직접 소스코드를 입력하는 것이 쉬운 방법일 수도 있겠지만, 더욱더 간단하게 마우스 클릭만으로도 아웃렛과 액션을 생성하는 것이 가능하다.


그림2. 인터페이스 빌더에서 액선, 아웃렛 선언.

라이브러리 윈도우를 보면 맨 위에 Library, Classes, Media 의 세가지 탭이 있는데 이중에 Classes 항목을 선택한다. 항목을 선택하면 바로 아래에 라이브러리들이 나오게 되는데 우리가 사용하게 될것은 ViewController 이므로 alermTestViewController 항목을 선택하도록 한다. 가장 아래부분에는 선택된 항목의 정보가 간단하게 나오게 된다. 먼저 액션을 추가하기 위해 가장 오른쪽의 'Actions' 항목을 선택한다. 아래의 '+' 버튼을 클릭하여 새로운 액션을 추가, 이름을 변경해준다. 아웃렛을 추가하기 위해서는 'Outlets' 항목으로 이동해야 한다. 액션을 추가할때와 마찬가지로 '+' 버튼을 클릭하여 새로운 아웃렛을 추가하고 이름을 변경하여 준다. 이것으로 새로운 액션과 아웃렛의 생성이 간단하게 마무리 되었다.


액션, 아웃렛 이어주기.
액션과 아웃렛을 선언만 한다고 해서 사용이 가능한 것은 아니다. 이것을 사용할 수 있도록 서로 연결해 주는 작업이 필요하다.


그림3. 아웃렛 연결.

'View' 윈도우에서 버튼을 선택한후, 'Connections' 윈도우를 연다. 아래쪽을 보면 'Referencing Outlet' 항목의 'New Referencing Outlet' 을 선택하여 아웃렛을 추가하도록 한다. 오른쪽에 있는 원에 마우스 커서를 가져가면 십자가 모양으로 변하게 되고, 그것을 끌어다가 메인 위도우의 File's Owner 아이콘으로 가져다 놓는다. 그러면 위의 그림과 같이 아웃렛으로 선택하 수 있는 항목이 나타나게 되는데, 이미 만들어 놓았던 아웃렛인 'actionButton'을 선택하도록 한다.


그림4. 액션 연결하기.

액션을 연결하는 방법도 아웃렛을 연결하는 것과 거의 동일하다. 단지 항목을 'New Referencing Outlet' 항목이 아닌, 'Events' 항목에서 선택을 한다는 것이 다르다. 버튼을 클릭하는 것이기 때문에 'Touch Up inside' 의 항목을 끌어다 File's Owner 아이콘에 가져다 놓는다. 그리고 선택할 수 있는 액션 항목이 나타나는데, 이전에 선언한 'actionsh' 액션을 선택하도록 한다.


인터페이스 빌더로 소스파일 생성.
아웃렛과 액션을 선언하고 연결하는 일을 마무리 지었다. 하지만, 이상태에서는 다시 Xcode 로 돌아가도 소스코드에는 변화가 없다. Xcode 의 내용이 인터페이스에 반영되기 위해서는 소스코드를 저장하기만 하면 바로 적용이 가능했지만, 반대로 인터페이스 빌더의 내용을 소스코드에 반영하기 위해서는 인터페이스 빌더가 소스코드를 작성하는 과정이 필요하다.


그림5. Write Class Files 작업.

alermTestViewController가 선택된 상태에서 맨 왼족 아래의 메뉴(톱니바퀴 모양) 버튼을 클릭하면 위와 같은 메뉴가 나오는것을 볼 수 있다. 윗부분의 'Write Updated Class Files' 버튼을 클릭하여 변경된 사항을 소스코드에 적용할 수 있다. 파일은 'alermTestViewContoller.m' 파일을 선택하고 'Replace' 버튼을 선택하여 새로운 내용으로 대체하도록 한다. 이제 소스코드를 보면 변경된 내용이 적용되어 있을 것을 볼 수 있다.


액션시트 델리게이트.
델리게이트는 다양한 객체와 클래스, 메소드들을 묶어서 다양한 행동을 확장해 주는 역할을 한다. 또, 액션시트와 경고창을 사용하기 위해서는 컨트롤러 클래스가 델리게이트를 사용해야 하는데, 'UIActionSheetDelegate' 라는 프로토콜을 따르도록 만들어 주어야 한다. 델리게이트를 선언해주기 위해서는 클래스명 다음에 '<UIActionSheetDelegate>' 를 추가해 주기만 하면 된다.

@interface alermTestViewController : UIViewController
<UIActionSheetDelegate> {
    IBOutlet id actionButton;
}



액션시트 추가하기.
액션을 통해서 무언가 실행이 되게 하기 위해서는 액션메서드를 구현하는 과정이 필요하다. 또한 액션시트가 닫힐때 이루어지는  액션 메소드도 필요하다.

@implementation alermTestViewController
- (IBAction)actionsh:(id)sender {
    UIActionSheet *actionSheet = [[UIActionSheet alloc]
                                  initWithTitle: @"Are you sure?"
                                  delegate: self
                                  cancelButtonTitle: @"No way!"
                                  destructiveButtonTitle: @"Yes, I' sure!"
                                  otherButtonTitles: @"second", @"third", nil];
    [actionSheet showInView: self.view];
    [actionSheet release];
}

위의 소스틑 액션시트를 만들어 준다. 액션시트는 UIActionSheet 클래스로 선언되어진다. 액션시트가 가지게 되는 다양한 인자가 있는데 첫번째로 'initWithTitle' 는 액션시트의 제목의 내용을 나타낸다. delegate 항목은 시트에 있는 버튼이 눌려졌을때 알려주는 역할을 하게 된다. self를 선언함으로 자기 자신을 호출하게 된다. 액션시트에는 취소하는 항목을 기본적으로 가지게 되는데, 'cancelButtonTitle' 는 이것을 설명하는 문구를 정하게 된다. 이와 반대로 'destructiveButtonTitle' 는 실행 버튼을 생성해주며, 사용될 문구를 정할 수 있다. 마지막에 있는 'otherButtonTitles' 는 더 추가되는 버튼을 표현하게 되는데, 마지막을 의미하는 'nil' 이 나타나기 전까지 여려개를 늘릴 수 있다. 액션시트에 대한 정의를 마무리 짓고, 'actionSheet showInView' 를 통하여 액션시트가 화면에 보여지도록 한다. 버튼을 누르면 나타나는 액션시트를 구현한 것이다.


경고창 추가하기.
경고창은 액션시트와 거의 비슷하다. 인자의형태나, 구성 또한 비슷하다. 단지 'UIActionSheet' 대신에 'UIAlertView' 를 사용한다는 것이 다르다. 다음의 소스를 위의 소스 다음에 추가하도록 한다.

- (void)actionSheet: (UIActionSheet *)actionSheet didDismissWithButtonIndex: (NSInteger)buttonIndex {
    if (buttonIndex != [actionSheet cancelButtonIndex]) {
        NSString *msg = nil;
        msg = @"You went OK.";
        UIAlertView *alert = [[UIAlertView alloc]
                              initWithTitle: @"Something was done"
                              message: msg
                              delegate: self
                              cancelButtonTitle: @"Paw!"
                              otherButtonTitles: nil];
        [alert show];
        [alert release];
        [msg release];
    }
}

'actionSheet: didDismissWithButtonIndex' 는 UIActionSheetDelegate 메소드 중 하나이다. 위의 소스에서는 이 메소드를 컨트롤러 자체로 설정하였기 액션시트의 버튼이 눌려짐과 동시에 실행이 되는 메소드가 되는 셈이다. 액션시트의 다양한 버튼중에서 어떤 버튼이 눌려졌는지 알기 위해서는 buttionIndex 의 인자를 통해 접근이 가능하다. 이번에 작성한 소스에서는 취소 버튼 외에는 특별히 인자를 구별할 필요가 없다. 그렇기 때문에 '[actionSheet cancelButtonIndex]' 만 확인을 해주면 된다. 나머지 인자는 액션시트의 인자와 동일한 역할을 하게 된다. 'message' 는 제목 이외에 추가적인 설명을 더해준다. 경고창의 경우에는 'self.view' 대신에 'show' 만을 사용했는데, 이것은 액션시트의 경우는 부모뷰에 연결되어 있는 것이고, 경고창은 독립적으로 사용되기 때문이다.


시뮬레이션.
액션시트와 경고창에 대한 작업이 모두 완료되었다. 이제 'Build and Run' 버튼을 눌러서 실행을 해보도록 하자.


그림6. 시뮬레이션

가장 왼쪽에 있는 화면은 맨 처음 어플리케이션을 실행했을 경우에 나타나게 되는 화면이다. 가운데 있는 버튼을 누르면 가운데 화면과 같은 액션시트를 보게 될 것이다. 액션시트에서는 "No way!" 버튼만 취소 버튼으로 설정해 두었기 때문에 모두 동일한 결과를 보여주게 되는데, 'Yes I'm sure!', 'second', 'third' 버튼을 누를경우엔 가장 오른쪽의 화면과 같이 경고창을 보여주게 된다. 'No way!' 버튼을 눌렀을 경우에는 다시 원래의 화면으로 돌아가게 된다.

액션시트와 경고창은 사용자에게 어플리케이션을 사용하는데 있어서 조금의 강제성을 부여한다. 하지만, 이것은 조금더 원할한 상호작용을 위한 필수 요소라고 할 수 있다. 내가 말하지도 않은 사실을 상대방이 알고있을리 만무하다.

Posted by seanhigher

댓글을 달아 주세요

대부분의 프로그램을 시작하게 되면 가장 먼저 배우게 되는 것이 'Hello World!'라는 문자열을 화면에 출력하는 것이다. 아무것도 아닌것 같지만 이것은 굉장히 큰 의미를 지닌다. 세상을 향해 안녕이라고 외치는 것, 아이폰 프로그래밍 세계를 향해 안녕이라고 소리치는 것이다!


새 프로젝트 생성.
Xcode에서 새 프로젝트를 생성하기 위해서는 메뉴에서 'File' -> 'New project' 를 차례로 선택하면 된다. 이번에 만들게 될 Hello world! App은 복잡하지 않은 애플리케이션이므로 'View-based Application'으로 선택하여 프로젝트를 생성하도록 한다.


그림1. 새 프로젝트 생성

새로운 프로젝트를 만들겠다고 선택을 하면 위의 그림과 같이 프로젝트 명과 프로젝트를 저장할 폴더를 설정할 수 있다. 프로젝트 명은 자신이 원하는 것으로, 구분이 가능하도록 입력하고, 프로젝트가 저장될 폴더도 다른 데이터들과 구분된 폴더를 사용하는 것이 나중에 관리를 하기가 수월하다.


그림2. 프로젝트 창

프로젝트 명과 저장할 폴더를 지정하고 나면 위의 그림과 같은 프로젝트 창을 볼 수 있다. 사용자마다 위의 그림과 약간 다를 수도 있지만, 새로운 프로젝트를 생성했다면 새 프로젝트가 가지고 있는 파일들은 동일하기 때문에 걱정하지 말길 바란다. 'Hello world' 프로젝트의 가장 기본적인 기능은 텍스트를 화면에 출력하는 것이다. 코드를 입력하여 출력할 수도 있지만, 훨씬 더 수월한 인터페이스 빌더를 이용해서 출력할 수 도 있다. 인터페이스 빌더를 사용하기 위해서 왼쪽 'Group&Files'창에 있는  'Resource' -> 'Hello_worldViewController.xib'를 더블 클릭한다.


인터페이스 작성.
다음과 같은 인터페이스 빌더의 화면이 실행 될 것이다. 만약 이전에 Xcode를 사용하였다면 가장 마지막에 사용된 형태의 인터페이스 빌더의 모습이 나타날 것이다.


그림3. 인터페이스 빌더

가장 가운데 윗 부분에 있는 창이 메인 창이다. 안에 있는 아이콘들이 xib 파일이 포함하고 있는 객체들을 가리킨다. 아래에 있는 view 창은 실제로 화면에 보여지는 모습을 그대로 재현해 내는 객체이다. 이 화면을 통해서 아이폰에 어떻게 표현될 것인가를 예상 할 수 있다. 왼쪽에 있는 Library 윈도우는 화면에 표현할 수 있는 객체 라이브러리를 나타낸다. 라벨, 버튼, 메뉴등 기본적으로 필요한 도구들을 가지고 있다. 오른쪽에 있는 Attributes 윈도우는 각 객체의 속성을 제어할 수 있다. 이 두개의 윈도우를 통해서 코딩없이 다양한 디자인이 가능하다. 'Hello world!' 문자열을 화면에 출력하기 위해서는 텍스트를 표현하기 위한 'Label' 객체가 필요하다.


그림4. 라벨 객체 추가

왼쪽에 있는 Library 윈도우에서 'Label'을 선택하여 View 윈도우로 끌어다 놓으면 라벨이 추가되는 것을 볼 수 있다. 기본 이름이 'Label'로 되어있기 때문에 더블클릭하여 'Hellow world!'로 문자열을 새로 입력한다. 이제 화면에 'Hello world!' 문자열을 출력하기 위한 준비 작업은 다 마쳤다. 이제 실행하기만 하면 된다.


시뮬레이터로 실행하기.
인터페이스 빌더에서 지금까지 작업한 파일을 저장한다. 인터페이스 빌더는 인터페이스에 관한 메뉴만을 가지고 있기 때문에 실행을 하기 위해서는 Xcode 프로젝트 창에서 실행을 해야만 한다. Xcode 창에서 'Build' -> 'Build and Run' 메뉴를 실행한다.

 
그림5. Hello world! 프로젝트 시뮬레이션

잠시동안 프로젝트가 빌드되고, 위와 같은 깔끔한 화면에 'Hello world!'가 출력되는 시뮬레이션을 볼 수 있을 것이다. 비록 매우 간단한 프로젝트지만, 이제 아이폰 프로그래밍에 한발을 내딛게 된 것이다.

Posted by seanhigher

댓글을 달아 주세요

최근에 달린 댓글

글 보관함