前回はテーブルセルのカスタマイズに加え、ナビゲーション機能による画面遷移を実装し、UIWebViewを使って記事のWebページを表示できるようにした。

 今回は、UITabBarControllerを使って画面下部のTabBarによりナビゲーションを切り替える機能を追加し、もう一歩進んだアプリケーションを実装しよう。UITabBarControllerとUINavigationController、ViewControllerの階層構造を理解しながら、InterFaceBuilderを使用せずにプログラム内だけでこれらを関連付けていく方法を解説する。

UITabBarControllerの組み込み

 UITabBarControllerは、画面下部にTabBarを表示し、TabBar上のTabアイコンを選択することで複数のViewControllerの表示を切り替えることができるコントローラ・クラスである。UITabBarControllerにViewControllerをセットすることで切り替えが可能になるが、もちろんUINavigationControllerをセットすることもできるので、ナビゲーション機能と組み合わせて使用するのが一般的である。

 それでは、早速実装してみよう。

ITProAppDelegateクラスにUITabBarControllerを追加

 まず、ITProAppDelegateクラスのメンバー変数に、

UITabBarController *tabBarController;

を追加する。そしてapplicationDidFinishLaunchingメソッド内で、tabBarControllerのalloc、initを行い、前回作成したnavigationControllerをセットする。さらに前回はwindowにnavigationControllerのviewをaddSubViewしたが、navigationControllerはtabBarControllerにセットされたので、今回windowに追加するのはtabBarController側のviewである点に注意する。


- (void)applicationDidFinishLaunching:(UIApplication *)application {    
	tableViewController = [[ListViewController alloc] initWithStyle:UITableViewStylePlain];
	navigationController = [[UINavigationController alloc] initWithRootViewController:tableViewController];
	
	tabBarController = [[UITabBarController alloc] init]; 
	[tabBarController setViewControllers:[NSArray arrayWithObjects:navigationController, nil]]; ←
	[window addSubview:tabBarController.view]; 

	[window makeKeyAndVisible];
}

- (void)dealloc {
	[tableViewController release];
	[navigationController release];
	[tabBarController release]; 
    [window release];
    [super dealloc];
}
ITproAppDelegate.m
の行が新たに加えたり、変更した個所。
図1●UITabBarControllerを追加した状態の画面
[画像のクリックで拡大表示]

 この時点で実行すると図1のような画面になる。画面下部にTabBarが表示されているものの、アイコンやタイトルがセットされていないため、今の時点では何も表示していない。