> iPhone-iPad > 키보드에 기능키를 추가하는 방법…

키보드에 기능키를 추가하는 방법…

키보드 상단에 기능키를 넣은 예제를 많이 볼 수 있습니다.
오늘은 이런 기능키를 넣는 예제를 간단하게 만들어 보려고 합니다. 이 샘플은 초보자를 위한 것이니 여러가지 스킬을 쓰지 않고 최대한 단순하게 만들 예정입니다.

기본 개념은 UITextView나 UITextField 클래스의 inputAccessoryView속성을 이용하여 개발자가 원하는 키보드 형태를 만드는 것입니다. 물론, View에 subView를 추가하는 것은 제약이 없으니, 우리가 원하는 어떤 형태의 뷰도 넣을 수 있습니다.

간단한 예제를 위해 KeyboardTest라는 View-based Application을 만듭니다.
KeyboardTestViewController.h을 열어 아래와 같이 수정합니다.

@interface KeyboardTestViewController : UIViewController {
    NSString *inputText;
    IBOutlet UITextField *inputField;
    IBOutlet UIButton *drawButton;
    IBOutlet UILabel *drawField;
}
@property(copy, readwrite) NSString *inputText;

- (IBAction)callDrawButton:(id)sender;
@end

inputText는 입력된 문구를 저장하는 문자열 인스턴스입니다.
그외에 우리가 문자열을 입력받을 inputField, 입력한 문자열에 대한 반영을 지시할 drawButton 마지막으로 입력한 문자열을 출력해 줄 drawField를 생성합니다.
IBOutlet의 경우 아래 그림과 같이 xib 파일도 수정해 줍니다.

다음에는 각 컨트롤을 File’s owner와 연결합니다.
처음으로 drawField와 맨위의 UILabel을 연결하고, inputField와 아래의 UITextField를 연결하고, 마지막으로 drawButton의 TouchUpInside와 callDrawButton을 연결합니다.

다음에는 뷰 로드 후에 작업을 진행합니다.
KeyboardTestViewController.m 파일의 -(void)viewDidLoad 함수의 주석을 풀고 아래와 같이 코딩합니다.

- (void)viewDidLoad
{
    [super viewDidLoad];
    
    /* 키보드에 확장될 부분을 위한 뷰를 생성합니다. */
    UIView *inputAccessaryView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 768, 50)];
    inputAccessaryView.backgroundColor = [UIColor darkGrayColor];
    
    /* 첫번째 기능을 위한 버튼을 생성하고 기능을 입력합니다. - 입력된 내용을 지우는 기능을 하는 버튼입니다. - */
    UIButton *cancelButton = [UIButton buttonWithType:UIButtonTypeRoundedRect];
    cancelButton.frame = CGRectMake(20, 7, 100, 37);
    [cancelButton setTitle:@"지우기" forState:UIControlStateNormal];
    [cancelButton setTitleColor:[UIColor blackColor] forState:UIControlStateNormal];
    [cancelButton addTarget:self action:@selector(cancel:) forControlEvents:UIControlEventTouchUpInside];

    /* 두번째 기능을 위한 버튼을 생성하고 기능을 입력합니다. - 미리 지정된 문구를 입력하는 기능을 하는 버튼입니다. - */ 
    UIButton *presetButton = [UIButton buttonWithType:UIButtonTypeRoundedRect];
    presetButton.frame = CGRectMake(137, 7, 100, 37);
    [presetButton setTitle:@"지정문구" forState:UIControlStateNormal];
    [presetButton setTitleColor:[UIColor blackColor] forState:UIControlStateNormal];
    [presetButton addTarget:self action:@selector(preset:) forControlEvents:UIControlEventTouchUpInside];

    /* 확장뷰에 커튼을 서브뷰로 등록합니다. - */
    [inputAccessaryView addSubview:presetButton];
    [inputAccessaryView addSubview:cancelButton];

    /* inputField에 확장뷰를 대입합니다. - */
    inputField.inputAccessoryView = inputAccessaryView;
}

우선 위와 같이 viewDidLoad를 수정하면 키보드에 확장된 뷰가 표시될 것입니다.
이제 기능을 붙여 봐야겠죠. 기능은 위 주석에도 표시한 것과 같이 간단하게 두가지입니다. 모든 내용을 지우는 것과 미리 지정된 내용으로 입력하는 것입니다.

기능을 위해 아래 함수를 구현합니다.

- (IBAction)callDrawButton:(id)sender {
    inputText = inputField.text;
    [self godrawField:sender];
}


- (void)godrawField:(id)sender {
    [drawField setText:inputText];
}

- (void)cancel:(id)sender {	
    inputText = @"";
    inputField.text = inputText;
    
    [self godrawField:sender];
}

- (void)preset:(id)sender {
    inputText = @"미리 정의된 문구를 넣도록 만들었습니다.";
    inputField.text = inputText;
    
    [self godrawField:sender];
}

dealloc을 통해 메모리 관리하는 것을 잊지 말고, 이제 실행을 해 보면 아래와 같이 실행이 됩니다.

  1. 댓글이 없습니다.
  1. No trackbacks yet.

답글 남기기

아래 항목을 채우거나 오른쪽 아이콘 중 하나를 클릭하여 로그 인 하세요:

WordPress.com 로고

WordPress.com의 계정을 사용하여 댓글을 남깁니다. 로그아웃 / 변경 )

Twitter 사진

Twitter의 계정을 사용하여 댓글을 남깁니다. 로그아웃 / 변경 )

Facebook 사진

Facebook의 계정을 사용하여 댓글을 남깁니다. 로그아웃 / 변경 )

Google+ photo

Google+의 계정을 사용하여 댓글을 남깁니다. 로그아웃 / 변경 )

%s에 연결하는 중

%d 블로거가 이것을 좋아합니다: