Con questo tutorial vedremo come creare delle App universali (compatibili quindi sia con iPhone che con iPad) facendo uso di Interface Builder. Non nego che è possibile fare il tutto anche via codice, ma per adesso eviteremo di utilizzare questo metodo per un semplice motivo: le funzioni che permettono di capire se stiamo lavorando su iPad o iPhone, per il momento, sono utilizzabili solo su iPad (sono state introdotte nel 3.2). Quindi rimanderemo questa trattazione a dopo l’uscita dell’OS 4 quando tutti potranno testare il tutorial senza avere un account da developer pagante.

Creiamo il progetto e modifichiamone le proprietà

Come prima cosa creiamo un progetto direttamente dai uno dei template forniti da XCode. Io, per questo tutorial, ho utilizzato una “view-based application” per iPhone. Aprendo le risorse possiamo notare che ci sono stati creati tutti i file necessari per avere un’applicazione già funzionante che, come già saprete non fa altro che visualizzare una view vuota.

In questo momento la nostra applicazione è  progettata solo per iPhone, se vogliamo renderla universale dobbiamo specificarlo nelle Info del progetto. Facciamo quindi doppio click sull’icona nel progetto in Groups & Files (l’icona che cerchiamo è la prima).

Ora nella tab Build cerchiamo una proprietà chiamata Targeted Device Family e cambiamone il valore in IPhone/iPad. Ricordiamoci di effettuare la modifica per tutte le configurazioni.


Settaggio della proprietà per rendere l'applicazione universale

Creiamo i file Nib necessari

Per ora nelle risorse sono presenti solamente due file Nib che rappresentano la window e la view che dobbiamo visualizzare sui dispositivi iPhone. Prima di andare a creare i due file relativi alla window e alla view da visualizzare su iPad modifichiamo i nomi in modo da poterle successivamente distinguere. Io per esempio aggiungo il suffissi ~iPhone e ~iPad alla fine del nome del file.


Modifichiamo i nomi dei file

Apriamo ora il file MainWindow~iPhone.xib e creiamone la versione per iPad.
Per prima cosa modifichiamo il nome del file .nib caricato dal view controller andando ad aggiungere il suffisso ~iPhone alla proprietà NIB Name del view controller.


Modifichiamo il file nb caricato

Selezioniamo ora File -> Create iPad Version per creare la versione iPad della nostra window.


Creazione della iPad version

Ci apparirà ora la window versione iPad. Non dobbiamo far altro che modificare anche qui il file Nib caricato dal controller (aggiungendo questa volta il suffisso ~iPad). Salviamo il file come MainWindow~iPad.xib e importiamolo nel progetto.
Apriamo ora il file relativo alla view da visualizzare sull’iPhone e modifichiamo il colore di background rendendo la view, per esempio, arancione. Salviamo e con lo stesso procedimento spiegato prima creiamo la versione per iPad di questa view e diamo un colore di background differente, per esempio verde, e salviamo il file importandolo all’interno del nostro progetto.
A questo punto ci ritroviamo nel progetto sia i due file Nib versione iPhone che quelli della versione iPad.


Situzione finale

Abbiamo quasi finito. Prima di vedere il tutto funzionare nel simulatore, ci manca però un ultimo passaggio.

Modifica del file Info.plist

Nulla di complicato. Dobbiamo solamente aprire il file plist, modificare una proprietà e aggiungerne un’altra.
La proprietà che dobbiamo modificare è quella relativa al file Nib caricato all’avvio dell’applicazione come potete notare voi stessi dobbiamo anche in questo caso limitarci ad aggiungere il suffisso ~iPhone. La voce “Main nib file base name”, anche se non è specificato, si riferisce a quando l’applicativo viene lanciato su iPhone.
Come avrete probabilmente intuito la proprietà da aggiungere è quella che indica il file Nib da utilizzare quando l’applicazione viene lanciata su iPad. Aggiungiamo una nuova voce al file plist mettendo come chiave “Main nib file base name (iPad)” mentre come valore “MainWindow~iPad”.
Se avete fatto tutto correttamente il file plist dovrebbe apparire esattamente come segue:


plist

Ora, lanciando l’applicazione su iPhone noterete che lo schermo è arancione, mentre se la lanciate su iPad è verde.


iPhone


iPad

A questo punto potete sbizzarrirvi come volete e creare le vostre applicazioni universali. Buon divertimento :)

Se avete bisogno di tutti i file del progetto li potete scaricare come sempre da Google Code