iPhoneプログラミング: Table Viewを使ってデータを表示する

Table Viewの行にテキスト、イメージ、ディスクロージャボタンを表示

行が選択された場合に別のビューに移動する

　Table Viewでユーザーが行を選択した場合に非常によくある動作の1つは、選択された行の詳細を別のビューウィンドウに表示することです。そのためには、新しいXIBファイルとそれに対応するビューコントローラをプロジェクトに追加します。XcodeでClassesフォルダを右クリックし、［Add］→［New File］を選択します。

　［Cocoa Touch Class］カテゴリの下で、UIViewControllerサブクラステンプレートを選択し、［With XIB for user interface］オプションが選択されていることを確認して（図10参照）、［Next］をクリックします。

図10　新規ビューの追加：新規UIViewControllerサブクラス項目をプロジェクトに追加する画面

　新規クラスにDetailsViewController.mという名前を付け、［Finish］をクリックします。これで、図11のようにXcodeに3つのファイルが追加されます。

図11　新規ビューのファイル：新規ビューを作成すると、サンプルプロジェクトに3つのファイルが追加される

　DetailsViewController.xibファイルをダブルクリックしてInterface Builderで編集します。［View］ウィンドウに［Label］ビューをドラッグ＆ドロップします（図12参照）。

図12　ラベルの付いた新規ビュー：図のように、［View］ウィンドウに［Label］ビューを追加してサイズを変更

　DetailsViewController.hファイルに次のステートメントを入力します。

#import <UIKit/UIKit.h>
@interface DetailsViewController : UIViewController {
    IBOutlet UILabel *label;
    NSString *textSelected;
}
@property (nonatomic, retain) UILabel *label;
@property (nonatomic, retain) NSString *textSelected;
-(id) initWithTextSelected:(NSString *) text;
@end

　次に、DetailsViewController.mファイルに次のステートメントを入力します。

#import "DetailsViewController.h"
@implementation DetailsViewController
@synthesize label;
@synthesize textSelected;
-(id) initWithTextSelected:(NSString *) text {
    self.textSelected = text;
    [label setText:[self textSelected]];
    return self;
}
- (void)viewDidLoad {
    [label setText:[self textSelected]];
    self.title = @"Movie Details";
    [super viewDidLoad];
}
- (void)dealloc {
    [textSelected release];
    [label release];
    [super dealloc];
}
@end

　Xcodeでプロジェクトを保存します。Interface Builderに戻り、controlキーを押しながら［File's Owner］アイテムをクリックして、［Label］ビューにドラッグします（図13参照）。ラベルを選択します。

図13　接続の作成：ラベルアウトレットを［Label］ビューに接続

　Xcodeに戻り、RootViewController.hファイルに次のステートメントを追加します。

#import "DetailsViewController.h"
@interface RootViewController : UITableViewController {
    DetailsViewController *detailsViewController;
}
@property (nonatomic, retain) 
   DetailsViewController *detailsViewController;
@end

　最後に、リスト2のコードをRootViewController.mファイルに追加します。

リスト3　RootViewController.h（編集後）

#import "RootViewController.h"

@implementation RootViewController

@synthesize detailsViewController;

NSMutableArray *listOfStates;

- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:
(NSIndexPath *)indexPath {
    
    NSString *stateSelected = [listOfStates objectAtIndex:
       [indexPath row]];
    NSString *msg = [[NSString alloc] initWithFormat:
    @"You have selected %@", stateSelected];
        
    //---Navigate to the details view---
    if (self.detailsViewController == nil)
    {        
        DetailsViewController *d = [[DetailsViewController alloc] 
            initWithNibName:@"DetailsViewController" 
            bundle:[NSBundle mainBundle]];
        
        self.detailsViewController = d;
        [d release];
    }    

    //---set the state selected in the method of the 
    // DetailsViewController---//
    [self.detailsViewController initWithTextSelected:msg];
    [self.navigationController pushViewController:
       self.detailsViewController 
    animated:YES];
    
    [msg release];    
}

- (void)viewDidLoad {
    //---initialize the array---
    listOfStates = [[NSMutableArray alloc] init];
    
    //---add items---
    [listOfStates addObject:@"ALABAMA"];
    [listOfStates addObject:@"ALASKA"];
    //...
    [listOfStates addObject:@"WISCONSIN"];
    [listOfStates addObject:@"WYOMING"];
    
    self.navigationItem.title = @"States of America";
     
    [super viewDidLoad];
}

- (void)dealloc {
    [self.detailsViewController release];
    [listOfStates release];
    [super dealloc];
}

　command＋Rキーを押してアプリケーションをテストします。行を選択すると、選択された州を表示する別のビューウィンドウにリダイレクトされるようになっています（図14参照）。

図14　別のビューへの移動：州の行を選択すると、選択された州を表示する第2のビューウィンドウに移動するようになった