なんとなく

忘備録です

UITableViewでUITextFieldを使うメモ

よくあるログイン画面は、UITableView で作ってある(気がする)。
なので、それでやりたい。で、まず一歩目が、UITextFieldの配置。簡単そうだけど、意外とハマった。

やりたいのは、こんなの。UITableViewCell で UITextField を使う。入力フィールドがCellの真ん中に表示されるようにする。
   

TableViewCell の設定。
LoginViewController.m

#define TAG_USER_ID 1
#define TAG_PASSWORD 2

// テーブルの列にデータセット
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
    UILabel *nameLabel;
    UITextField *passTextFld;
    static NSString *CellIdentifier = @"Cell";
    
    UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier];
    
    if (cell == nil)
    {
        cell = [[UITableViewCell alloc] initWithFrame:CGRectZero reuseIdentifier:CellIdentifier];
        
        cell.accessoryType = UITableViewCellAccessoryNone;
        cell.selectionStyle = UITableViewCellSelectionStyleNone;
        UIFont *textFont = [UIFont systemFontOfSize:17.0];
        
        // ラベル
        nameLabel = [[UILabel alloc] initWithFrame:CGRectMake(20, 10, 130, 50)];
        nameLabel.backgroundColor = [UIColor clearColor];
        [nameLabel setFont:textFont];
        [cell.contentView addSubview:nameLabel];
        
        // テキスト
        passTextFld = [[UITextField alloc] initWithFrame:CGRectMake(130, 20, 140, 50)];
        passTextFld.delegate = self;
        [passTextFld setFont:textFont];
        passTextFld.autocapitalizationType = UITextAutocapitalizationTypeNone;
        passTextFld.clearButtonMode = UITextFieldViewModeWhileEditing;
        
        if (indexPath.row == 0)
        {
            [nameLabel setText:@"ユーザーID"];
            passTextFld.placeholder = @"ユーザーID";
            passTextFld.returnKeyType = UIReturnKeyNext;
            passTextFld.secureTextEntry = NO;
            passTextFld.tag = TAG_USER_ID;
        }
        else
        {
            [nameLabel setText:@"パスワード"];
            passTextFld.placeholder = @"パスワード";
            passTextFld.returnKeyType = UIReturnKeyDefault;
            passTextFld.secureTextEntry = YES;
            passTextFld.tag = TAG_PASSWORD;
        }
        [cell.contentView addSubview:passTextFld];
    }
    
    return cell;
}

高さとかはこんな感じ。

// セクション数
- (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView
{
    return 1;
}

//セクションのタイトルを設定
- (NSString *)tableView:(UITableView *)tableView titleForHeaderInSection:(NSInteger)section
{
    return nil;
}

// テーブルセルの高さを設定
- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath
{
    return 50.0f;
}

// tableのリスト件数
- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section
{
    return 2;
}

#pragma mark - TextField Check

// TextField Returnタップ
- (BOOL)textFieldShouldReturn:(UITextField *)textField
{
    // キーボード非表示
    [textField resignFirstResponder];
    
    return YES;
}

ヘッダーファイルにUITextFieldの操作を行うDelegateメソッドを定義しとく。
LoginViewController.h

#import <UIKit/UIKit.h>
#import <QuartzCore/QuartzCore.h>

@interface LoginViewController : UIViewController <UITextFieldDelegate>
{
}

結果は…
   

なんか変。orz
ラベル(ユーザーID)と入力テキストの配置、高さを同じにしてるのに、なんかズレる。

frameのCGRect指定で、雰囲気、設定してみた。→ダメ。
なら、frameの横位置で中央に設定するのは、幅/2 ってよくある。なら、高さも半分じゃ?てことで、
やってみた。→ダメ。orz そらそうよね、高さ50/2 でY軸の位置を指定したって…w

で、ふと思い出した。
InterfaceBuilder で、UITextField の設定を見ると、なんか、真ん中に表示する ってあったよなー と。
試しに見てみた。

UITextField

てことで、正解src☆

// テキスト
passTextFld = [[UITextField alloc] initWithFrame:CGRectMake(130.0f, 0.0f, 140.0f, 50.0f)];
passTextFld.delegate = self;
[passTextFld setFont:textFont];
passTextFld.keyboardType = UIKeyboardTypeASCIICapable;
// 高さ:Center
passTextFld.contentVerticalAlignment = UIControlContentVerticalAlignmentCenter;
passTextFld.autocapitalizationType = UITextAutocapitalizationTypeNone;

時間かかったけど、出来たので、オッケー♪

【参考サイト】
☆座標の指定が整数値でない場合 UIKit の描画(ビュー、画像、ボタン、その他いろいろ)がぼやける
http://d.hatena.ne.jp/KishikawaKatsumi/20100527/1274910461
☆UITextField horizontal and vertical alignment
http://cocoamatic.blogspot.jp/2011/01/uitextfield-horizontal-and-vertical.html