Exception Code.

iPhone、Macと読書が大好き。iPhone・Mac・書評を中心に好きな事を書いていました。今は『ほーくブログ』でブログを書いています。

[XCode]StoryBoardで作ったTableViewCellでオリジナルのセルを表示する方法

      2013/09/06

Xcode icon 375x375 75

TableView標準のセルではやりたいことが表現できなさそうな時には、TableViewCellを使用します。

しかし、StoryBoardで作ったTableViewCellを表示させる方法が結構わからなくて頭を抱えたのでシェアします。

StoryBoardでUIを作成

まずはStoryBoardを使ってUIを作成します。

僕はまっさらなUIViewControllerからViewを作りこんでいくのが好きなので、UIViewControllerにTableViewとTableViewCellを設置しました。

めんどくさい人はTableViewControllerから作ってもOKです。この例では3つのUILabelに文字を表示させたいので、こんな感じにします。

TableCustomCellTest xcodeproj  ViewController h 1

この時、ラベルはOutletに繋がないように注意してください。

Outletに繋いでしまうと、Uncategorized Compilation failed.なるエラーが発生します。

カスタムセルの実装方法

.hファイルのソースは以下になります。

TableCustomCellTest xcodeproj  ViewController h

 

ここまで準備ができたら、次はアトリビュートインスペクターから各LabelのTagを指定します。

すべて違うタグ番号で、0以外のものにしましょう。

これが今回のミソとなります。

TableCustomCellTest xcodeproj  MainStoryboard storyboard 3 1

 

次に処理を実装していきます。.mファイルで、指定したラベルのタグを読み込む→ラベルに文字を代入という流れを作ります。

TableCustomCellTest xcodeproj  ViewController m

 

これをビルドして実行すれば以下のようになるはずです。

IOSシミュレータ

これでセルをカスタムし放題ですね!

カスタムセルのソースコード

.hファイル

#import <UIKit/UIKit.h>

@interface ViewController : UIViewController <UITableViewDelegate,UITableViewDataSource> {
    IBOutlet UITableView *tblTest;
    IBOutlet UILabel *lbl1;
    IBOutlet UILabel *lbl2;
    IBOutlet UILabel *lbl3;
}

@end

.mファイル

#import "ViewController.h"

@interface ViewController ()

@end

@implementation ViewController

- (void)viewDidLoad
{
    [super viewDidLoad];
    tblTest.delegate = self;
    tblTest.dataSource = self;
    
}

-(NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section {
    return 3;
}

-(UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
    UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:@"CustomCell"];
    
    // 表示タグ
    lbl1 = (UILabel *)[cell viewWithTag:1];
    lbl2 = (UILabel *)[cell viewWithTag:2];
    lbl3 = (UILabel *)[cell viewWithTag:3];
    
    // ラベルに文字を指定
    lbl1.text = @"セルの";
    lbl2.text = @"カスタムに";
    lbl3.text = @"成功!";

    // 設定したセルを返す
    return cell;
}

- (void)viewDidUnload
{
    [super viewDidUnload];
    // Release any retained subviews of the main view.
}

- (BOOL)shouldAutorotateToInterfaceOrientation:(UIInterfaceOrientation)interfaceOrientation
{
    return (interfaceOrientation != UIInterfaceOrientationPortraitUpsideDown);
}

@end

 - 開発/プログラム

  関連記事

bloggerXcode-icon-375x375-75.png
[XCode]UINavigationBarにUIBarButtonItemでボタンを追加する方法

アプリ開発には欠かせないナビゲーションバー。 UINavigationBarにボ …

bloggerXcode-icon-375x375-75.png
[XCode]NSNotificationってなに?って人もとりあえずこれだけは知っておくべき

異なるクラス間で通知や変数を渡したりできる便利なNSNotificationです …

bloggerXcode-icon-375x375-75.png
[XCode]UISplitViewControllerからUIViewController SplitViewから1つのビューに遷移させる方法

昨日に引き続き。 [XCode4.4]UIViewController→UISp …

bloggerXcode-icon-375x375-75.png
開発したiOSアプリに不具合を見つけた時に緊急で審査期間を早くしてもらう方法

先日とうとう恐れていたことが起こりました。黒い怪物が部屋に出たとかそういうことで …

bloggerXcode-icon-375x375-75.png
[XCode]Title set but using a system Identifierなる警告が出たときの対処法

最近iPhoneアプリ開発を始めた@hawk_aです。 StoryBoardを使 …

bloggerXcode-icon-375x375-75.png
[XCode]親子関係じゃないView間で値の受け渡しをする方法

@hawk_a 親子じゃないときは、Appdelegateに変数書いてそれを参照 …

デスマーチを止める!システム開発の成功に「設計」と「テスト」は欠かせない

「デスマーチ」という、IT業界で名の知れた用語があります。 商品知識のない営業が …

bloggerXcode-icon-375x375-75.png
[XCode]追加してインポートしたヘッダーファイルが見つからないときの対処法3つ

XCodeでインポートの宣言をした際(import <hoge.h> …

無料でプライベートリポジトリをゲットできるgitBREAKがかなり使える

gitといえばおおよそgithub。しかしgithubは無料でパブリックリポジト …

bloggerXcode-icon-375x375-75.png
[XCode 4.3]Text Fieldの入力が終わったら次のText Fieldにソフトウェアキーボードでカーソルを移動させて最後にボタンを押す方法

XCodeをしこしこやっております。ほーく(@hawk_a)です。 プログラムの …