iOS - Barre de navigation

Utilisation de la barre de navigation

La barre de navigation contient les boutons de navigation d'un contrôleur de navigation, qui est une pile de contrôleurs de vue qui peuvent être poussés et sautés. Le titre de la barre de navigation est le titre du contrôleur de vue actuel.

Exemple de code et étapes

Step 1 - Créez une application basée sur la vue.

Step 2 - Maintenant, sélectionnez l'application Delegate.h et ajoutez une propriété pour le contrôleur de navigation comme suit -

#import <UIKit/UIKit.h>

@class ViewController;

@interface AppDelegate : UIResponder <UIApplicationDelegate>

@property (strong, nonatomic) UIWindow *window;

@property (strong, nonatomic) ViewController *viewController;

@property (strong, nonatomic) UINavigationController *navController;

@end

Step 3 - Maintenant, mettez à jour le application:didFinishLaunchingWithOptions: méthode dans AppDelegate.m file, pour allouer le contrôleur de navigation et en faire le contrôleur de vue racine de la fenêtre comme suit -

- (BOOL)application:(UIApplication *)application 
   didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {
   self.window = [[UIWindow alloc] initWithFrame:
   [[UIScreen mainScreen] bounds]];
   
   // Override point for customization after application launch.
   self.viewController = [[ViewController alloc] 
   initWithNibName:@"ViewController" bundle:nil];
   
   //Navigation controller init with ViewController as root
   UINavigationController *navController = [[UINavigationController alloc]
   initWithRootViewController:self.viewController];
   self.window.rootViewController = navController;
   [self.window makeKeyAndVisible];
   return YES;
}

Step 4 - Ajouter un nouveau fichier de classe TempViewController en sélectionnant FileNewFile... → Classe Objective C, puis nommez la classe TempViewController avec la sous-classe UIViewController.

Step 5 - Ajouter un UIButton navButon dans ViewController.h comme suit -

// ViewController.h
#import <UIKit/UIKit.h>

@interface ViewController : UIViewController {
   UIButton *navButton;
}
@end

Step 6 - Ajouter une méthode addNavigationBarItem et appelez la méthode dans viewDidLoad.

Step 7 - Créez une méthode pour l'action de l'élément de navigation.

Step 8 - Nous devons également créer une autre méthode pour pousser un autre contrôleur de vue TempViewController.

Step 9 - La mise à jour ViewController.m est comme suit -

// ViewController.m
#import "ViewController.h"
#import "TempViewController.h"
@interface ViewController ()

@end
@implementation ViewController

- (void)viewDidLoad {
   [super viewDidLoad];
   [self addNavigationBarButton];
   //Do any additional setup after loading the view, typically from a nib
}

- (void)didReceiveMemoryWarning {
   [super didReceiveMemoryWarning];
   // Dispose of any resources that can be recreated.
}

-(IBAction)pushNewView:(id)sender {
   TempViewController *tempVC =[[TempViewController alloc]
   initWithNibName:@"TempViewController" bundle:nil];
   [self.navigationController pushViewController:tempVC animated:YES];
}

-(IBAction)myButtonClicked:(id)sender {
   // toggle hidden state for navButton
   [navButton setHidden:!nav.hidden];
}

-(void)addNavigationBarButton {
   UIBarButtonItem *myNavBtn = [[UIBarButtonItem alloc] initWithTitle:
   @"MyButton" style:UIBarButtonItemStyleBordered target:
   self action:@selector(myButtonClicked:)];
   
   [self.navigationController.navigationBar setBarStyle:UIBarStyleBlack];
   [self.navigationItem setRightBarButtonItem:myNavBtn];
   
   // create a navigation push button that is initially hidden
   navButton = [UIButton buttonWithType:UIButtonTypeRoundedRect];
   [navButton setFrame:CGRectMake(60, 50, 200, 40)];
   [navButton setTitle:@"Push Navigation" forState:UIControlStateNormal];
   [navButton addTarget:self action:@selector(pushNewView:) 
   forControlEvents:UIControlEventTouchUpInside];
   [self.view addSubview:navButton];
   [navButton setHidden:YES];
}
@end

Step 10 - Lorsque nous exécutons l'application, nous obtenons la sortie suivante -

Step 11 - En cliquant sur le bouton de navigation MyButton, la visibilité du bouton de navigation est basculée.

Step 12 - En cliquant sur le bouton de navigation poussoir, un autre contrôleur de vue est poussé comme indiqué ci-dessous.