iPhoneアプリ用のログイン情報設定画面の作り方

2009-11-20

■[iPhone] iPhone アプリ用のログイン情報設定画面の作り方

注：本記事の方法ではパスワードが安全に保管されないようです。より安全に保管する方法を記載しました。（「iPhoneアプリ用のログイン情報設定画面の作り方（その２）」）。

TwitterやFacebook等のサービスと連携するiPhone アプリを作る場合、ユーザーにそれらのサービスへのログイン情報を設定してもらう必要が出てくる事が多い。そこでUITableViewを使ってユーザ名とパスワードを入力するログイン情報設定画面の作り方を以下に記載する。

実際に作るのは以下のような設定画面。"Grouped"スタイルのUITableViewを使用する。

上記の画面はUITableViewの各セルの中に、UILabelとUITextFieldを埋め込むという形になる。

例えばUITableViewを管理するコントローラクラスをUserInfoSettingControllerとすると以下のような形になる。

UITextFieldDelegateプロトコルを実装しているのは、ユーザがUITextFieldに入力したアクションを拾うため。

@interface UserInfoSettingController : UITableViewController <UITextFieldDelegate> {
}
@end

ポイントとしては以下。

ユーザのログイン情報はNSUserDefaultsを使用して保存する
UITextFieldDelegateプロトコルのtextFieldDidEndEditingでユーザの入力終了を検知する
ユーザが入力したUITextFieldがユーザ名かパスワードかはtagで判別する

@implementation UserInfoSettingController
    *snip*
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
    static NSString *CellIdentifier = @"Cell";
    
    UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier];
    if (cell == nil) {
        cell = [[[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:CellIdentifier] autorelease];
        cell.selectionStyle = UITableViewCellSelectionStyleNone;
		
        UILabel *label = [[[UILabel alloc] initWithFrame:CGRectMake(10, 6, 100, 30)] autorelease];
        label.font = [UIFont boldSystemFontOfSize:18];
        	
        UITextField *textField = [[[UITextField alloc] initWithFrame:CGRectMake(110, 10, 150, 30)] autorelease];
        textField.returnKeyType = UIReturnKeyDone; // ReturnキーをDoneに変える
        textField.delegate = self;
        textField.tag = [indexPath row];
        
        // ユーザが既に設定済みであればその情報を表示する
        NSUserDefaults *defaults = [NSUserDefaults standardUserDefaults];
        if ([indexPath row] == 0) {
            label.text = @"Username";
            textField.text = [defaults objectForKey:@"USERNAME"];
        } else if ([indexPath row] == 1) {
            label.text = @"Password";
            textField.secureTextEntry = YES;    // パスワードを画面に表示しないようにする
            textField.text = [defaults objectForKey:@"PASSWORD"];
        }
        	
        [cell.contentView addSubview:label];
        [cell.contentView addSubview:textField];
    }
    
    return cell;
}

- (void)textFieldDidEndEditing:(UITextField *)textField {
    // 入力された情報をセーブする
    NSUserDefaults *defaults = [NSUserDefaults standardUserDefaults];
    if (textField.tag == 0) {
        [defaults setObject:textField.text forKey:@"USERNAME"];
    } else if (textField.tag == 1) {
        [defaults setObject:textField.text forKey:@"PASSWORD"];
    }
}

- (BOOL)textFieldShouldReturn:(UITextField *)textField {
    // キーボードを隠す
    [textField resignFirstResponder];
    return YES;
}
    *snip*
@end