読者です 読者をやめる 読者になる 読者になる

なかじまの開発ブログ

アプリ開発における備忘録などなど。

MENU

UITableViewにオリジナルのセルを表示する【Objective-C】

Interface BuilderにUITableViewとセル追加用のUIButtonを設置。

f:id:s_nakajima:20151126125459p:plain

ViewController.hにUITableViewをOutlet接続(名前:_tableView)し、UIButtonはAction接続(名前:addBtnTap)してください。


次にオリジナルのセルを作る準備。

CustomTableViewCellという名前で作成。

※Also create XIB file にチェックを入れること!!

f:id:s_nakajima:20151126125854p:plain

xibファイルを開き、セルを編集。

幅はUITableViewに合わせます。

適当にUILabelを設置。

f:id:s_nakajima:20151126130036p:plain

※右上のCustomにチェックを入れといたほうがいいかも?

設置したラベルをCustomTableViewCell.hにOutlet接続(名前:numLabel)


それではコードを記述していきませう。


『ViewController.h』

@interface ViewController : UIViewController <UITableViewDelegate, UITableViewDataSource> {
  NSMutableArray *objects;
}

@property (weak, nonatomic) IBOutlet UITableView *_tableView;

- (IBAction)addBtnTap:(id)sender;


『ViewController.m』

#import "CustomTableViewCell.h"
   ・
   ・
   ・
@ synthesize _tableView;

- (void)viewDidLoad {
  [super viewDidLoad];

  _tableView.dataSource = self;
  _tableView.delegate = self;

  objects = [[NSMutableArray alloc] init];

  // オリジナルのセルを_tableViewに設定
  UINib *nib = [UINib nibWithNibName:@"CustomTableViewCell" bundle:nil];
  [_tableView registerNib:nib forCellReuseIdentifire:@"Cell"];
}

- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath {
  return 44; // セルの高さ
}

- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section {
  return [objects count];
}

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
  CustomTableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:@"Cell" forIndexPath:indexPath];

  // オリジナルのセルのラベルを設定
  cell.numLabel.text = [NSString stringWithFormat:@"%d", (int)indexPath.row];

  return cell;
}

- (IBAction)addBtnTap:(id)sender {
  CustomTableViewCell *cell = [_tableView dequeueReusableCellWithIdentifier:@"Cell"];

  NSIndexPath *indexPath = [NSIndexPath indexPathForRow:objects.count inSection:0];
  NSArray *array = [NSArray arrayObjects:indexPath, nil];
  [objects addObject:cell];

  [_tableView insertRowsAtIndexPaths:array withRowAnimation:UITableViewRowAnimationTop];
}

追加ボタンを押すと、どんどんセルが追加されていきます。

f:id:s_nakajima:20151126150111p:plain