back to top

Creare un menu per un’applicazione: la struttura del progetto – Guida Sviluppo App iOS

Fino a questo momento abbiamo sempre lavorato con una sola View. A questo punto, però, abbiamo tutti gli elementi per poter creare un menù per un’applicazione e gestire così più viste, una per ogni voce del menù.

Dato che ogni applicazione possiede un menù, abbiamo voluto dare al lettore delle basi concrete da cui partire per sviluppare autonomamente un’applicazione. Inoltre si vuole conferire al lettore una corretta implementazione della struttura dell’applicazione, gestendo in maniera ottimale l’allocazione delle view senza nessuno spreco di memoria. Questo risulta di vitale importanza se si vogliono sviluppare applicazioni con interfacce grafiche di impatto, con molte immagini o con animazioni. Una gestione errata della memoria per gli elementi grafici, infatti, potrebbe portare al crash improvviso della vostra applicazione.

La struttura del progetto

Dunque iniziamo con il dire che la vista principale sarà il menù contenente tre bottoni che, se cliccati, porteranno alla visualizzazione della view relativa. In ogni view (caricata al click del bottone) inseriremo un altro bottone per consentire all’utente di tornerà al menù principale.

Nei capitoli successivi vedremo anche come inserire qualche animazione al progetto per dare al lettore una base di codice "di partenza" per poter creare delle applicazioni più complesse.

Vediamo adesso i file costituenti la nostra applicazione che andremo poi ad analizzare uno per uno:

  • Un file relativo all’appDelegate necessario per poter gestire la visualizzazione delle varie view.
  • Tre file che ereditano la classe UIViewController che saranno i file di gestione delle relative view.
  • Un file che eredita la classe UIViewController che gestirà il menù dell’applicazione.
  • Tre file .xib che rappresentano l’interfaccia grafica delle relative view.
  • Un file .xib che conterrà l’interfaccia grafica del menù.

Creiamo il nostro progetto

Creiamo dunque un nuovo progetto scegliendo il template Window-based application e chiamiamo il progetto Guida; così facendo verrà creato il file GuidaAppDelegate con il rispettivo file header.

Adesso dobbiamo creare i ViewController necessari e dunque clicchiamo su File e poi su New File. Dal menù di sinistra scegliamo Cocoa Touch Class e poi scegliamo come template UIViewController subclass chiamando il file MenuViewController (questo sarà il controllore della nostra vista relativa al menù). Ripetiamo adesso l’operazione per creare i tre ViewController relativi alle tre viste accessibili dal menù (chiameremo questi file Vista1ViewController, Vista2ViewController e Vista3ViewController).

A questo punto abbiamo creato i file necessari per la gestione dell’applicazione e possiamo passare alla costruzione delle interfacce grafiche utilizzando Interface Builder.

Creiamo dunque tre file .xib per le view e un file .xib per il menù scegliendo come template View.

E’ possibile strutturare l’interfaccia grafica a piacimento, basta che siano presenti:

  • tre bottoni nel file .xib relativo al menù
  • un bottone (utilizzato per tornare al menù principale) ed una label (o una navigation bar) con scritto qualcosa che identifichi la view in ciascuno dei relativi file .xib

Come abbiamo notato precedentemente, la grafica dei bottoni che ci vengono offerti è abbastanza carente. Se si vuole dare un tocco di professionalità all’applicazione, realizzando così un’interfaccia accattivante e gradevole per l’utente, è assolutamente necessario associare il bottone ad un’immagine.

Dopo aver creato l’immagine relativa al bottone (utilizzando un qualsiasi programma di grafica come, ad esempio, Photoshop) è sufficiente importare l’immagine all’interno del nostro progetto ed aprire Interface Builder. A questo punto è sufficiente trascinare all’interno della view un bottone, selezionarlo e posizionarsi nel menù degli attributi.

Come possiamo vedere è presente un campo Image nel quale basta scrivere il nome dell’immagine che avevamo precedentemente importato per associarla al bottone.

Nella prossima lezione andremo ad analizzare, in maniera approfondita, il codice da inserire nelle varie classi costituenti la nostra applicazione.

Pubblicitร 

In questa guida...