入力したテキストをTwitterで検索して結果をカスタムテーブルで表示

今回はカスタムテーブルの作り方についてまとめました。
取得したTweetの整形の仕方がイマイチ分かっていなかったので、「10日で覚えるiPhoneアプリ開発入門教室」を参考にしています。

Table View Contorollerを使わないテーブルの作り方になります。
Table View Contorollerを使うとカスタマイズの手間がいらず楽なのですが、サイズを変えたかったりラベルの位置を変更したいときは非常に不便です。
そこで専用のテーブルを作って配置してしまおう!というのが今回の流れです。
TextFieldに検索ワードを入力するとその言葉でTwitter検索した結果がテーブルに表示されます。
ちなみにテーブルの影は画像です。どうやらコードで書くとなると新しくViewを追加してごにょごにょしないといけないせいか、少し重くなるようです。

注意点としては、Storyboardを使用した場合、TableViewの中に配置したラベルや画像などはいつものようにひも付けをしないでタグで識別します。ひも付けをするとエラーが出ます。

カスタムテーブルの作り方は以下になります。

1.Single View -Applicationで新規プロジェクトを作る。「TARGETS」をクリック、Linked Frameworks and Librariesの+をクリックして「QuartzCore.framework」を追加する
2.Storyboardをクリックし、Navigation Controllerを持って行く。Navigation Controllerにくっついているテーブルを消す。Navigation Controllerを右クリックして元からあったViewControllerに結びつける。このときいちばん上のRelationshipを選ぶ
3.Storyboardにそれぞれパーツを設置、ViewControllerのTableViewとTextFieldのみひもづけて、後はパーツを置くだけにする
4.この例だと「tweetSearchList」フォルダを右クリックしてNewFile..を選ぶ。Objective-C class→Classに好きな名前を入れてSub classをUIViewControllerにして、新しくUIViewControllerを作る
5.Storyboardに新しくViewControllerを持って行く。Table View Cellを右クリックして新しく作ったViewControllerと結びつける。そのときpushを選ぶ
6.Storyboardで新しく作ったViewControllerをクリックし、Classを新しく作ったViewControllerの名前にする
7.Table View Cellをクリックし、Identiferに「tweetCell」と入力する
8.コードを追加
9.一度Runした後、ひとつひとつのツイートの文字数を見てTable ViewやTable View CellのRow heightを調整する

サンプルは以下です。
GitHub - prince9/tweetSearchList: (Sorry,Japanese only)入力したテキストでTwitter検索を行い、カスタムテーブルに表示します。日本語が対象ですが英語もOKです
今回は長いのと一部本を参考にしたので、カスタムテーブルとTwitterで日本語検索を可能にする設定のところのみを載せておきます。

・カスタムテーブル

- (void)viewDidLoad
{
    [super viewDidLoad];
	// Do any additional setup after loading the view, typically from a nib.
...
    
    //TableViewの角を丸くする
    //CALayerでテーブルに影をつけても良いんですが、重いっぽいので今回はUIImageで影をつけたPNGファイルを読み込ませています
    CALayer* layer = self.myTable.layer;
//これは必ずYES
    layer.masksToBounds = YES;
//角の大きさを設定
    layer.cornerRadius = 5.0;
    
    //TableViewに背景画像を設定
    UIImage* image = [UIImage imageNamed:@"tableviewback.png"];
	UIImageView* imageView = [[UIImageView alloc] initWithImage:image];
	[self.myTable setBackgroundView:imageView];
    
    
}

・日本語検索をOKにする

//以下、URLを指定→そこにアクセスする設定をする→アクセスする
    //検索語を指定する。日本語を検索する場合は、UTF-8でURLエンコードした文字列を渡す
    //英語で入力しても大丈夫
    //ここをTextFieldで入力した言葉ではなく指定したい場合はNSString *searchString = @"ほげほげ";にする
    NSString *searchString = myField.text;
    //UTF-8でURLエンコード
    NSString* encodStr = [searchString stringByAddingPercentEscapesUsingEncoding:NSUTF8StringEncoding];
    //URLを指定
	NSString *urlString = [NSString stringWithFormat:@"http://search.twitter.com/search.json?q=%@",
                           encodStr];
    
    //URLWithStringでNSURLのインスタンスを生成
    NSURL *url = [NSURL URLWithString:urlString];
    
...

・セルの背景画像を表示

 //セルに背景画像を設定
    /*
     UIImage *cellback = [UIImage imageNamed:@"cellback.png"];
     UIImageView *backgroundView = [[UIImageView alloc] initWithImage:cellback];
     cell.backgroundView = backgroundView;
     */
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
    //セルのIdentiferを指定
    static NSString *cellID = @"tweetCell";
    //UITableViewCellクラスのインスタンスを取得
    UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:cellID];
    
    //セルの背景を設定
    UIImage *cellback = [UIImage imageNamed:@"fukidashimini.png"];
    UIImageView *backgroundView = [[UIImageView alloc] initWithImage:cellback];
    cell.backgroundView = backgroundView;