Aggiungere effetti di transizione tra le view – Guida Sviluppo App iOS

L’applicazione vista precedentemente, seppur abbellita con qualche immagine per bottoni e per lo sfondo, risulta comunque un’interfaccia statica. Sarebbe carino inserire qualche effetto di transizione tra una vista ed un’altra per rendere il tutto più gradevole per l’utente. Anche in questo caso ci vengono offerti delle classi e dei metodi che gestiscono alcune transizioni con pochissimo sforzo: vediamo come fare.

Quelli che andremo ad utilizzare sono metodi di classi e dunque dovremo invocarli utilizzando il nome della classe e non il nome dell’oggetto di riferimento. Più precisamente useremo il metodo beginAnimations:context: per iniziare un blocco di codice relativo all’animazione e utilizzeremo il metodo commitAnimations per decretare la fine del blocco di animazione.

Dal punto di vista dell’esecuzione l’animazione viene eseguita da un thread separato rispetto al flusso di codice principale. Vediamo adesso come implementare quanto detto.

Riprendiamo il progetto creato precedentemente e spostiamoci nel file di implementazione, per esempio del Vista1ViewController, e poniamoci nel metodo backButtonAction sostituendo il vecchio codice con il seguente:

- (IBAction) backButtonAction:(id)sender{
  
  [self.view removeFromSuperview];
  [UIView beginAnimations:nil context:nil];
  [UIView setAnimationDuration:1.0];
  [UIView setAnimationTransition:UIViewAnimationTransitionFlipFromRight 
  forView:[appDelegate.menuViewController view] cache:YES];

  [appDelegate.window addSubview:[appDelegate.menuViewController view]];
  [UIView commitAnimations];
}

Come prima cosa rimuoviamo la view attuale e poi inseriamo il metodo che sancisce l’inizio del blocco dell’animazione. Sorvoliamo sul perchè abbiamo passato il valore nil ai due parametri dato che, in questo paragrafo, si vuole fare solo un accenno alle transizioni (se si vuole approfondire l’argomento basta leggere le reference relative alla classe UIView sul sito della Apple). Come seconda cosa invochiamo il metodo setAnimationDuration che imposta la durata (espressa in secondi) dell’animazione. Si consiglia di non inserire animazioni troppo lunghe in quanto le animazioni sono gradevoli per l’utente solo se hanno una durata limitata. Detto questo viene invocato il metodo setAnimationTransition:forView:cache: che rappresenta il cuore dell’animazione in quanto si specifica il tipo di animazione che si desidera e a quale vista associarla. Per quanto riguarda il primo parametro che indica il tipo di animazione voluta è possibile scegliere tra le seguenti opzioni:

• UIViewAnimationTransitionNone: non viene specificato nessun tipo di animazione. In sostanza la view viene caricata normalmente senza che venga applicato nessun effetto.
• UIViewAnimationTransitionFlipFromLeft: transizione che ruota la view intorno ad un asse verticale da sinistra verso destra.
• UIViewAnimationTransitionFlipFromRight: transizione che ruota la view intorno ad un asse verticale da destra verso sinistra.
• UIViewAnimationTransitionCurlUp: transizione che simula lo sfogliamento di una pagina dal basso verso l’alto.
• UIViewAnimationTransitionCurlDown: transizione che simula lo sfogliamento di una pagina dall’alto verso il basso.

Come possiamo vedere le transizioni che ci vengono offerte non sono molte, ma se utilizzate nella giusta maniera possono conferire una dinamicità all’applicazione molto gradevole.

Nel secondo parametro del metodo preso in esame dobbiamo specificare a quale view applicare la trasizione. Come possiamo vedere accediamo alla view utilizzando il delegato, cosa che è possibile fare dato che lo abbiamo assocato al ViewController.

Infine nell’ultimo parametro impostiamo la cache per l’animazione a YES, poi richiamo il metodo addSubView applicando la nuova vista ed infine invochiamo il metodo commitAnimations per terminare il blocco di animazione.