NavigationController et TabBarController

mercredi 21 mars 2012

Pour la création de TabBar dans une application mobile c’est assez simple.
Il suffit de créer les différentes vues qu’on veut associé à chaque item de la tabbarController.

Bien entendu si dans les différentes vues on veut associé une navigation controller il suffit de la créer après la vue et d’y associé la vue au navigation controller. Ensuite, il suffit d’initialiser la tabbarController comme un tableau de vue/navigationcontroller.
Voici un exemple:

UIViewController *viewController1 = [[[WelcomeViewController alloc] initWithNibName:@"WelcomeViewController" bundle:nil] autorelease];
UINavigationController *navigationcontroller = [[UINavigationController alloc] initWithRootViewController:viewController1];
UIViewController *viewController2 = [[[OpenhourViewController alloc] initWithNibName:@"OpenhourViewController" bundle:nil] autorelease];
UIViewController *viewController3 = [[[UpdateViewController alloc] initWithNibName:@"UpdateViewController" bundle:nil] autorelease];
self.tabBarController = [[[UITabBarController alloc] init] autorelease];
self.tabBarController.viewControllers = [NSArray arrayWithObjects: navigationcontroller,viewController2,viewController3, nil];
self.window.rootViewController = self.tabBarController;

Cet exemple initialise le appdelegate window d’une tabbar de 3 vues dont l’une contient une navigationcontroller pour pouvoir y retourner si on y change de vue dans cette vue. Situation idéale si on fait une application qui contient une homepage avec plein de bouton vers d’autres vues et une tabbar.

Pour accéder à une vue d’un item d’une tabbar via un bouton:

[self.tabBarController setSelectedIndex:1];

Pour accéder à une vue qui a une navigationbarController via un bouton:

NewsViewController *newsVC = [[NewsViewController alloc] initWithNibName:@"NewsViewController" bundle:nil];
[self.navigationController pushViewController:newsVC animated:YES];  

Si en plus vous souhaitez utiliser les fichiers xib pour designer votre vue à l’intérieur d’un tabbarController et navigationController, on remarque que comme on génère cette tabbarController et NavigationController dynamiquement dans le appdelegarte sans utiliser l’interface builder rien de ces deux éléments s’affiche dans la vue .xib. Quid pour gérer le positionnement d’image/label ou boutton dans cette vue? La solution est d’aller dans l’interface builder de la vue controller dans la partie Simulated Metrics et on peut mettre une NavigationBar dans Top Bar et une tabbar dans BottomBar et alors on aura exactement les bonnes proportions pour travailler dans la vue.

Tags: Développement , IOS , Objective C , Xcode