T#009 – Gestiamo più viste

In questo tutorial vedremo uno dei tanti modi possibili di gestire più viste all’interno delle nostre applicazioni. Per far ciò creeremo una classe, la cui superclasse sarà UIViewController che si occuperà avviare la vista principale e conterrà il codice per navigare tra le varie viste disponibili. Apriamo Xcode, creiamo un nuovo progetto e dall’elenco dei template disponibili scegliamo “Window-based Application”. Clicchiamo col pulsante destro del mouse su “Classes” in “Groups & Files”, quindi su “Add” e su “New File…”, dalla finestra che si apre clicchiamo su “UIViewController subclass” e premiamo il pulsante “Next” per proseguire. Diamo un nome al nuovo file, ad esempio “controllerViste”, facciamo attenzione che sia selezionata l’opzione “Also create controllerViste.h” e clicchiamo su “Finish”. Apriamo il file “controllerViste.h” appena creato e inseriamo il seguente codice:

#import <UIKit/UIKit.h>
 
 
@interface controllerViste : UIViewController {
	IBOutlet UIView *vistaUno;
	IBOutlet UIView *vistaDue;
	IBOutlet UIView *vistaTre;
}
 
@property (nonatomic, retain) IBOutlet UIView *vistaUno;
@property (nonatomic, retain) IBOutlet UIView *vistaDue;
@property (nonatomic, retain) IBOutlet UIView *vistaTre;
 
-(IBAction)vaiUno;
-(IBAction)vaiDue;
-(IBAction)vaiTre;
 
@end

Così facendo abbiamo creato 3 oggetti IBOutlet di tipo UIView che saranno collegati alle nostre viste che definiremo successivamente tramite Interface Builder. Abbiamo inoltre dichiarato i 3 metodi che ci permetteranno di navigare tramite le viste della nostra applicazione e che collegheremo ai 3 UIButton che implementeremo nella nostra interfaccia tramite IB più avanti. Apriamo ora il file di implementazione della nostra classe, “controllerViste.m” e inseriamo il codice dei metodi appena dichiarati nel file di interfaccia:

@synthesize vistaUno, vistaDue, vistaTre;
 
-(IBAction)vaiUno{
	self.view = vistaUno;
}
 
-(IBAction)vaiDue{
	self.view = vistaDue;
}
 
-(IBAction)vaiTre{
	self.view = vistaTre;
}
 
- (void)viewDidLoad {
        [super viewDidLoad];
	self.view = vistaUno;
}

Come vedete il codice per i 3 metodi è molto semplice e non fa altro che mostrare la rispettiva vista. Abbiamo inoltre “scommentato” il metodo viewDidLoad e abbiamo impostato la vista principale che si aprirà all’avvio dell’applicazione. Salviamo, apriamo “myViewAppDelegate.h” e modifichiamo il codice come segue:

#import <UIKit/UIKit.h>
 
@interface myViewAppDelegate : NSObject <UIApplicationDelegate> {
        UIWindow *window;
	UIViewController *controllerViste;
}
 
@property (nonatomic, retain) IBOutlet UIWindow *window;
@property (nonatomic, retain) IBOutlet UIViewController *controllerViste;
 
@end

Abbiamo semplicemente aggiunto un oggetto di tipo “UIViewController” di nome “controllerViste” e dichiarato la rispettiva “property”. Apriamo quindi “myViewAppDelegate.m” e modifichiamolo come segue:

#import "myViewAppDelegate.h"
 
@implementation myViewAppDelegate
 
@synthesize window, controllerViste;
 
- (void)applicationDidFinishLaunching:(UIApplication *)application {    
 
    // Override point for customization after application launch
	[window addSubview:controllerViste.view];
        [window makeKeyAndVisible];
}
 
- (void)dealloc {
	[controllerViste release];
        [window release];
        [super dealloc];
}
 
@end

Per quanto riguarda il codice è tutto. Apriamo Interface Builder facendo doppio click sul file “MainWindow.xib” e iniziamo a creare le nostre viste. Per prima cosa inseriamo un UIViewController e 3 UIView nel progetto facendo semplicemente doppio click su questi oggetti dalla “Library”. Trasciniamo quindi la prima vista dentro il nostro UIViewController. Dobbiamo ottenere una configurazione come quella mostrata in figura (non fate caso al nome “Controller Viste” in figura, voi al suo posto avrete “View Controller”):

Clicchiamo quindi su “View Controller”, apriamo la finestra “View Controller Identity” e selezioniamo “controllerViste” dall’elenco a scelta multipla “Class”. Apriamo ora le UIView una alla volta e inseriamo all’interno di ognuna 1 UILabel, impostado la sua proprietà “Text” con il numero che identifica la vista, e 2 UIButton inserendo nella proprietà “Title” rispettivamente “Vai alla vista 1″, “Vai alla vista 2″ o “Vai alla vista 3″ in base alla View in cui vi trovate. Dovete ottenere 3 View simili all’esempio qui sotto:

Ora dobbiamo effettuare i collegamenti tra gli oggetti appena creati e i rispettivi dichiarati via codice in Xcode. Cliccate quindi su “Controller Viste” e dalla finestra “Controller Viste Connection” effettuate i collegamenti come mostrato nella prossima immagine:

Collegando i metodi ai pulsanti, che come potete vedere hanno collegamenti multipli, fate attenzione a selezionare “Touch Up Inside” dal menù che compare rilasciando il mouse durante il collegamento. Fate inoltre attenzione a collegare correttamente le viste. Per l’ultimo collegamento in figura, nella categoria “Referencing Outlets”, dovete cliccare su “My View App Delegate” e dalla finestra “My View App Delegate Connections” collegate l’Outlet “controllerViste” con “Controller Viste”. Potete ora salvare e chiudere Interface Builder. Torniamo su Xcode e premiamo “Build and Run” per testare la nostra applicazione su iPhone Simulator o direttamente sul nostro dispositivo. Il risultato è mostrato nella prossima e ultima immagine: