Tutorial pratici per iPhone SDK v1.6 - Get a Free Blog

INDICE 

Prefazione! 8 

Parte 1: tutorial di base! 9 

Capitolo 1: Introduzione al SDK e ad XCode! 10 

Introduzione! 10 

Panoramica sul SDK! 10 

XCode! 11 

Capitolo 2: Come creare un nuovo progetto! 15 

I template di XCode! 15 

Creare un nuovo progetto! 17 

Interface Builder! 17 

Capitolo 3: Il nostro primo progetto, He"oWorld!! 20 

Creiamo la struttura grafica! 20 

Definiamo gli elementi e le azioni! 21 

Scriviamo il codice necessario! 24 

Facciamo nascondere la tastiera! 25 

Capitolo 4: TrashApp, gestiamo le immagini! 27 

Definiamo l’applicazione! 27 

Tutorial pratici per iPhone SDK! 3

Definiamo l’aspetto grafico.! 28 

Implementiamo il movimento del logo! 31 

Il ripristino del logo! 33 

Capitolo 5: UIToolbar e auto-rotazione! 35 


Definiamo l’aspetto grafico! 35 


Capitolo: 6: NSTimer e UIProgressView! 41 


Definiamo l’aspetto grafico! 42 

Scriviamo il codice! 44 

Capitolo 7: AccessContact, accediamo a"a rubrica! 48 

Definiamo il progetto! 48 

Definiamo la struttura grafica! 49 


Capitolo 8: Creiamo un mini browser con le UIWebView! 53 


Definiamo i componenti e co"eghiamo le azioni! 54 

Scriviamo il codice per aprire la pagina desiderata! 56 

Capitolo 9: UITableView, gestiamo le tabe"e! 58 

Parte 1: creiamo e definiamo la tabe"a! 58 

Creiamo un nuovo progetto! 58 


Inseriamo il codice necessario! 59 

Parte 2: Inseriamo alcune funzionalità! 62 

Permettiamo la cance"azione di una riga! 62 

Rendiamo le ce"e selezionabili! 63 

Parte 3: Implementiamo la ricerca! 65 

A$iungiamo il box di ricerca! 65 

Modifichiamo i metodi già esistenti! 66 

Implementiamo la ricerca! 68 

Capitolo 10: gestiamo più viste (file “.xib” multipli)! 71 


Definiamo la prima vista! 72 

Definiamo la “VistaDue”! 74 


Capitolo 11: Come creare una TabBar Application! 78 

Parte 1: la struttura di base! 78 

Creiamo una TabBar “pulita”! 78 

Definiamo le due viste! 79 

Creiamo l’aspetto grafico de"e due viste! 80 

Impostiamo la TabBar! 83 

Parte 2: Inseriamo una NavigationBar! 87 

Creiamo un nuovo elemento per la TabBar! 87 

Definiamo l’aspetto del nuovo elemento! 89 

Implementiamo due viste di dettaglio! 92 


Definiamo l’aspetto de"e due viste di dettaglio! 93 

Come richiamare le due viste via codice! 96 

Capitolo 12: XML! 99 

Cosa è XML?! 99 

XML nel SDK di iPhone! 101 



Capitolo 13: SQL! 108 

Definiamo un nuovo progetto! 108 

Definiamo la classe “Data”! 110 

Creiamo il database! 114 

Concludiamo l’applicazione! 118 

Parte 2: semplici applicazioni! 122 

Capitolo 14: Creiamo un semplice lettore di feed RSS! 123 


Definiamo le azioni del parser! 125 

Concludiamo l’applicazione! 128 

Un piccolo miglioramento! 129 

Capitolo 15: Creiamo un client per Twitter!! 132 

Parte 1: connettiamoci a Twitter! 132 

impostiamo la libreria “MGTwitterEngine”! 132 

Definiamo la vista di caricamento! 136 


Creiamo la classe “Tweet”! 137 

Definiamo la classe “SampleTwitterClientViewContro"er”! 138 

Le$iamo la timeline! 140 

Parte 2: Creiamo la tabe"a con i tweet letti! 143 

Creiamo la ce"a personalizzata! 145 

Definiamo la classe de"a tabe"a! 149 

Completiamo l’applicazione! 151 

Parte 3: Il salvata$io dei dati! 157 

Gestiamo il caricamento / salvata$io dei dati! 159 

Capitolo 16: Realizziamo il nostro “Brushes”! 162 

Parte 1: Creiamo la tavola grafica! 162 


Definiamo l’aspetto grafico de"’applicazione! 163 

Definiamo i metodi necessari! 166 

Parte 2: Inseriamo i setta$i! 170 

A$iungiamo le impostazioni! 170 


Inseriamo il salvata$io del disegno! 177 

Bibliografia! 181 


Prefazione 

Questo libro racchiude tutti i tutorial che ho creato sulla programmazione per iPhone e iPod 

Touch. Non vuole essere un manuale esauriente o sostituirsi alla documentazione ufficiale Apple, 

ma solo uno strumento per chi è alle prime armi, oppure per chi vuole imparare qualcosa 

che ancora non sa. 

Troverete una serie di guide pratiche, da seguire passo per passo, commentate e spiegate, per 

consentire a tutti di imparare e capire quello che viene fatto. Il libro è diviso in due sezioni: la 

prima vi presenterà dei tutorial sugli aspetti e sui componenti base della programmazione per 

iPhone, mentre la seconda parte vi fornirà alcuni tutorial in cui verranno create delle semplici 

applicazioni complete, in modo che abbiate un quadro d’insieme generale. 

Ringrazio chiunque legga queste pagine, sperando di potervi aiutare in un vostro scopo, sia lavorativo 

o per pura passione (come la mia). 

Ringrazio la mia fidanzata, che mi ha sempre sopportato e sostenuto, seppur non sappia niente 

di programmazione! 

Ringrazio Fabiano Confuorto, fondatore e amministratore di iSpazio, una stupenda community 

che mi ha fatto scoprire il mondo iPhone, e che mi ha dato l’opportunità di creare e pubblicare 

i miei primi tutorial. 

Ringrazio Steve Jobs, per aver creato il Mac e l’iPhone, cercando sempre la perfezione nelle cose. 

E ricordatevi, solo essendo curiosi e affamati è possibile scoprire e creare qualcosa di nuovo e 

veramente innovativo. 

“Siate affamati, siate fo"i.” 


Parte 1: 

tutorial di base 


Capitolo 1: Introduzione al SDK e ad XCode 

INTRODUZIONE 

Con il rilascio del firmware 2.0, Apple ha segnato una svolta nel settore mobile: non era mai 

stato così semplice sviluppare e vendere le proprie applicazioni. Per permettere tutto ciò, Apple 

ha creato AppStore, uno spazio che si integra al già famoso e collaudato iTunes Store. Qualsiasi 

sviluppatore, indipendente o azienda già affermata, può pubblicare le proprie creazioni 

semplicemente acquistando una licenza annua, al prezzo di 99$ (79€ per noi europei). Quali 

sono i vanta$i legati a"’acquisto di una licenza? Sono molti, e valgono il prezzo da pagare. La cosa 

più importante è, come già detto, la possibilità di vendere le proprie applicazioni in AppStore. 

Ci sono, però, altri vantaggi: la possibilità di scaricare e installare le versioni beta dei nuovi 

firmware (per testare la compatibilità delle proprie applicazioni); la possibilità di installare i 

propri progetti anche sull’iPhone / iPod Touch direttamente da XCode (cosa che non è possibile 

senza licenza); l’accesso ad un forum specifico in cui saranno esperti Apple a dare risposte e 

ad aiutare gli sviluppatori in difficoltà; la disponibilità di una documentazione più ampia e più 

dettagliata. Come vedete non si tratta di sciocchezze. 

Ma come si sviluppano le applicazioni? Il tutto è davvero molto semplice (in pieno stile Apple): con 

il firmware 2.0, infatti, è stato rilasciato un SDK (Software Development Kit) ufficiale, che 

integra tutti gli strumenti necessari per creare applicazioni e giochi per iPhone e iPod Touch. 

Questo SDK è liberamente scaricabile dall’iOS Dev Center 

(http://developer.apple.com/devcenter/ios/index.action), previa registrazione gratuita (ma si 

può accedere alla sezione anche con il proprio account di iTunes). L’iOS Dev Center è l’area di 

Apple dedicata agli sviluppatori (ovviamente di applicazioni per iPhone), in cui si può trovare 

davvero tantissimo materiale molto utile: esempi con codice ben commentato, documentazione 

delle librerie, documenti teorici, video, e molto altro ancora. 

Come ho già detto, per pubblicare applicazioni in AppStore è necessario disporre della licenza 

ufficiale. Questo, però, non basta per vedere pubblicate le proprie creazioni: ogni applicazione, 

infatti, passa sotto il controllo di Apple, che decide se accettarle o meno. Le applicazioni presenti 

in AppStore, infatti, devono rispettare il contratto del SDK, che prevede alcune limitazioni: 

è vietato, ad esempio, duplicare funzioni già presenti nel S.O. dell’iPhone (come l’invio di 

SMS e MMS), oppure sono vietate applicazioni con contenuto a sfondo sessuale o violento. 

Non pensate, quindi, di poter ingannare Apple: c’è chi si è visto rifiutare la propria applicazione 

anche per una semplice icona. 

PANORAMICA SUL SDK 

Dopo aver scaricato e installato l’SDK (un’immagine dmg di circa 3 GByte), troverete tutto il 

necessario per sviluppare nella cartella “/Developer/Applications”. Gli strumenti (davvero molto 

potenti) che Apple mette a disposizione sono i seguenti: 


• Dashcode, è un utile tool con cui potremo creare pagine web, widget (anche per la Dashboard 

di Mac OS X) e altro; 

• Instruments, permette di analizzare e valutare le prestazioni delle nostre applicazioni (in 

termini di consumo di memoria, impiego del processore, etc). È destinato, ovviamente, agli 

sviluppatori più esperti. 

• Interface Builder, grazie a questa applicazione sarà davvero un gioco da ragazzi creare 

l’aspetto grafico dei nostri programmi. Potremo inserire qualsiasi tipo di oggetto (bottoni, 

label, viste) semplicemente trascinando gli oggetti nella nostra schermata. 

• Quartz Composer, è un tool che permette di creare animazioni ed effetti grafici, da utilizzare 

poi in altri programmi. 

• XCode, è l’ambiente di sviluppo vero e proprio. Sarà qui, infatti, che andremo a creare i nostri 

progetti, scrivere il codice e compilare il tutto. È lo strumento, insieme ad Interface 

Builder, che utilizzeremo di più. 

XCODE 

Analizziamo, ora, come si presenta XCode. Aprendo un progetto (vedremo nel capitolo 2 come 

crearne un nuovo) otterremo la seguente schermata: 


Potete notare tre sezioni principali: a sinistra troviamo “Groups & Files”, in cui abbiamo tutti i 

file che compongono il nostro progetto. Troveremo, quindi, le classi, le immagini inserite, i 

framework utilizzati. A destra, invece, possiamo vedere l’editor del codice, che ci assisterà e ci 

permetterà di scrivere il nostro codice. La barra in alto, infine, ci offre la possibilità di compilare 

ed installare la nostra applicazione, sul dispositivo che preferiamo: il nostro iPhone (solo nel 

caso in cui abbiamo la licenza ufficiale) oppure l’iPhone Simulator (un simulatore che ci permetterà 

di testare le nostre applicazioni comodamente sul Mac, senza dover installare nulla sul 

nostro iPhone). 

Il menù a tendina presente a sinistra della barra ci permette di scegliere velocemente alcune 

opzioni, molto utili in fase di compilazione ed installazione. Se lo apriamo troviamo le seguenti 

voci (che ovviamente variano a seconda della versione di SDK che avete installato nel vostro 

Mac): 

La prima parte ci permette di scegliere se installare la nostra applicazione sul simulatore oppure 

su un device fisico. Ovviamente all’inizio del vostro progetto testerete l’applicazione solo sul 

simulatore, ma poi sarà molto importante controllare che tutto funzioni correttamente anche 

sul dispositivo vero e proprio. 

La seconda impostazione riguarda “Active Configuration”: selezionando l’opzione “Debug” otterremo 

un’applicazione più pesante, progettata per essere testata e corretta (proprio in quella 

che viene definita fase di debug); la versione “Release”, invece, è molto più leggera ed è pronta 

per essere rilasciata e pubblicata in AppStore. 

Se cliccate due volte sul nome del progetto si aprirà una finestra in cui vi verranno mostrate 

tutte le proprietà del vostro progetto. Alcune imparerete a conoscerle durante la lettura, altre 


invece non le utilizzerete mai nella vostra vita (a meno che non andiate a lavorare al campus di 

Cupertino di Apple, e ve lo auguro con tutto il cuore). 

Concentriamoci, però, su due voci importantissime. La prima è “Base SDK”, che trovate nelle 

prime posizioni: 

essa indica la versione dell’SDK che stiamo utilizzando. Se scaricate qualche progetto e vi appare 

la scritta “Base SDK Missing”, dovete semplicemente entrare in questa opzione e selezionare 

la vostra versione di SDK. Questa serve solamente per far capire ad XCode che stiamo 

lavorando con l’SDK di iOS, e non quello per Mac OS X. 

Un’altra opzione di fondamentale importanza la trovare un po’ più sotto, si chiama “iOS Deployment 

Target”: 


Qui andremo a selezionare la versione del firmware con cui vogliamo che sia compatibile la nostra 

applicazione. Questo è necessario in quanto spesso, con il rilascio di nuovi firmware, vengono 

aggiunte anche nuove funzioni all’SDK (le API). Quindi, un’applicazione scritta e compilata 

per il firmware 4.2 potrebbe non funzionare con una versione inferiore del firmware (spesso 

è proprio impossibile installarla, in quanto l’AppStore controlla questa compatibilità in fase 

di installazione). Al contrario, se compiliamo l’applicazione per la versione 3.0 funzionerà sicuramente 

(a meno che non utilizziate delle API con alcuni bug) sulla 4.2. È importante, quindi, 

scegliere con cura la versione da utilizzare, per non escludere parte di utenza dall’utilizzo della 

nostra applicazione. 

Per ora è buona norma rendere le vostre applicazioni compatibili dal firmware 3.1 in su, in 

modo tale da non escludere nessun device (i primi iPhone EDGE e gli iPod Touch di 1° generazione, 

infatti, non possono installare iOS 4). 


Capitolo 2: Come creare un nuovo progetto 

Abbiamo dato un’occhiata al SDK e ad XCode. È venuto il momento di iniziare a vedere gli 

strumenti che XCode ci mette a disposizione per realizzare i nostri progetti. 

In questo capitolo vedremo come creare un nuovo progetto, quali template XCode ci mette a 

disposizione e le caratteristiche principali di Interface Builder. 

I TEMPLATE DI XCODE 

Avviando XCode e selezionando “File -> New Project...”, si aprirà la seguente finestra: 

Potete notare che XCode ci fornisce vari template, ovvero delle strutture già pronte, che ci 

permetteranno di creare applicazioni sullo stile di quelle native. Non dovremo perdere tempo, 

quindi, per replicare lo stile delle altre applicazioni, perché è Apple stessa che ce li mette a disposizione. 


( Navigation-Based! ! Tab Bar Application! ! ! Utility Application 

Analizziamo, ora, i vari template che ci vengono forniti. 

• Navigation-Based Application, genera un’applicazione in cui possiamo navigare in sotto-livelli. 

Per farvi un esempio, pensate alla struttura di “Impostazioni” nel vostro iPhone: avete 

una barra in alto che visualizza il titolo della sezione corrente, e vi permette, tramite un 

bottone, di tornare alla sezione precedente. Questa barra viene chiamata “Navigation Bar”. 

Utile per creare applicazioni con tabelle, in cui vogliamo mostrare anche le informazioni 

sui vari elementi. 

• OpenGL ES Application, questa è sicuramente la tipologia più complessa, in quanto si basa 

sulla tecnologia OpenGL (http://it.wikipedia.org/wiki/OpenGL), sfruttata principalmente 

per realizzare videogiochi o animazioni grafiche complesse. In questo libro non analizzeremo 

questa tipologia di applicazioni. 

• Tab Bar Application, fornisce un’applicazione con la “tab bar”, ovvero la barra nera composta 

da più sezioni (ad esempio quella che trovate nell’applicazione nativa “Musica”). 

• Utility Application, questa tipologia implementa un menù che viene richiamato ruotando la 

schermata principale. Anche in questo caso, potete trovare una similitudine con l’applicazione 

“Meteo”: se premete sulla “i” presente a fondo pagina, la schermata ruoterà e vi permetterà 

di modificare i settaggi dell’applicazione. 

• View-Based Application, fornisce un’applicazione vuota, senza nessuna implementazione 

particolare. Questo template è composto da una finestra, chiamata “MainWindow”, e una 

vista, “[nome_progetto]ViewController”, che viene caricata proprio dalla finestra principale. 

Sarà questo punto di partenza per tutti i nostri tutorial. 

• Window-Based Application, è molto simile al caso precedente, ma il template fornito è composto 

solamente da una finestra (non è presente quindi la vista “[nome_progetto]ViewController”). 


CREARE UN NUOVO PROGETTO 

In ogni tutorial che vedremo, sarà necessario creare un nuovo progetto. Per fare ciò, vi basterà 

aprire XCode, selezionare “File -> New Project...”, si aprirà la finestra con la scelta del template, 

che abbiamo appena analizzato. Scegliete il template desiderato (generalmente sarà View- 

Based Application), cliccate su “Choose..” e nel box successivo inserite il nome del nostro progetto. 

Finito! 

INTERFACE BUILDER 

Scorrendo la sezione “Groups & Files” possiamo vedere tutti i file che XCode ha già inserito 

per noi. Nel capitolo 3 vedremo come creare la nostra prima applicazione (il classico HelloWorld), 

ora ci limitiamo ad analizzare le caratteristiche principali dell’Interface Builder. 

Facciamo doppio clic su “[nome_progetto]ViewController.xib”, nella cartella “Resources”, e si 

aprirà Interface Builder. 

Ci ritroveremo con una situazione simile a questa: 

Potete notare vari strumenti sul vostro desktop: la libreria, la schermata della nostra applicazione 

(per ora completamente grigia), ed altri strumenti. 

Analizziamo ora questi componenti. 


• Library, è la libreria da cui possiamo inserire tutti gli oggetti che desideriamo. Se non è già 

aperta, ci basterà andare in “Tools -> Library” e si aprirà 

una finestra come quella a lato. Scorrendo la barra laterale, 

potete notare moltissimi componenti, come bottoni, 

label di testo, viste, barre e molto altro. Tutti questi elementi 

potranno essere utilizzati nelle nostre applicazioni. 

Per inserirli basta trascinare un componente nella schermata 

dell’applicazione, e collocarlo a proprio piacere 

(questo è vero per tutti i componenti tranne i “Controllers”, 

che potrete riconoscere perché hanno uno sfondo 

giallo). 

• Vista o finestra, è la nostra vista, ovvero la finestra che verrà visualizzata sull’iPhone. Potremo 

personalizzarla a nostro piacimento, e impareremo nei capitoli successivi come fare. 

L’unica cosa che vi faccio notare, è la freccia presente a destra del nome della vista: 

Se provate a cliccarla, noterete che la vista ruota: questo perché sarà possibile implementare 

la possibilità di ruotare la nostra applicazione quando l’utente ruota il proprio iPhone. 

Vedremo in dettaglio questo aspetto in un tutorial successivo. 

• Panne"o documenti, questo pannello vi mostra tutti i componenti del vostro file xib. All’inizio 

vi potrà sembrareinutile, però quando l’applicazione 

inizierà a diventare complessa, vi sarà molto 

utile per ritrovare tutti i componenti della vostra 

finestra. 


• Inspector, è sicuramente la parte più importante di Interface Builder, in quanto ci permette 

di impostare qualsiasi proprietà, relativa ad ogni oggetto (dalla vista al singolo bottone). 

Potremo, quindi, modificare l’aspetto degli oggetti, collegare le azioni, modificarne la dimensioni. 

Insomma, potrete agire su moltissimi aspetti (il tutto senza scrivere una riga di 

codice). 

L’Inspector è composto da 4 parti: 

✴Attributes, qui possiamo variare gli attributi generici dei nostri oggetti, ad esempio il 

colore, la dimensione del font, ed altre proprietà che impareremo poco alla volta. 

✴Connections, è uno dei pannelli principali. Qui andremo a collegare le azioni agli oggetti. 

Cosa significa? Ve lo spiego con un esempio. Supponiamo di avere un bottone 

nella nostra vista, e vogliamo che quando viene premuto venga scritto “Ciao” in una 

casella di testo. Creeremo, quindi, un’azione, che si occuperà di scrivere “Ciao”. Dovremo, 

poi, collegare questa azione al bottone, in modo che quando l’utente preme il 

bottone, viene eseguito il comportamento desiderato. Vedrete che con i prossimi tutorial 

tutto questo sarà più familiare. 

✴Size, questa sezione permette, come dice la parola stessa, di modificare le dimensioni 

dell’oggetto, e di modificarne anche la posizione e l’ancoraggio (ovvero dove deve essere 

fissato, questo sarà fondamentale quando implementeremo la rotazione della 

schermata). 

✴Identity, in questo pannello sono presenti alcune voci relative al progetto e al file che 

stiamo modificando. Noi non utilizzeremo mai questo pannello, quindi potete anche 

non considerarlo. 

Abbiamo così completato la panoramica sull’Interface Builder. Mi pare inutile, per ora, dilungarmi 

in altri aspetti, che vi saranno sicuramente più chiari e familiari con un po’ di pratica. In 

pochissimo tempo, non riuscirete più a fare a meno di Interface Builder! 


Capitolo 3: Il nostro primo progetto, HelloWorld! 

In questo capitolo realizzeremo la nostra prima applicazione, il classico HelloWorld! Chiederemo 

all’utente il proprio nome (ad esempio Tizio) e alla pressione di un bottone faremo apparire 

il messaggio “Ciao Tizio”. Niente di complicato quindi, però cercate di capire bene tutti i 

passaggi, in modo da non avere lacune su queste cose basilari. 

CREIAMO LA STRUTTURA GRAFICA 

Iniziamo quindi creando un nuovo progetto di tipo “View-Based Application” e chiamiamolo 

“HelloWorld”. Apriamo quindi il file “HelloWorldViewController.xib”, che avvierà anche l’Interface 

Builder. Ora dobbiamo creare la struttura grafica, che deve essere simile a questa: 

Come potete osservare, ci sono tre componenti principali: 

1.una UITextField in cui l’utente potrà inserire il proprio nome; 

2.una UIButton, con la scritta “Saluta!”, che l’utente dovrà premere per far apparire il saluto; 

3.due UILabel, una con la scritta “Nome” (e questa serve solo per rendere più intuitivo il 

nostro programma), l’altra posta a centro schermo (che contiene la stringa Label). È importante 

impostare le dimensioni di questa ultima label in modo che occupi tutta la larghezza 

della vista, altrimenti avremo problemi quando andremo a stampare il messaggio di saluto 

in seguito. 


Tramite “Attribute Inspector” possiamo definire alcune proprietà per questi oggetti. Selezioniamo 

ad esempio la UITextField, e impostiamo i seguenti valori: 

• “Capitalize”: “Words” (ovvero quando l’utente inizia a digitare il proprio nome la prima lettera 

viene scritta in maiuscolo); 

• “Corrections”: “No” (disabilitiamo la correzione automatica per questo campo); 

• Spuntiamo l’opzione “Clear When Editing Begins” (cancellerà il contenuto già presente non 

appena l’utente seleziona il campo). 

A vostro piacere potete anche impostare altre proprietà, provatene alcune per prendere un po’ 

più di confidenza. 

Prima di proseguire, diamo un’occhiata a ciò che compone questo file (lo potete trovare nel 

pannello dei documenti): 

Potete notare tre elementi, che XCode ha già definito per noi. 

• File’s Owner, come dice la parola stessa, è il proprietario del file. È, in sostanza, la classe che 

gestisce la nostra finestra, ovvero che gestisce ogni singolo aspetto. Nel nostro caso sarà la 

classe “HelloWorldViewController”, dove poi andremo a scrivere il codice necessario. 

• First Responder, per ora non è un componente che ci interessa, però sappiate che si occupa, 

ad esempio, della gestione del multi-touch. 

• View, è la nostra vista, ovvero la schermata che abbiamo definito. In questo caso ne abbiamo 

solo una, ma nulla ci vieta di definirne svariate e richiamarle poi a nostro piacimento. 

DEFINIAMO GLI ELEMENTI E LE AZIONI 

Dobbiamo ora definire gli elementi e le azioni necessarie. Il procedimento sarà sempre questo, 

ovvero definire gli elementi via codice e poi collegarli ad oggetti di Interface Builder. Salviamo 

tutto e chiudiamo Interface Builder, tornando così in XCode. 

Nella cartella “Classes” noteremo quattro file: due con estensione “.h” e due con estensione 

“.m”. I file “.h” stanno ad indicare le classi di intestazione, ovvero dove vengono definiti i me- 


todi e i componenti necessari, ma non vi è alcuna implementazione dei metodi. Saranno i file 

con estensione “.m” a contenere tutte le implementazioni dei metodi, ovvero il codice delle varie 

funzioni. 

Iniziamo, quindi, aprendo il file “He"oWorldViewContro"er.h”, in cui dovremo definire gli oggetti 

che ci serviranno. Nel nostro esempio, saranno due gli elementi da definire: la UITextField in 

cui l’utente inserisce il proprio nome (e da cui noi dobbiamo leggerne il valore), e la UILabel in 

cui scriveremo il saluto. Dovremo, poi, definire un’azione, quella che verrà richiamata alla pressione 

del bottone. 

Ecco il codice da inserire: 

1 

2 

3 

4 

5 

6 

7 

8 

9 

10 

11 

12 

13 

14 

#import 

@interface HelloWorldViewController : UIViewController { 

! IBOutlet UITextField *fieldNome; 

! IBOutlet UILabel *labelSaluto; 

} 

-(IBAction)saluta; 

@property (nonatomic, retain) IBOutlet UITextField *fieldNome; 

@property (nonatomic, retain) IBOutlet UILabel *labelSaluto; 

@end 

Abbiamo dichiarato una UITextField e una UILabel, proprio i due componenti che ci servono. 

Possiamo notare che entrambe le dichiarazioni sono precedute dalla clausola “IBOutlet”, che 

indica ad Interface Builder che è possibile collegare questo metodo ad un elemento grafico. 

Questo è necessario perché, come vedrete fra poco, ci permetterà di collegare l’oggetto creato 

tramite Interface Builder con quello dichiarato in XCode. 

Dopo queste due dichiarazioni, trovate l’intestazione del metodo “saluta”, e anche in questo 

caso trovate una clausola ”IBAction”: anche questa sta a significare che l’azione è collegata ad 

un componente di Interface Builder. 

Le due property, poi, servono per poter utilizzare senza problemi le proprietà degli oggetti che 

abbiamo definito. 

Ora salviamo il file (Cmd + S) e riapriamo “HelloWorldViewController.xib”. Dobbiamo collegare 

questi componenti con quelli effettivamente inseriti nella nostra vista. 

Dal pannello dei documenti selezionate il componente “File’s Owner”. Aprendo il “Connections 

Inspector” dovreste vedere un pannello come questo: 


Potete notare che sono presenti i componenti che abbiamo definito via codice! Ora non dobbiamo 

fare altro che collegarli agli elementi adeguati. Prendiamo il pallino a fianco di “fieldNome” 

e trasciniamolo fino alla UITextField della nostra vista. Avremo così 

collegato i due elementi! Ripetiamo la stessa operazione con “labelSaluto”, 

trascinando il pallino sulla UILabel posta a centro schermo. 

Stessa operazione va eseguita per l’azione “saluta”. Collegatela al bottone, ma 

quando rilasciate il bottone del mouse vi apparirà un menù come quello che 

trovate qui a fianco. 

Sono tutte le azioni che può gestire un bottone. Noi selezioniamo “Touch 

Up Inside”, ovvero un azione di click e rialscio (un singolo tap insomma). 

Volendo potremmo scegliere di avviare l’azione quando il bottone viene rilasciato, 

ma per il nostro scopo non cambia niente. 

Se avete eseguito tutto correttamente avrete un pannello “Connections Inspector” come questo: 

Abbiamo così concluso la definizione dei componenti della nostra applicazione. Salviamo tutto 

e chiudiamo Interface Builder. 


SCRIVIAMO IL CODICE NECESSARIO 

Dobbiamo ora implementare il metodo “saluta”, che si occuperà di leggere il nome inserito dall’utente 

e stampare il messaggio di benvenuto sulla label predisposta. 

Apriamo il file “HelloWorldViewController.m” e inseriamo il seguente codice: 

1 

2 

3 

4 

5 

6 

7 

8 

9 

10 

11 

12 

13 

14 

15 

16 

17 

18 

19 

20 

21 

22 

23 

24 

25 

26 

27 

#import "HelloWorldViewController.h" 

@implementation HelloWorldViewController 

// importiamo i componenti di cui abbiamo definito le property 

@synthesize fieldNome, labelSaluto; 

// azione richiamata alla pressione del bottone 

-(IBAction)saluta{ 

! // leggiamo la stringa contenuta nella UITextField (il nome dell'utente) 

! NSString *nome = fieldNome.text; 

! 

! if ([nome length] == 0){ 

! ! // l'utente non ha inserito nessun nome 

! ! labelSaluto.text = [[NSString alloc] 

initWithFormat:@"Ciao anonimo!"]; 

! }else{ 

! ! // salutiamo l'utente 

! ! labelSaluto.text = [[NSString alloc] 

initWithFormat:@"Ciao %@",nome]; 

! } 

} 

- (void)dealloc { 

! [labelSaluto dealloc]; 

! [fieldNome dealloc]; 

! 

[super dealloc]; 

} 

Analizziamo il codice poco alla volta. L’istruzione presente alla riga 3 che ha il compito di caricare 

gli elementi di cui prima abbiamo definito le “property”. Potrebbe sembrare un po’ strana, 

ma per ora prendetela come regola. 

Dalla riga 9 alla 20 troviamo la definizione del metodo “saluta”. In tale metodo, non facciamo 

altro che leggere il nome inserito dall’utente (tramite “fieldNome.text”, che ci restituisce la 

stringa contenuta nella UITextField) e assegnarlo alla variabile “nome” (riga 11). Tramite una 

costrutto “if” (dalla riga 13 alla 19) andiamo poi a controllare se tale stringa è vuota (e quindi 

l’utente ha premuto il tasto senza inserire nessun nome) oppure se vi è un valore. Ovviamente 

inseriamo due messaggi di saluto diversi a seconda del caso. 

Particolare attenzione merita parte dell’istruzione alla riga 18, ed in particolare questo pezzo di 

codice: “@"Ciao %@",nome”. 


• “@”, la prima chiocciola sta ad indicare che ciò che segue è una stringa. La sintassi è sempre 

la stessa, è può essere schematizzata nel seguente modo: @”stringa_desiderata”. Dovrete 

sempre utilizzare questo formato quando istanziate una stringa. 

• “%@”, quando trovate un % in una stringa, significa che li ci andrà il valore di una determinata 

variabile. Non a caso dopo la stringa trovare la variabile “nome”: il contenuto di tale 

variabile nome andrà inserito al posto di %@. Se avessimo dovuto inserire il valore di una 

variabile di tipo float avremmo usato la sintassi %f. Vedremo parecchi esempi nei prossimi 

tutorial. 

Il metodo “dealloc”, infine, è quello che si occupa di liberare la memoria che abbiamo utilizzato. 

L’Objective-C, infatti, non prevede un gestore della memoria come avviene invece in Java 

(tramite il Garbage Collector). Sarà compito degli sviluppatori, quindi, liberare la memoria dagli 

oggetti che non servono più. In questo metodo dovrete sempre inserire i componenti che 

avete utilizzato, richiamando per ognuno il metodo “dealloc”. Nell’esempio potete vedere che 

liberiamo dalla memoria gli oggetti “labelSaluto” e “fieldNome”. 

Possiamo ora cliccare su “Build and Go!”, se non abbiamo commesso errori nell’inserire il codice 

si avvierà l’iPhone Simulator e potremo testare il nostro programma! 

FACCIAMO NASCONDERE LA TASTIERA 

Se provate ad inserire un nome e a premere il tasto “Invio” della tastiera che appare sull’iPhone, 

noterete che essa non si chiude. Si tratta di un bug? La risposta è no. È normale, in quanto 

non abbiamo implementato niente che chiuda tale tastiera. 

Per sistemare questo problema, apriamo il file “HelloWorldViewController.h” e modifichiamo 

l’intestazione nella seguente maniera: 

1 @interface HelloWorldViewController : UIViewController { 

Potete notare che abbiamo aggiunto ““, ovvero la nostra classe deve 

implementare il delegato della classe UITextField. Parleremo più avanti di cosa siano i delegati, 

per ora sappiate che sono dei comportamenti comuni a delle classi di oggetti. 

Fatto ciò, andiamo nel file “HelloWorldViewController.m” e inseriamo, in un qualsiasi punto, 

questo metodo: 

1 

2 

3 

4 

-(BOOL)textFieldShouldReturn:(UITextField *)textField{ 

! [textField resignFirstResponder]; 

! return YES; 

} 

Questo metodo si occuperà della chiusura della nostra tastiera. Non soffermiamoci sul codice, 

in quanto è così in qualsiasi occasione voi vogliate implementarlo. Salvate entrambi i file e aprite 

“HelloWorldViewController.xib”. Cliccate sulla UITextField e aprite il “Connections Inspector”: 

vedrete nella sezione “Outlets” un elemento chiamato “delegate”, prendete il pallino e 


trascinatelo sul “File’s Owner” nel pannello dei documenti. Se avrete eseguito correttamente 

questa operazione il vostro pannello sarà come questo: 

In pratica, abbiamo detto che il delegato di tale oggetto è gestito dalla classe “HelloWorld- 

ViewController”. 

Salvate ora il tutto e chiudete Interface Builder. Provate poi ad eseguire la vostra applicazione, 

tutto funzionerà in maniera corretta! 

Avete così creato la vostra prima applicazione funzionante per iPhone! 


Capitolo 4: TrashApp, gestiamo le immagini 

In questo secondo tutorial, inizieremo a prendere confidenza con un aspetto molto importante: 

la gestione delle immagini, e come l’utente può interagire con esse. Andremo a creare, infatti, 

un finto cestino, in cui potremo trascinare un’immagine e ripristinarla tramite un apposito 

pulsante. 

DEFINIAMO L’APPLICAZIONE 

Creiamo un nuovo progetto di tipo “View-Based Application” e chiamiamolo “TrashApp”. A 

differenza del tutorial precedente, questa volta creeremo tutto tramite Interface Builder, metodo 

sicuramente più veloce e comodo per applicazioni non troppo complesse. 

Prima di fare qualsiasi cosa, inseriamo nel nostro progetto le immagini che ci serviranno. Io 

utilizzerò le seguenti immagini: due per il cestino, e una per il documento da “eliminare” (potete 

trovare queste immagini nel file di progetto dell’esempio): 

TrashIconEmpty.png TrashIconFu".png windows icon.png 

Trascinate le immagini nel progetto in XCode, e nel pop-up che vi apparirà mettere la spunta a 

“Copy items into destination group’s folder (if needed)”. Noterete ora le immagini all’interno del progetto: 

Prima di definire la struttura grafica della nostra applicazione, andiamo a definire i componenti 

che poi ci serviranno. Apriamo il file “TrashAppViewController.h” e inseriamo le seguenti definizioni: 


1 

2 

3 

4 

5 

6 

7 

8 

9 

10 

#import 

@interface TrashAppViewController : UIViewController { 

! IBOutlet UIImageView *imageCestino; 

! IBOutlet UIImageView *imageLogo; 

} 

-(IBAction)ripristina; 

@end 

Abbiamo definito gli elementi necessari: alle righe 4 e 5 due UIImageView, che conterranno il 

cestino (pieno o vuoto a seconda del caso) e il logo da eliminare. Alla riga 8, infine, abbiamo 

definito l’azione che ci permetterà di ripristinare il logo dopo la sua eliminazione. 

DEFINIAMO L’ASPETTO GRAFICO. 

Procediamo, quindi, con la creazione della struttura grafica della nostra applicazione. Salvate il 

file “TrashAppViewController.h” appena modificato e aprite poi 

“TrashAppViewController.xib”, che avvierà Interface Builder. 

La finestra è per ora semplice e si presenterà così: 


Inseriamo, per prima cosa, gli elementi necessari: due componenti UIImageView e un UIButton. 

Attenzione: la prima UIImageView che inserite deve essere quella in basso, altrimenti 

avrete problemi nelle fasi successive! Ecco come si presenterà la vostra applicazione: 

Ora dobbiamo collegare i vari componenti alle immagini che abbiamo inserito all’inizio del 

progetto. Clicchiamo sul primo componente UIImageView (quello più in alto, ma il secondo 

che avete inserito!) e apriamo il pannello “Attributes Inspector”. Nel menù a tendina “Image” 

selezioniamo il file “windows icon.png” e lo vedremo comparire anche nell’applicazione. Spuntiamo, 

inoltre, la casella “User Interaction Enabled”. Avremo un pannello così impostato: 


Facciamo la stessa cosa per la UIImageView sottostante, selezionando come immagine 

“TrashIconEmpty.png”, ma senza spuntare “User Interaction Enabled”. Inseriamo all’interno 

del bottone la scritta “Ripristina logo”, aggiustiamo le dimensioni e la posizione delle due immagini 

(in modo che i bordi delle UIImageView coincidano con le immagini al loro interno) 

fino ad avere un risultato come questo: 

Ora non dobbiamo fare alto che collegare gli elementi che abbiamo definito all’inizio di questo 

tutorial con i componenti all’interno della nostra applicazione. 

Dal Pannello dei Documenti selezioniamo il “File’s Owner”: 


Ora apriamo il “Connections Inspector”, dovremmo vedere i seguenti elementi: 

Prendiamo il pallino che troviamo a fianco di “imageLogo” e trasciniamolo sul logo di Windows, 

mentre quello di “imageCestino” sull’immagine del cestino. 

Colleghiamo, infine, l’azione: proprio come nello scorso tutorial, colleghiamo il pallino dell’azione 

“ripristina:” sul bottone, e nel menù che appare selezioniamo “Touch Up Inside”. Se 

abbiamo eseguito tutto in maniera corretta avremo un pannello come il seguente: 

Abbiamo concluso questa fase del tutorial. Salviamo tutto e chiudiamo pure Interface Builder. 

IMPLEMENTIAMO IL MOVIMENTO DEL LOGO 

Iniziamo aprendo il file “TrashAppViewController.h” e dichiarando un paio di elementi che ci 

serviranno: 


1 

2 

3 

4 

5 

6 

7 

8 

9 

10 

11 

#import 

@interface TrashAppViewController : UIViewController { 

! IBOutlet UIImageView *imageCestino; 

! IBOutlet UIImageView *imageLogo; 

! 

! BOOL cancellato; 

} 

-(IBAction)ripristina; 

-(void)cancella; 

Alla riga 7 abbiamo aggiunto una variabile che ci servirà per controllare se il nostro oggetto è 

già stato eliminato (quindi, al valore YES corrisponderà il logo eliminato, con NO il nostro logo 

sarà ancora visibile); lo stesso vale per il metodo “cancella”, che si occuperà invece dell’animazione 

legata all’eliminazione del logo. 

Ora iniziamo ad implementare i metodi necessari. Apriamo il file “TrashAppViewController.m” 

e inseriamo il seguente codice: 

1 

2 

3 

4 

5 

6 

7 

8 

9 

10 

11 

12 

13 

14 

15 

16 

17 

18 

19 

20 

21 

22 

23 

24 

25 

26 

- (void)touchesMoved:(NSSet *)touches withEvent:(UIEvent *)event { 

! UITouch *touch = [[event allTouches] anyObject]; 

! if ([touch view] == imageLogo) { 

! ! imageLogo.center = [touch locationInView:self.view];! 

! }! ! 

} 

- (void)touchesEnded:(NSSet *)touches withEvent:(UIEvent *)event { 

! if (CGRectIntersectsRect([imageCestino frame], [imageLogo 

frame])){ 

! ! imageCestino.image = [UIImage 

imageNamed:@"TrashIconFull.png"]; 

! ! [self cancella]; 

! } else{ 

! ! [UIView beginAnimations:nil context:NULL]; 

! ! [UIView setAnimationDuration:0.5]; 

! ! imageLogo.center=CGPointMake(155.0,100.0); 

! ! [UIView commitAnimations]; 

! } 

} 

- (void)cancella{ 

! cancellato = YES; 

! [UIView beginAnimations:nil context:NULL]; 

! [UIView setAnimationDuration:0.5]; 

! imageLogo.transform = CGAffineTransformMakeScale(.001, .001); 

! [UIView commitAnimations]; 

} 


Abbiamo definito tre metodi, che si occuperanno del movimento del logo di Windows e della 

sua cancellazione. vediamoli nel dettaglio: 

• touchesMoved, (dalla riga 1 alla 6) In questo metodo, salviamo nella variabile “touch” 

l’evento che l’utente compie toccando un qualsiasi oggetto della nostra applicazione (riga 

2). Controlliamo, poi, che l’oggetto toccato corrisponda a “imageLogo” (riga 3), cioè al logo 

di Windows: se l’oggetto è proprio quello, teniamo traccia del centro dell’oggetto (che nel 

frattempo viene mosso dall’utente) con la posizione del dito sullo schermo (riga 4). Ovvero, 

è come se spostassimo fisicamente l’oggetto con il nostro dito e lo muovessimo su un piano. 

• touchesEnded, (dalla riga 8 alla 18) In questo metodo diciamo semplicemente che se il 

frame di “imageLogo” (ovvero il logo di Windows) interseca il frame del cestino (riga 9), 

deve essere chiamato il metodo “cancella”, che si occuperà dell’animazione della cancellazione 

(riga 11). Prima di chiamare tale metodo, inoltre, cambiamo l’immagine del cestino 

vuoto con quella del cestino pieno (riga 10). Se il logo, invece, non è stato spostato sopra il 

cestino, eseguiamo una semplice animazione, che riporta l’immagine al centro della vista 

(dalla riga 13 alla 16). 

• cancella, (dalla riga 20 alla 26) In questo metodo definiamo l’animazione che avrà il logo di 

Windows quando verrà sposato sopra il cestino. Alla riga 21 cambiamo il valore della variabile 

“cancella”, in modo da sapere che il logo è stato eliminato. Alla riga 22 definiamo il 

punto di partenza della nostra animazione, mentre con l’istruzione successiva ne definiamo 

la durata. La riga 24 è l’animazione vera e propria, che farà scomparire il logo. Con l’ultima 

istruzione definiamo la fine dell’animazione. 

IL RIPRISTINO DEL LOGO 

Abbiamo quasi terminato la nostra applicazione, manca solo la definizione dell’azione “ripristina:”. 

Tale metodo è già stato definito da Interface Builder, quindi noi dobbiamo solo scrivere il 

codice al suo interno. Ecco le istruzioni da inserire: 

1 

2 

3 

4 

5 

6 

7 

8 

9 

10 

11 

- (IBAction)ripristina{ 

! if (cancellato) { 

! ! [UIView beginAnimations:nil context:NULL]; 

! ! [UIView setAnimationDuration:0.5]; 

! ! imageLogo.transform = CGAffineTransformIdentity; 

! ! imageCestino.image = [UIImage 

imageNamed:@"TrashIconEmpty.png"]; 

! ! imageLogo.center = CGPointMake(155.0, 100.0); 

! ! [UIView commitAnimations]; 

! ! cancellato = NO; 

! } 

} 

Questo metodo è speculare a “cancella”, in quanto dobbiamo eseguire l’animazione inversa! 

Andremo, quindi, ad eseguire un’animazione, che porterà il logo dal cestino (in cui si trova) alla 

posizione originale (o quasi, in quanto è definita in modo arbitrario da noi, alla riga 7). 


Clicchiamo ora su “Build and Go!”, e testiamo la nostra applicazione funzionante! 

Nota: se non avete l’animazione, controllate che il logo di Windows non si nasconda dietro il 

cestino. Se così fosse, non avete seguito quello che vi ho detto nella costruzione dell’Interfaccia!! 

Ma non disperate, vi basterà entrare in Interface Builder, selezionare la UIImageView con 

il logo di Windows e dal menù “Layout” cliccare su “Send Forward” (in alternativa dovete 

scambiare l’ordine dei due componenti, ovviamente invertendo anche le immagini e le proprietà 

associate). 


Capitolo 5: UIToolbar e auto-rotazione 

In questo terzo tutorial, analizzeremo un componente molto importante, la UIToolbar, e una 

funzionalità molto gradita agli utenti, l’auto-rotazione. 

Non creeremo nessuna applicazione complicata, semplicemente avremo due pulsanti nella 

toolbar che modificheranno il valore di una label posta al centro dello schermo. L’auto-rotazione, 

infine, aggiungerà un tocco più professionale alla nostra applicazione. 


Come sempre, la prima cosa che faremo è definire un nuovo progetto. Creiamo un nuovo progetto 

di tipo “View-Based Application” e chiamiamolo “CountRotateApp”. Procediamo proprio 

come abbiamo fatto nello scorso tutorial, quindi apriamo il file 

“CountRotateAppViewController.h” e inseriamo le seguenti dichiarazioni: 

1 

2 

3 

4 

5 

6 

7 

8 

9 

10 

#import 

@interface CountRotateAppViewController : UIViewController { 

! IBOutlet UILabel *labelNumero; 

} 

-(IBAction)aggiungi; 

-(IBAction)sottrai; 

@end 

Abbiamo definito una label, che ospiterà un numero, che sarà incrementato o decrementato in 

base al pulsante che verrà premuto (ovviamente saranno le azioni “aggiungi” e “sottrai” che si 

occuperanno di questo compito). 

Salviamo il file appena modificato e facciamo doppio clic su 

“CountRotateAppViewController.xib”, in cui andremo a definire l’aspetto della nostra applicazione. 

DEFINIAMO L’ASPETTO GRAFICO 

Iniziamo inserendo nella parte bassa della vista una UIToolbar, con due UIBarButtonItem: in 

uno scrivete “-”, nell’altro “+”. Noterete che i due bottoni sono quasi attaccati. Noi vogliamo 

che siano ai due estremi, quindi tra di essi inseriamo un “Flexible Space Bar Button Item”, in 

modo che restino sempre separati. Ecco come si presenterà la vostra toolbar: 

Questo spazio flessibile ha una grossa utilità: non solo ci separa i due bottoni, ma ci permette 

di non doverci occupare della giusta distanza tra essi, anche nel caso che ne aggiungessimo un 


terzo. Inoltre esso ci permette di tenere i due bottoni alle estremità della barra anche nel caso 

in cui ruotassimo la nostra applicazione. Come facciamo a testarlo? Semplice. Cliccate sulla 

freccia presente nel titolo della finestra della nostra applicazione: 

Vedrete che la schermata ruoterà! 

E come possiamo notare i due bottoni restano agli estremi della nostra barra. Proprio il risultato 

che volevamo! 

Riportiamo la finestra alla sua posizione originale, e inseriamo al centro una UILabel, partendo 

da un angolo in alto a sinistra, per poi ingrandirla fino all’angolo opposto. Nell’Attribute Inspector 

settate i seguenti parametri: 

• “Text”: 0 (zero); 

• A"ineamento centrale; 

• “Font Size”: 200 

Dovreste avere il seguente risultato: 


Proviamo ora a far ruotare la schermata come abbiamo fatto poco fa. Noteremo che lo zero 

non rimane in posizione centrale, ma addirittura viene per metà nascosto. Come facciamo a 

lasciarlo centrato? Anche qui ci viene in aiuto l’Interface Builder, che offre grandi potenzialità 

anche in questo aspetto. 

Selezioniamo la label che contiene lo zero e apriamo il “Size Inspector”. Nella seconda parte 

possiamo vedere che vi è una sezione denominata “Autosizing”. Clicchiamo sulle due freccette 

rosse che vediamo nel riquadro piccolo, in modo da avere questo schema: 

Proviamo ora a ruotare la nostra applicazione: lo zero resterà perfettamente in posizione centrale! 

Ora che abbiamo definito la struttura grafica dell’applicazione, non ci resta altro che collegare 

l’elemento e le due azioni che abbiamo definito all’inizio del tutorial. 

Dal Pannello dei Documenti selezioniamo il File’s Owner e spostiamoci poi nel “Controller 

Connections” (come abbiamo già fatto nel capitolo 4). Dovete avere un pannello come questo: 


Colleghiamo “labelNumero” con l’unica label presente al centro della vista, e le due azioni ai 

rispettivi bottoni (al bottone “+” l’azione “aggiungi”, mentre al bottone “-” l’azione “sottrai”). 

Se avete eseguito tutto in maniera corretta avrete questo risultato: 

Salviamo tutto e chiudiamo Interface Builder. 


Prima di iniziare ad implementare i metodi che abbiamo già definito, aggiungete questa variabile 

al file “CountRotateAppViewController.h”: 

1 

2 

3 

4 

@interface CountRotateAppViewController : UIViewController { 

! IBOutlet UILabel *labelNumero; 

! int numero; 

} 

Semplicemente, abbiamo definito una variabile intera alla riga 3, di nome “numero”, che conterrà 

il valore mostrato dalla label. 

Passiamo, quindi, al file “CountRotateAppViewController.m”. 

Iniziamo con questo semplice metodo (dovreste trovarlo già presente nella classe, vi basterà 

eliminare i commenti che lo rendono nascosto): 


1 

2 

3 

4 

- (void)viewDidLoad { 

! [super viewDidLoad]; 

! numero = 0; 

} 

Questo metodo viene richiamato sempre all’avvio del file “.xib” associato alla classe (i file “.xib” 

sono quelli creati da InterfaceBuilder). In questo metodo possiamo inizializzare tutti i componenti 

che ci serviranno. Qui, in pratica, dobbiamo inserire tutte quelle operazioni che vogliamo 

vengano eseguite all’avvio dell’applicazione. Nel nostro esempio, vogliamo che la variabile 

“numero” sia impostata a zero. Prendete confidenza con tale metodo perchè lo incontrerete 

spesso nei prossimo tutorial. 

Aggiungiamo, ora, le implementazioni per i due metodi che si occupano di aumentare e diminuire 

il valore della variabile “numero”: 

1 

2 

3 

4 

5 

6 

7 

8 

9 

- (IBAction)aggiungi { 

! numero++; 

! labelNumero.text = [[NSString alloc] 

initWithFormat:@"%i",numero]; 

} 

- (IBAction)sottrai { 

numero--; 

! labelNumero.text = [[NSString alloc] 

initWithFormat:@"%i",numero]; 

} 

Questo due metodi non eseguono niente di complesso, si limitano a incrementare (o decrementare) 

la variabile “numero”, per poi visualizzarla nella label. Semplice vero? 

L’ultima cosa da implementare è la rotazione della vista. Sempre nel file 

“CountRotateAppViewController.m” cercate e decommentate il seguente metodo (è già presente, 

vi basterà decommentarlo e modificare l’istruzione alla riga 3): 

1 

2 

3 

4 

-(BOOL)shouldAutorotateToInterfaceOrientation:(UIInterfaceOrientatio 

n)interfaceOrientation { 

// Return YES for supported orientations 

return YES; 

} 

Questo è un metodo della classe “UIViewController”, che implementa già la rotazione automatica 

dello schermo. Ancora una volta non dovremo fare veramente niente, in quanto sono le 

librerie del SDK a fornirci tutti pronto. 

Piccola nota: se non volessimo implementare l’auto-rotazione, ci basterebbe ritornare come 

valore “NO”, oppure semplicemente non inserire il metodo nell’applicazione. 


Clicchiamo ora su “Build and Go!” e testiamo la nostra applicazione! 


Capitolo: 6: NSTimer e UIProgressView 

Proseguiamo la panoramica sui componenti più utilizzati nella creazione di applicazioni per 

iPhone. In questo capitolo vedremo come utilizzare la classe NSTimer, ovvero un temporizzatore, 

che ci permetterà di eseguire animazioni e transizioni con durate predefinite. Utilizzeremo, 

inoltre, la UIProgressView, ovvero la barra di progresso, necessaria quando si deve mostrare 

un caricamento. 

Quella che andremo a creare sarà una semplice applicazione, che permetterà all’utente di cambiare 

il colore dello sfondo, semplicemente cliccando su un bottone. Il cambio del colore, inoltre, 

avverrà in maniera graduale tramite un’animazione della durata di 10 secondi. 


Come sempre, iniziamo creando un progetto di tipo “View-Based Application” e chiamiamolo 

“ProgressColour”. 

Apriamo il file “ProgressColourViewController.h” e definiamo i seguenti componenti: 

1 

2 

3 

4 

5 

6 

7 

8 

9 

10 

11 

12 

13 

#import 

@interface ProgressColourViewController : UIViewController { 

! IBOutlet UILabel *progressLabel; 

! IBOutlet UIProgressView *progressBar; 

! 

! IBOutlet UIButton *bottoneBlu; 

! IBOutlet UIButton *bottoneRosso; 

} 

- (IBAction)caricamentoColore:(id)bottone; 

@end 

La label definita alla riga 4 servirà per mostrare un messaggio all’utente sul grado di completamento 

dell’animazione, mentre la UIProgressBar darà la stessa informazioni ma in maniera più 

visiva (è una classica barra di caricamento). Abbiamo, inoltre, dichiarato anche due bottoni 

UIButton: vedremo, poi, il perchè di questa dichiarazione. 

L’azione alla riga 11 verrà associata ad entrambi i bottoni, infatti sarà questo metodo ad avviare 

il cambio di colore dello sfondo. Nell’intestazione di questo metodo c’è anche un parametro 

“bottone” di tipo “id”: questo ci servirà per determinare quale bottone ha invocato il metodo, 

in modo da poter caricare il colore scelto dall’utente. 

Possiamo ora iniziare a definire l’aspetto grafico dell’applicazione, aprendo il file 

“ProgressColourViewController.xib”. 


DEFINIAMO L’ASPETTO GRAFICO 

Inseriamo nella nostra vista i primi due componenti necessari: una UILabel e una UIProgressView. 

Ricreate una disposizione simile a questa (ovviamente nessuno vi vieta di personalizzarla 

a vostro piacimento): 

Come potete notare la label e la barra di progresso occupano quasi per intero la larghezza della 

vista, questo per rendere più evidente ciò che avviene. 

Selezioniamo la label e apriamo “Attributes Inspector”, per modificare alcune proprietà: 

• cancellate il contenuto del campo “Text”; 

• “Font Size”: 20 

• allineamento centrale. 

Selezioniamo ora la UIProgressView e, sempre in “Attributes Inspector”, impostiamo il valore 

della casella “Progress” a zero. 

Inseriamo ora nella vista due bottoni, in modo da avere un risultato finale come questo: 


Abbiamo già concluso la creazione della parte grafica della nostra applicazione. Non ci resta 

che collegare i componenti che abbiamo definito ad inizio tutorial. 

Dal Pannello dei Documenti selezioniamo, come sempre, il “File’s Owner” e apriamo il “Connections 

Inspector”. Dovreste avere un pannello così composto: 

Colleghiamo l’elemento “progressLabel” con la label vuota presente sopra la barra, e “progressBar” 

con la barra stessa. Colleghiamo anche gli elementi “bottoneBlu” e “bottoneRosso” 

con i due relativi pulsanti. Colleghiamo, infine, l’azione “caricamentoColore” con entrambi i 

bottoni, selezionando “Touch Up Inside” dal menù a tendina che si presenta. Se avete eseguito 

tutto in maniera corretta dovreste avere questo risultato: 


Abbiamo così terminato questa fase. Salviamo e chiudiamo Interface Builder. 

SCRIVIAMO IL CODICE 

Dobbiamo definire due elementi e un paio di metodi che non abbiamo scritto inizialmente. 

Apriamo il file “ProgressColourViewController.h” e inserite le dichiarazioni mancanti: 

1 

2 

3 

4 

5 

6 

7 

8 

9 

10 

11 

12 

13 

14 

15 

16 

17 

18 

19 

20 

21 

#import 

@interface ProgressColourViewController : UIViewController { 

! IBOutlet UILabel *progressLabel; 

! IBOutlet UIProgressView *progressBar; 

! 

! IBOutlet UIButton *bottoneBlu; 

! IBOutlet UIButton *bottoneRosso; 

! 

! NSTimer *timer; 

! UIColor *colore; 

} 

@property (nonatomic, retain) NSTimer *timer; 

@property (nonatomic, retain) UIColor *colore; 

- (IBAction)caricamentoColore:(id)bottone; 

- (void)aggiornaColore ; 

- (void)applicaColore ; 

@end 

Abbiamo definito un componente “NSTimer” (alla riga 10), che sarà il temporizzatore che ci 

permetterà di eseguire l’animazione prevista. Nella riga successiva è definito un elemento UI- 

Color, che servirà per tener traccia del colore che deve essere applicato allo sfondo. 


Sono stati dichiarati, inoltre, due nuovi metodi, che ci serviranno per implementare le azioni 

necessarie (righe 18 e 19). 

Passiamo ora al file “ProgressColourViewController.m” e iniziamo ad implementare i metodi 

necessari. Inseriamo il seguente codice: 

1 

2 

3 

4 

5 

6 

7 

8 

9 

10 

11 

12 

13 

14 

15 

16 

17 

18 

19 

#import "ProgressColourViewController.h" 

@implementation ProgressColourViewController 

@synthesize timer; 

@synthesize colore; 

- (IBAction)caricamentoColore:(id)bottone { 

! progressBar.progress = 0.0; 

! if (bottone == bottoneBlu){ 

! ! progressLabel.text = @"Caricamento colore blu..."; 

! ! colore = [UIColor blueColor]; 

! }else if (bottone == bottoneRosso) { 

! ! progressLabel.text = @"Caricamento colore rosso..."; 

! ! colore = [UIColor redColor]; 

! } 

! timer = [NSTimer scheduledTimerWithTimeInterval:1.0 target:self 

selector:@selector(aggiornaColore) userInfo:nil repeats:YES]; 

} 

Questo metodo si occupa di avviare il caricamento del colore scelto dall’utente. Alla riga 9 viene 

settato il valore di progresso della barra a zero (tale valore di default va da 0.0 a 1.0, ma questo 

intervallo può essere modificato a piacere). Troviamo, poi, un controllo sul bottone che ha 

invocato il metodo (riga 10): se il bottone premuto dall’utente è quello per il colore blu, impostiamo 

la label indicando che viene caricato il blu, e assegniamo alla variabile “colore” il valore 

“[UIColor blueColor]”. Questo è un elemento predefinito della classe UIColor, che ci permette 

di utilizzare colori standard in maniera semplice e veloce. Nello stesso modo lavora la clausola 

“else if”, ovviamente controllando se il bottone premuto è quello per il colore rosso. 

Alla riga 17, infine, viene definita la variabile timer, istanziandola con la classe NSTimer. Ci sono 

tre parametri molto importanti in questa funzione: la durata di 1 secondo (alla clausola 

“scheduledTimerWithTimeInterval”), il metodo che deve essere eseguito ad ogni ripetizione 

(clausola “@selector()”) e la ripetizione continua di tale intervallo di tempo (impostata tramite 

“repeats:YES“). 


Proseguiamo con la definizione dei metodi: 

1 

2 

3 

4 

5 

6 

7 

8 

9 

10 

11 

- (void)aggiornaColore { 

! progressBar.progress = progressBar.progress + 0.1; 

! if (progressBar.progress == 0.5){ 

! ! progressLabel.text = @"Applicando colore…"; 

! ! [self applicaColore]; 

! } 

! if (progressBar.progress == 1.0){ 

! ! progressLabel.text = @"Colore applicato!"; 

! ! [timer invalidate]; 

! } 

} 

Alla riga 2 incrementiamo il valore della nostra barra di progresso, aumentandone il valore del 

10%. Alla riga 3 troviamo un controllo if, che verifica se il valore della barra è 0.5 (ovvero siamo 

a metà): in caso affermativo, cambiamo il testo presente nella label, altrimenti lasciamo tutto 

invariato. Anche alla riga 7 un ciclo if controlla se la barra di progresso è arrivata al suo valore 

massimo: in tal caso inseriamo un nuovo testo nella label, e fermiamo il timer (con l’istruzione 

alla riga 9). 

Nel primo ciclo if che abbiamo esaminato, notiamo che alla riga 5 viene richiamato il metodo 

“applicaColore”: tale metodo avrà il compito di cambiare il colore allo sfondo della vista, con 

un’animazione che dovrà durare 5 secondi (infatti siamo al 50% del progresso, e la barra avanza 

del 10% ogni secondo). Ecco tale metodo: 

1 

2 

3 

4 

5 

6 

- (void)applicaColore { 

! [UIView beginAnimations:nil context:NULL]; 

! [UIView setAnimationDuration:5.0]; 

! self.view.backgroundColor = colore; 

! [UIView commitAnimations]; 

} 

In questi due metodi viene definita l’animazione che permette allo sfondo della nostra vista di 

cambiare colore. L’animazione rispecchia molto quella illustrata in un capitolo precedente. 

Alla riga 3 definiamo la durata di tale animazione (5 secondi); l’istruzione successiva è il risultato 

che vogliamo ottenere, ovvero il nostro colore di sfondo. Chiude il gruppo di istruzioni la 

riga 5, che avvia l’animazione. 

Clicchiamo su “Build and Go!” e testiamo la nostra applicazione! 



Capitolo 7: AccessContact, accediamo alla rubrica 

In questo capitolo andremo ad implementare una funzione un po’ particolare, in quanto accederemo 

all’applicazione nativa “Contatti” e ricaveremo le informazioni di un contatto. 

Impareremo ad utilizzare il framework (una sorta di libreria, che ci fornisce delle funzionalità 

già pronte) “AddressBook” e come sfruttare le funzioni che ci mette a disposizione. 

DEFINIAMO IL PROGETTO 

Iniziamo creando un progetto del tipo “View-Based Application” e chiamiamolo “AccessContact”. 

Questa volta procederemo come nel primo tutorial, ovvero andremo a definire prima i 

componenti via codice, poi li collegheremo tramite Interface Builder. 

Apriamo il file “AccessContactViewController.h”, che è la classe della vista che ci viene fornita 

con questo template. Inseriamo il seguente codice: 

1 

2 

3 

4 

5 

6 

7 

8 

9 

10 

11 

12 

13 

#import 

#import 

#import 

@interface AccessContactViewController : UIViewController { 

! IBOutlet UILabel *labelNome; 

! IBOutlet UILabel *labelCognome; 

! IBOutlet UILabel *labelTel; 

} 

- (IBAction)getContatto; 

@end 

Ormai siete esperti, e avrete subito capito che abbiamo definito tre label e un’azione. Alle righe 

2 e 3, però, abbiamo importato due librerie, che si riferiscono ad “AddressBook”, ovvero all’applicazione 

“Contatti”. Questo, però, non basta per poter utilizzare tutte le sue funzioni. Dobbiamo 

importare all’interno del nostro progetto anche il framework necessario. 

Espandete la sezione “Targets” nel progetto, e cliccate con il tasto destro su “AccessContact”, 

selezionando poi “Get Info”. Si aprirà una nuova schermata, in cui dobbiamo andare nella sezione 

“General”. Nell’angolo in basso a sinistra noteremo un bottone “+”, clicchiamo e si aprirà 

un elenco di tutti i framework disponibili: 


Selezioniamo “AddressBook.framework” e “AddressBookUI.framework” e clicchiamo poi su 

“Add”. Avremo così aggiunto questi due framework al nostro progetto. Possiamo così chiudere 

la schermata delle proprietà. 

Salviamo il file “AccessContactViewController.h” e facciamo doppio clic su 

“AccessContactViewControlle.xib” per aprire Interface Builder. 

DEFINIAMO LA STRUTTURA GRAFICA 

Dobbiamo ora definire l’aspetto grafico della nostra applicazione. Inseriamo le label necessarie 

e un bottone, per ricreare un aspetto grafico come questo: 


Le label con il testo “---” sono quelle che poi conterranno le informazioni sul contatto selezionato 

dall’utente. Dobbiamo ora collegare gli elementi definiti in precedenza con quelli che abbiamo 

appena inserito nella vista. 

Tramite il pannello dei documenti selezioniamo “File’s Owner”, e apriamo il “Connections Inspector”. 

Potremo vedere i componenti che abbiamo dichiarato: 

Ora dobbiamo collegarli nella maniera corretta, ovviamente in base al nome con cui li abbiamo 

chiamati: “labelNome”, quindi, andrà collegata con la label a fianco di “Nome” e così via. 

L’azione “getContatto”, invece, sarà da collegare al bottone, scegliendo come sempre “Touch 

Up Inside” tra le azioni disponibili. Ecco il risultato finale dei collegamenti: 

Possiamo salvare tutto e chiudere Interface Builder. 


Dobbiamo ora implementare i metodi necessari per far funzionare l’applicazione. Iniziamo con 

la definizione del metodo “getContatto”, ovvero l’azione collegata alla pressione del bottone. 

Apriamo il file “AccessContactViewController.m” e inseriamo il seguente codice: 


1 

2 

3 

4 

5 

6 

7 

8 

9 

10 

-(IBAction)getContatto { 

! //Crea l’oggetto necessario 

! ABPeoplePickerNavigationController *picker = [[ABPeoplePickerNavigationController 

alloc] init]; 

! //Il delegato dell’oggetto è definito nella classe stessa 

! picker.peoplePickerDelegate = self; 

! //Visualizza l’app Contatti 

! [self presentModalViewController:picker animated:YES]; 

! //Rilascia l’oggetto 

! [picker release]; 

} 

Come si può leggere dai commenti, questo metodo istanzia un oggetto chiamato “picker”, che 

ci permetterà di aprire l’applicazione nativa “Contatti”. Alla riga 5 definiamo il delegato di tale 

oggetto: impostando “self”, comunichiamo che sarà la stessa classe (ovvero “AccessCon- 

tactViewController”) a definire gli altri metodi necessari, che definiremo tra poco. Alla riga 7, 

infine, inseriamo tale oggetto come vista principale della nostra applicazione: l’utente vedrà 

così comparire l’applicazione nativa “Contatti” all’interno della nostra applicazione “AccessContact”. 

Dobbiamo ora implementare i metodi richiesti dal delegato. Ecco il codice da inserire: 

1 

2 

3 

4 

5 

6 

7 

8 

9 

10 

11 

12 

13 

14 

15 

16 

17 

18 

- (BOOL)peoplePickerNavigationController: (ABPeoplePickerNavigation- 

Controller *)peoplePicker 

shouldContinueAfterSelectingPerson:(ABRecordRef)person { 

! //Settiamo il nome 

labelNome.text = (NSString *)ABRecordCopyValue(person, kABPersonFirstNameProperty); 

! //Settiamo il cognome 

labelCognome.text = (NSString *)ABRecordCopyValue(person, 

kABPersonLastNameProperty);! 

! //Settiamo il numero di telefono 

! ABMultiValueRef multi = ABRecordCopyValue(person, kABPersonPhone- 

Property); 

! labelTel.text = (NSString*)ABMultiValueCopyValueAtIndex(multi, 

0); 

! //Rimuove il controller "Contatti" 

[self dismissModalViewControllerAnimated:YES];! 

return NO; 

} 

- 

(void)peoplePickerNavigationControllerDidCancel:(ABPeoplePickerNavig 

ationController *)peoplePicker { 

// facciamo tornare il controller alla vista principale 

! [self dismissModalViewControllerAnimated:YES]; 

} 

Il primo metodo legge le informazioni del contatto selezionato, e le setta nelle apposite label. 

L’unico inconveniente è dato dalle righe 7 e 8, che si occupano della lettura del numero di tele- 


fono: viene letto il primo numero presente (in quanto potrebbero anche esserci più numeri). E 

se non vi fosse nessun numero associato al contatto? In tal caso l’applicazione crasha. Questo 

avviene perché non abbiamo effettuato nessun controllo, ma potete semplicemente risolvere 

questo problema tramite un opportuno ciclo if. 

Il metodo che inizia alla riga 15, infine, si occupa di chiudere l’applicazione “Contatti” quando 

l’utente sceglie di uscire senza selezionare nessun contatto (ovvero quando clicca su “Cancel”). 

Potete notare che l’istruzione di tale metodo è uguale a quella presente alla riga 10, che è uguale 

a sua volta a quella presente alla riga 7 del primo metodo implementato. 

Cliccate su “Build and Go!” e testate la vostra applicazione! 


Capitolo 8: Creiamo un mini browser con le UIWebView 

Una delle caratteristiche principali dell’iPhone è la sua connettività, sia essa tramite WiFi, 3G o 

EDGE. Internet, quindi, ricopre un ruolo fondamentale nell’utilizzo di questo dispositivo. Ecco 

che sorge spesso necessario implementare una sorta di browser nelle nostre applicazioni, per 

poter visualizzare delle pagine web. Anche in questo l’SDK si rivela molto potente, in quanto ci 

mette a disposizione un componente praticamente già pronto: le UIWebView. Questo componente 

è una sorta di “Safari lite”, in quanto ci permette di visualizzare pagine web tramite lo 

stesso motore che è alla base di Safari. 

Nel tutorial vedremo come utilizzare le UIWebView, per realizzare un nostro mini-browser, 

con tre semplici pulsanti: avanti, indietro e ricarica. Certo, non potremo competere con Safari, 

ma potrebbe tornarvi molto utile nei vostri programmi. 


Iniziamo creando un nuovo progetto di tipo “View-Based Application” e chiamiamolo “My- 

Browser”. Prima di definire l’aspetto della nostra applicazione, dichiariamo un componente che 

ci servirà (sarà il componente principale che caricherà le pagine web). 

Apriamo il file “MyBrowserViewController.h” e inseriamo la seguente definizione: 

1 

2 

3 

4 

5 

@interface MyBrowserViewController : UIViewController { 

IBOutlet UIWebView *webView; 

} 

@end 

Salviamo il file e apriamo “MyBrowserViewController.xib” per avviare Interface Builder. 

Il template che abbiamo utilizzato ci fornisce già una vista di base, noi iniziamo inserendo nella 

parte bassa della vista un componente di tipo UIToolbar e tre bottoni (UIBarButtonItem, 

quelli utilizzati nel capitolo 5), separando gli ultimi due tramite un “Flexible Space” (anche questo 

già visto). I primi due bottoni ci serviranno per muoverci tra le pagine visitate (i classici 

“Avanti” e “Indietro”), mentre il terzo servirà a ricaricare la pagina. Ecco come appare la barra 

appena definita: 

Ora dobbiamo inserire la WebView. Dalla libreria scegliamo un componente “UIWebView” e 

inseriamolo nella nostra finestra. Ecco il risultato finale: 


DEFINIAMO I COMPONENTI E COLLEGHIAMO LE AZIONI 

Abbiamo già concluso con la definizione dell’interfaccia grafica. Dobbiamo ora definire i componenti 

che ci serviranno e collegare le relative azioni. Vedrete che si rivelerà tutto molto semplice, 

in quanto troveremo già tutto pronto. 

Iniziamo cliccando sul “File’s Owner” (che troviamo nel Pannello dei documenti). Colleghiamo 

il componente “webView” (che è quello definito all’inizio del tutorial) con la UIWebView che 

abbiamo appena inserito nella nostra applicazione. Se abbiamo eseguito questo passaggio correttamente 

avremo un pannello “Connections Inspector” come questo: 

Dopo aver fatto questo semplice collegamento, andiamo ancora nel Pannello dei documenti ed 

espandiamo il componente View e selezioniamo la UIWebView : 


Andiamo nel “Connections Inspector” e noteremo che ci sono già delle azioni definite (“go- 

Back”, “goForward”, etc.), non dovremo far altro che collegarle con i bottoni adeguati. Ecco le 

associazioni da fare: 

• “goBack” con il bottone “”, ovvero per andare alla pagina successiva (della cronologia); 

• “reload” con il bottone “Ricarica”, per ricaricare la pagina web. 

Se avete eseguito tutto correttamente avrete un risultato come questo: 

Tutto molto semplice e veloce! 

Salviamo tutto e chiudiamo Interface Builder. 


SCRIVIAMO IL CODICE PER APRIRE LA PAGINA DESIDERATA 

Dobbiamo ora inserire il codice che si occupa di caricare la pagina web desiderata e mostrarla 

nella UIWebView. Utilizziamo un metodo che viene caricato all’avvio dell’applicazione, e che ci 

permette di settare i comportamenti iniziali del nostro browser. 

Aprite il file “MyBrowserViewController.m” e inserite il seguente codice: 

1 

2 

3 

4 

5 

6 

7 

8 

9 

- (void)viewDidLoad{ 

! //indirizzo web da caricare 

! NSString *indirizzo = @"http://www.bubidevs.net"; 

! //crea un oggetto URL 

! NSURL *url = [NSURL URLWithString:indirizzo]; 

! NSURLRequest *requestObj = [NSURLRequest requestWithURL:url]; 

! // visualizza la pagina nella UIWebView 

! [webView loadRequest:requestObj]; 

} 

Come potete vedere si tratta solo di quattro istruzioni! 

Definiamo, alla riga 3, l’indirizzo che vogliamo aprire, mentre alle righe 5 e 6 inizializiamo i 

componenti necessari per poter visualizzare la pagina (non preoccupatevi troppo, sono sempre 

questi da utilizzare). All’istruzione 8, infine, settiamo i componenti che abbiamo appena creato 

nella UIWebView, in modo che venga mostrata la pagina web all’utente. 

E se volessimo caricare dei file HTML che abbiamo in locale? Semplice, modificate così le 

istruzioni alle righe 3 e 5: 

2 

3 

4 

5 

! //indirizzo web da caricare! 

! NSString *indirizzo = [[NSBundle mainBundle] 

pathForResource:@"index" ofType:@"html"]; 

! //crea un oggetto URL 

! NSURL *url = [NSURL fileURLWithPath:indirizzo]; 

in questo modo caricherà il file "index.html" che si deve trovare, però, nella stessa cartella in 

cui viene seguita l’applicazione (quindi dovete prima importarla nel vostro progetto). Semplice 

vero? 

Cliccate su “Build and Go!” e provate il vostro personalissimo browser! 



Capitolo 9: UITableView, gestiamo le tabelle 

Fino ad ora abbiamo analizzato dei componenti base, molto semplici sia da impostare che da 

utilizzare. Il componente più utilizzato, però, è sicuramente quello che gestisce le tabelle, ovvero 

la UITableView. In moltissime applicazioni, infatti, esse vengono utilizzate per mostrare 

delle informazioni all’utente, che può anche interagire con questi dati. 

In questo capitolo vedremo come definire una tabella, come inserire al suo interno dei valori e 

come definire dei comportamenti (ad esempio la cancellazione delle righe), necessari per renderla 

utilizzabile dall’utente. 

Questo capitolo è suddiviso in tre parti: 

1.Creazione e definizione de"a tabe"a; 

2.Inserimento di alcune funzionalità; 

3.Implementazione de"a ricerca. 

Analizzeremo queste parti una alla volta, passo per passo, in modo da comprendere bene ogni 

singola cosa che andremo a realizzare. 

PARTE 1: CREIAMO E DEFINIAMO LA TABELLA 

La prima parte di questo tutorial è dedicata alla creazione della struttura dell’applicazione: ne 

definiremo la grafica, la lista degli elementi da visualizzare e come mostrarli all’interno delle 

celle. Il tutto sarà fatto con la solita semplicità, sfruttando tutte le caratteristiche che XCode e 

l’SDK ci mettono a disposizione, semplificando il nostro lavoro. 

CREIAMO UN NUOVO PROGETTO 

Aprimo Xcode, selezioniamo “File -> New Project”. Nel menù che ci appare selezioniamo “Navigation-based 

Application”, clicchiamo su “Choose…” e immettiamo come nome “tableViewTutorial” 

e fate clic su “Save”. Abbiamo così creato il nostro nuovo progetto. 

Questo template di XCode ci fornisce già una tabella con una barra di navigazione, semplificandoci 

notevolmente il lavoro! 

Nota: questo tutorial funziona con SDK 3.0 e superiori. 

Aprendo il file "RootViewController.xib" con Interface Builder possiamo notare la struttura già 

pronta, non dovremo toccare niente! 


INSERIAMO IL CODICE NECESSARIO 

A differenza di tutti i passaggi che dovevano essere eseguiti fino al SDK 2.x, dovremo solamente 

inserire poche righe di codice per avere la nostra tabella già pronta e funzionante! 

Apriamo il file "RootViewController.h" e inseriamo la dichiarazione del seguente componente: 

1 

2 

3 

4 

5 

6 

7 

@interface RootViewController : UITableViewController { 

! NSMutableArray *lista; 

} 

@property (nonatomic, retain) NSMutableArray *lista; 

@end 

Abbiamo definito un array in cui inseriamo tutti gli elementi che devono poi essere visualizzati 

nella tabella. Notate che abbiamo utilizzato un NSMutableArray, questo perché dovremo avere 

la possibilità di poter modificare gli elementi che lo compongono (analizzeremo meglio questo 

aspetto quando sarà necessario). 

Spostiamoci ora nel file “RootViewController.m” e iniziamo inserendo queste istruzioni: 


1 

2 

3 

4 

5 

6 

7 

8 

9 

10 

11 

12 

13 

14 

15 

16 

17 

#import "RootViewController.h" 

@implementation RootViewController 

@synthesize lista; 


[super viewDidLoad]; 

! 

! self.title = @"Prodotti Apple"; 

! 

! //elementi da visualizzare nella tabella 

! ! lista = [[NSMutableArray alloc] initWithObjects: @"iPhone", 

@"iPod",@"iPod Touch", @"iMac", @"iBook", @"MacBook", @"MacBook 

Pro", @"Mac Pro", @"PowerBook", nil];! 

// Uncomment the following line to display an Edit button in the 

navigation bar for this view controller. 

// self.navigationItem.rightBarButtonItem = self.editButtonItem; 

} 

Analizziamo quello che abbiamo appena scritto. Chi ha già un pochino di esperienza con la 

programmazione per iPhone conoscerà certamente il metodo “viewDidLoad“: questo viene 

eseguito subito dopo il caricamento della vista, e ci permette di settare tutte le variabili e tutti i 

parametri all’avvio. Per prima cosa abbiamo impostato il titolo alla nostra tabella, che apparirà 

nella NavigationBar presente nella vista (riga 10). Subito dopo viene inizializzata la lista (che è 

un oggetto NSMutableArray), inserendoci alcuni elementi (riga 13). 

Per ora non fate caso alle righe 15 e 16, ci saranno utili nella seconda parte del tutorial. 

Ora dobbiamo definire i metodi che si occupano di popolare la tabella. Scorrendo il file 

“RootViewController.m” li troverete già (XCode li inserisce sempre di default), dovete solo 

completarli. Iniziamo definendo i seguenti due: 

1 

2 

3 

4 

5 

6 

7 

8 

9 

- (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView { 

return 1; 

} 

// Setta il numero di righe della tabella . 

- (NSInteger)tableView:(UITableView *)tableView 

numberOfRowsInSection:(NSInteger)section { 

return [lista count]; 

} 

Il primo metodo che incontriamo è “numberOfSectionsInTableView“. Se provate a modificare 

questo valore, vedrete che (quando eseguirete l’applicazione) la lista degli oggetti sarà ripetuta 

più volte. Provare per credere! A cosa serve? Nel caso in cui vogliate creare una tabella suddivi- 


sa in più sezioni, ad esempio come quella dell’applicazione nativa “Contatti”, che suddivide gli 

elementi in ordine alfabetico. 

Il secondo è “numberOfRowInSection“, e setta il numero di celle in ogni sezione (nel nostro 

esempio avremo una sola sezione). Questo valore deve corrispondere al numero di elementi che 

vogliamo inserire nella tabella, quindi quelli contenuti nell’oggetto “lista”. 

Ci resta solamente da inserire un metodo, quello che si occupa di inserire gli elementi nelle celle 

della tabella. Ecco il metodo in questione: 

1 

2 

3 

4 

5 

6 

7 

8 

9 

10 

11 

12 

13 

14 

15 

// Setta il contenuto delle varie celle 

- (UITableViewCell *)tableView:(UITableView *)tableView 

cellForRowAtIndexPath:(NSIndexPath *)indexPath{ 

! 

! UITableViewCell *cell = [tableView 

dequeueReusableCellWithIdentifier:@"cellID"]; 

! 

! if (cell == nil){ 

! ! cell = [[[UITableViewCell alloc] initWithFrame:CGRectZero 

reuseIdentifier:@"cellID"] autorelease]; 

! ! //setta lo stile con cui vengono selezionate le righe 

! ! cell.selectionStyle = UITableViewCellSelectionStyleNone;! 

! } 

! //inseriamo nella cella l'elemento della lista corrispondente 

! cell.textLabel.text = [lista objectAtIndex:indexPath.row]; 

! return cell; 

} 

Questo è il metodo (fondamentale ed obbligatorio) che si occupa di settare in maniera corretta 

le celle della tabella. Alla riga 4 troviamo la dichiarazione di una cella, che viene poi allocata alla 

riga 7. Con l’istruzione presente alla riga 9 definiamo come deve essere l’aspetto delle righe 

quando vengono selezionate dall’utente. Con questa istruzione l’utente non potrà selezionare 

nessuna riga, se invece la togliamo avremo la classica selezione con sfondo blu. 

Alla riga 13, infine, settiamo il valore contenuto nella cella: esso deve essere letto dall’array, nella 

posizione uguale a quella della riga (ricordatevi che sia la numerazione dell’array che delle celle 

parte da zero). 

Cliccate ora su “Build and Go!”: la nostra tabella inizia a prendere forma! 


PARTE 2: INSERIAMO ALCUNE FUNZIONALITÀ 

Abbiamo visto come definire una tabella. In questa seconda parte vedremo come aggiungere 

due funzionalità davvero molto importanti: la cancellazione delle singole celle e la possibilità di 

renderle selezionabili. Vedrete che per entrambe le caratteristiche dovremo inserire davvero 

poco codice, in quanto è già tutto definito. 

PERMETTIAMO LA CANCELLAZIONE DI UNA RIGA 

La prima cosa da fare è inserire il bottone che permette di accedere alla modifica della tabella. 

Per fare ciò ci basta decommentare una riga che dovreste già trovare nel metodo viewDidLoad: 

1 

2 

3 

4 

5 

6 

7 

8 

9 

15 

16 

17 




- (void)viewDidLoad{ 


! // codice aggiunto nella prima parte del tutorial 

... 



self.navigationItem.rightBarButtonItem = self.editButtonItem; 

} 

Tutto molto semplice e veloce grazie alle API di Apple. 


Se provate ad eseguire l'applicazione noterete che cancellando una riga essa non viene rimossa 

dalla tabella. Questo avviene perché non abbiamo ancora concluso di implementare questa 

funzionalità. Inseriamo, quindi, il seguente metodo: 

1 

2 

3 

4 

5 

6 

7 

8 

9 

10 

11 

12 

// Elimina l'elemento dalla tabella e dalla lista 

- (void)tableView:(UITableView *)tableView 

commitEditingStyle:(UITableViewCellEditingStyle)editingStyle 

forRowAtIndexPath:(NSIndexPath *)indexPath { 

! 

! //controlla se l'azione compiuta è un'eliminazione 

! if (editingStyle == UITableViewCellEditingStyleDelete) { 

! ! //elimina l'elemento dalla lista 

! ! [lista removeObjectAtIndex:indexPath.row]; 

! ! //elimina le'elemento dalla tabella 

! ! [self.tableView deleteRowsAtIndexPaths:[NSArray 

arrayWithObject:indexPath] 

withRowAnimation:UITableViewRowAnimationFade]; 

! ! 

! } 

} 

Come possiamo notare dalla struttura un po’ complicata, questo è un metodo del protocollo 

UITableView, proprio come quello che abbiamo implementato nella prima parte. 

Il costrutto if (riga 5) esegue un controllo che, come spiega il commento, controlla se l’azione 

eseguita sulla tabella è di cancellazione di una riga. Direte voi: “Cosa posso fare d’altro?” Per 

ora niente, perché la nostra tabella supporta solo l’eliminazione di una riga, ma volendo si potrebbe 

implementare anche l’inserimento di una nuova riga, oppure altre azioni. È sempre questo 

metodo che si occupa di gestire tutte le azioni sulla tabella. Ecco spiegata la necessità di 

questo controllo. Tornando al codice, all’interno dell’if possiamo notare due istruzioni, che 

eliminano l’elemento sia dalla lista (riga 7) che dalla tabella (riga 9). In questo modo la cancellazione 

di una riga è davvero implementata. 

RENDIAMO LE CELLE SELEZIONABILI 

Vediamo ora di implementare un’altra funzione. Vogliamo che quando l’utente seleziona una 

cella appaia un pop-up che contenga il nome dell’elemento selezionato. Ovviamente questa 

azione non ha una grande utilità, ma vi permetterà di imparare come gestire le selezioni dell’utente 

e vedrete, inoltre, come creare un pop-up. 

Prima di implementare il metodo necessario, eliminate dal metodo 

tableView:(UITableView*)tableView cellForRowAtIndexPath:(NSIndexPath*)indexPath; 

la seguente istruzione (vi ho spiegato nella prima parte a cosa serviva): 

1 cell.selectionStyle = UITableViewCellSelectionStyleNone; 

altrimenti le celle non saranno selezionabili. 


Nel solito file “RootViewController.m” inserite ora questo metodo: 

1 

2 

3 

4 

5 

6 

// Se selezioniamo una riga appare un pop-up con l'elemento in questione 


didSelectRowAtIndexPath:(NSIndexPath *)indexPath { 

! UIAlertView *popUp = [[UIAlertView alloc] initWithTitle:@"Hai selezionato:" 

message:[lista objectAtIndex:indexPath.row] 

delegate:self cancelButtonTitle:@"OK" otherButtonTitles:nil]; 

! [popUp show]; 

! [popUp release]; 

} 

Questo è il metodo che si occupa di eseguire una certa azione quando l’utente seleziona una 

cella. Alla riga 3 possiamo notare la definizione del pop-up, che conterrà un messaggio con il 

nome della cella selezionata. È possibile creare pop-up con diversi bottoni o più messaggi, vi 

basterà guardare la documentazione per trovare tutte le varianti possibili. 

Alla riga 4, infine, viene mostrato il pop-up appena definito. 

Cliccate ora su “Build and Go!” e testate la nuova tabella! 


PARTE 3: IMPLEMENTIAMO LA RICERCA 

Nella terza e ultima parte di questo lungo tutorial dedicato alle tabelle, vedremo come aggiungere 

un box di ricerca. Il comportamento sarà del tutto simile a quello della ricerca presente 

nell’applicazione nativa “Contatti”. 

Vedrete che questa operazione si rivelerà molto semplice, infatti Apple ha davvero migliorato 

questo aspetto con le ultime versioni del SDK. 

AGGIUNGIAMO IL BOX DI RICERCA 

Facciamo doppio clic sul file “RootViewController.xib” per aprire IB, in cui dovremo inserire la 

nostra barra di ricerca. Dalla Libreria selezioniamo un componente “Search Bar and Search Display 

Controller”, e trasciniamolo sopra l’elemento “Table View” che vedete nel Pannello dei 

documenti. 

Se avete eseguito tutto correttamente la vostra tabella mostrerà ora anche una barra di ricerca: 


Ancora una volta davvero tutto molto semplice! Salvate tutto e chiudere pure Interface Buider. 

MODIFICHIAMO I METODI GIÀ ESISTENTI 

Prima di implementare la ricerca vera e propria, dobbiamo fare delle piccole modifiche ai metodi 

già presenti nel nostro progetto. 

Iniziamo aprendo il file “RootViewController.h” e completiamo così la definizione della classe: 

1 

2 

3 

4 

5 

6 

7 

8 

9 



! NSMutableArray *filteredListContent; 

} 


@property (nonatomic, retain) NSMutableArray *filteredListContent; 

@end 

Abbiamo semplicemente dichiarato una nuova lista (riga 3), che conterrà gli elementi “filtrati”, 

ovvero quelli che corrispondono al criterio di ricerca. 

Ora dobbiamo modificare i metodi che si occupano dell’inizializzazione della tabella. Iniziamo 

dal metodo “viewDidLoad” e dalla funzione “@synthetize”: 


1 

2 

3 

4 

5 

6 

7 

8 

9 

10 

11 

12 

13 

14 

15 

16 

17 

18 

19 

20 

21 

22 



@synthesize lista, filteredListContent; 



! 

! self.title = @"Prodotti Apple"; 

! 

! //elementi da visualizzare nella tabella 

! lista = [[NSMutableArray alloc] initWithObjects:@"iPhone", @"i- 

Pod", @"iPod Touch", @"iMac", @"iBook", @"MacBook", @"MacBook Pro", 

@"Mac Pro", @"PowerBook", nil]; 

! ! ! 



self.navigationItem.rightBarButtonItem = self.editButtonItem; 

! 

! // crea la lista filtrata, inizializzandola con il numero di 

elementi dell'array "lista" 

! filteredListContent = [[NSMutableArray alloc] initWithCapacity: 

[lista count]]; 

! //inserisce in questa nuova lista gli elementi della lista originale 

! [filteredListContent addObjectsFromArray: lista]; 

} 

Potete notare che la prima parte del metodo “viewDidLoad” è uguale a quella che già abbiamo 

scritto nei precedenti tutorial. Alle righe 19 e 21, invece, abbiamo inserito due istruzioni, che 

hanno il compito di inizializzare il nuovo array, che ci servirà nell’algoritmo di ricerca. Inizialmente 

questa lista coinciderà con quella degli elementi iniziali, mentre poi verrà modificata 

mentre l’utente inserisce la stringa di ricerca. 

Il secondo metodo da modificare è “numberOfRowsInSection”. Ecco il nuovo codice: 

1 

2 

3 

4 


numberOfRowsInSection:(NSInteger)section{ 

! //il numero di righe deve corrispondere al numero di elementi 

della lista 

! return [filteredListContent count]; 

} 

Questa modifica va eseguita in quanto la tabella ora non è più composta dagli elementi della 

lista originale, ma da quelli della lista filtrata, ovvero di quegli elementi selezionati mediante la 

ricerca. Ovviamente se l’utente non esegue nessuna ricerca, gli elementi della lista filtrata corrisponderanno 

agli elementi della lista originale. 


Se vi è chiaro questo ragionamento, è facile intuire quali saranno i prossimi metodi da modificare: 

il primo è “cellForRowAtIndexPath:”, ovvero il metodo che si occupa di inserire i valori 

nelle celle. Modificate l’ultima istruzione al suo interno nella seguente maniera: 

1 

2 

/inseriamo nella cella l'elemento della lista corrispondente 

! cell.textLabel.text = [filteredListContent 

objectAtIndex:indexPath.row]; 

Modifichiamo, poi, il metodo “commitEditingStyle”, aggiungendo l’istruzione alla riga 8: 

1 

2 

3 

4 

5 

6 

7 

8 

9 

10 

11 

12 

13 


commitEditingStyle:(UITableViewCellEditingStyle)editingStyle 

forRowAtIndexPath:(NSIndexPath *)indexPath { 

! 

! //controlla se l'azione compiuta è un'eliminazione 

! if (editingStyle == UITableViewCellEditingStyleDelete) { 

! ! NSLog(@"cancellato"); 

! ! //elimina l'elemento dalle due liste 

! ! [lista removeObjectAtIndex:indexPath.row]; 

! ! [filteredListContent removeObjectAtIndex:indexPath.row]; 

! ! //elimina le'elemento dalla tabella 

! ! [self.tableView deleteRowsAtIndexPaths:[NSArray 

arrayWithObject:indexPath] 

withRowAnimation:UITableViewRowAnimationFade]; 

! ! 

! } 

} 

L’ultimo metodo da modificare, infine, è “didSelectRowAtIndexPath:” e anche in questo caso 

l’unica modifica riguarda proprio la lista di riferimento. 

1 

2 

3 

4 

5 



! UIAlertView *popUp = [[UIAlertView alloc] initWithTitle:@"Hai 

selezionato:" message:[filteredListContent 

objectAtIndex:indexPath.row] delegate:self cancelButtonTitle:@"OK" 

otherButtonTitles:nil]; 

! [popUp show]; 

! [popUp release]; 

} 

Abbiamo così eseguito tutte le modifiche necessarie! 

IMPLEMENTIAMO LA RICERCA 

È arrivato il momento di implementare la ricerca vera e propria. Prima di mostrarvi i passaggi 

necessari, devo premettere che il codice non è stato scritto da me, ma l’ho preso da un esempio 

realizzato dalla stessa Apple. I commenti, quindi, saranno davvero pochi, anche perché non è 

fondamentale capire come funziona tale algoritmo, in quanto lo stesso codice si può utilizzare 

in qualsiasi altra applicazione che necessiti di una ricerca. 

Iniziate inserendo questi due metodi: 


1 

2 

3 

4 

5 

6 

7 

8 

9 

10 

11 

12 

13 

14 

15 

16 

- (BOOL)searchDisplayController:(UISearchDisplayController *)controller 

shouldReloadTableForSearchString:(NSString *)searchString{ 

[self filterContentForSearchText:searchString scope: 

! [[self.searchDisplayController.searchBar scopeButtonTitles] 

objectAtIndex:[self.searchDisplayController.searchBar selectedScope- 

ButtonIndex]]]; 

// Return YES to cause the search result table view to be reloaded. 

return YES; 

} 

- (BOOL)searchDisplayController:(UISearchDisplayController *)controller 

shouldReloadTableForSearchScope:(NSInteger)searchOption{ 

! 

[self 

filterContentForSearchText:[self.searchDisplayController.searchBar 

text] scope: 

! [[self.searchDisplayController.searchBar scopeButtonTitles] 

objectAtIndex:searchOption]]; 

// Return YES to cause the search result table view to be reloaded. 

return YES; 

} 

I due metodi appena mostrati fanno parte del delegato “UISearchDisplayController”, che si 

occupa di gestire in maniera corretta la barra di ricerca. 

Ora dobbiamo inserire l’algoritmo di ricerca vero e proprio. Eccovelo: 

1 

2 

3 

4 

5 

6 

7 

8 

9 

10 

11 

12 

13 

14 

- (void)filterContentForSearchText:(NSString*)searchText 

scope:(NSString*)scope{ 

! 

! // per prima cosa azzeriamo l'array della ricerca 

! [self.filteredListContent removeAllObjects]; 

! 

! // controlliamo se gli elementi della tabella corrispondono alla 

ricerca 

! NSString *cellTitle; 

! for (cellTitle in lista){ 

! ! NSComparisonResult result = [cellTitle compare:searchText 

options:NSCaseInsensitiveSearch range:NSMakeRange(0, [searchText 

length])]; 

! ! if (result == NSOrderedSame){ 

! ! ! [filteredListContent addObject:cellTitle]; 

! ! } 

! } 

} 


Per questo algoritmo non voglio spendere parole, in quanto, come detto in precedenza, è stato 

scritto da Apple, quindi non posso permettermi di fare modifiche! 

Cliccate ora su “Build and Go!”, se avete eseguito tutto correttamente si aprirà la vostra applicazione 

con la barra di ricerca perfettamente funzionante! 


Capitolo 10: gestiamo più viste (file “.xib” multipli) 

In questo capitolo vedremo un’aspetto fondamentale nella creazione di un’applicazione, ovvero 

la gestione di più viste. In tutte le applicazioni, infatti, sono presenti diverse viste (“finestre”, 

per usare un termine più generico), che vengono spesso create con Interface Builder (e quindi 

diversi file “.xib”) data la sua comodità. 

L’applicazione che andremo a realizzare sarà davvero molto semplice, infatti consisterà in due 

semplici viste, che potremo scambiare semplicemente cliccando su un bottone. È importante 

seguire bene tutti i passaggi, in modo che possiate replicare la stessa struttura anche nelle vostre 

applicazioni più complesse, senza errori e senza perdere tempo prezioso. 


Iniziamo il nostro tutorial creando un nuovo progetto di tipo “View-based application” e chiamiamolo 

“viewTutorial” 

Il template di XCode ci mette già a disposizione una vista, che sarà quella di partenza (quella 

che viene caricata all’avvio dell’applicazione, chiamata in questo caso “viewTutorialViewController”). 

Creiamo, per prima cosa, la seconda vista necessaria per questa mini-applicazione. 

Facciamo clic con il tasto destro sul nome del nostro progetto e selezioniamo “Add -> New File…”. 

Scegliamo, poi, un template “UIViewController” e spuntiamo la voce “With XIB for user 

interface”: 


Inseriamo come nome “VistaDue” e clicchiamo su “Finish”. Abbiamo così creato una nuova vista 

con la relativa classe che la gestisce, niente di più semplice! 

DEFINIAMO LA PRIMA VISTA 

Apriamo il file “viewTutorialViewController.h” e inseriamo le seguenti dichiarazioni: 

1 

2 

3 

4 

5 

6 

7 

8 

9 

10 

11 

12 

13 

#import 

@class VistaDue; 

@interface viewTutorialViewController : UIViewController { 

! IBOutlet VistaDue *vistaDueController; 

} 

@property (nonatomic, retain) IBOutlet VistaDue *vistaDueController; 

-(IBAction)cambiaVista; 

@end 

Alla riga 6 abbiamo definito un elemento di tipo VistaDue, che sarà proprio la vista che caricheremo. 

Abbiamo, inoltre, definito anche un’azione “cambiaVista”, che assoceremo ad un pulsante, 

sarà l’evento che avvierà il cambio di vista. 

Salviamo il file appena modificato e apriamo il file ”viewTutorialViewController.xib”. In Interface 

Builder apriamo il Pannello dei documenti e inseriamo un elemento del tipo “UIView- 

Controller” al suo interno: 


Selezioniamo il componente appena inserito e dal pannello Identity Inspector selezioniamo 

come classe “VistaDue”: 

Ora inserite nella vista principale (non nel ViewController che abbiamo appena inserito) un 

bottone. Ecco come si presenta la mia vista: 


Ora selezionate il File’s Owner. Dobbiamo collegare i due componenti che abbiamo definito 

poco fa. Colleghiamo l’azione “cambiaVista” con il bottone, selezionando “Touch Up Inside” 

quando appare il menù di scelta dell’azione. Collegate, infine, l’elemento “vistaDueController” 

con l’UIViewController che abbiamo inserito poco prima. Se avete eseguito tutto correttamente 

avrete un pannello che si presenta così: 

Possiamo salvare e chiudere questa vista. 

DEFINIAMO LA “VISTADUE” 

Dobbiamo ora definire la seconda vista. Apriamo per prima cosa il file “VistaDue.h” e definite 

semplicemente questa azione (riga 7): 

1 

2 

3 

4 

5 

6 

7 

8 

9 

#import 

@interface VistaDue : UIViewController { 

} 

-(IBAction)tornaIndietro; 

@end 

Salvate il file e apriamo “VistaDue.xib”. Anche in questo caso inseriamo solamente un bottone 

nella vista, che ci permetterà di tornare alla prima vista: 


Selezioniamo il File’s Owner e colleghiamo l’azione “tornaIndietro” con il bottone che abbiamo 

inserito, selezionando sempre “Touch Up Inside” come azione: 

Salviamo e chiudiamo pure Interface Builder. 


Dobbiamo ora scrivere il codice che ci permetterà di passare da una vista all’altra. Vedrete che 

le istruzioni necessarie saranno davvero poche. 

Apriamo il file “viewTutorialViewController.m” e inseriamo il seguente codice: 


1 

2 

3 

4 

5 

6 

7 

8 

9 

10 

11 

12 

#import "viewTutorialViewController.h" 

#import "VistaDue.h" 

@implementation viewTutorialViewController 

@synthesize vistaDueController; 

-(IBAction)cambiaVista{ 

! vistaDueController = [[VistaDue alloc] 

initWithNibName:@"VistaDue" bundle:nil]; 

! vistaDueController.modalTransitionStyle = UIModalTransition- 

StyleFlipHorizontal; 

! [self presentModalViewController:self.vistaDueController 

animated:YES]; 

} 

Alla riga 9 abbiamo inizializzato la vista, inserendo anche il nome del file .xib che deve essere 

caricato. La riga 10, invece, ci permette di impostare l’animazione del passaggio dalla prima alla 

seconda vista. Ci sono tre animazioni già predisposte e disponibili: 

1. UIModalTransitionStyleCoverVertical, il caricamento della nuova vista sarà verticale, dal basso 

verso l’alto; 

2. UIModalTransitionStyleFlipHorizontal, c’è la rotazione flip-side, ovvero come se venisse mostrato 

il retro della vista; 

3. UIModalTransitionStyleCrossDissolve, dissolvenza incrociata. 

L’ultima istruzione (riga 11) permette di mostrare la seconda vista, rendendola così visibile all’utente. 

Ora non ci resta che definire il metodo “tornaIndietro” della classe VistaDue. Apriamo il file 

“VistaDue.m” e inseriamo la definizione di tale metodo: 

1 

2 

3 

- (IBAction)tornaIndietro{ 

! [[self parentViewController] 

dismissModalViewControllerAnimated:YES]; 

} 

Questa istruzione ci permette di uscire dalla vista corrente e tornare a quella che era visualizzata 

precedentemente (nel nostro caso la vista “viewTutorialViewController”). 

Abbiamo concluso! Clicchiamo su “Build and Run” e controlliamo che l’applicazione funzioni 

correttamente! 



Capitolo 11: Come creare una TabBar Application 

Uno dei componenti più utilizzati (e uno dei più apprezzati dagli utenti finali) sono le TabBar, 

che avete già conosciuto nel capitolo 2. In questo tutorial vedremo come creare una struttura 

di base, inserendo due viste generiche e una più particolare e utile: una tabella integrata ad una 

NavigationBar, che ci permetterà di navigare nei sottolivelli della tabella (per capirci, la struttura 

che è presente nell’applicazione nativa iPod). 

PARTE 1: LA STRUTTURA DI BASE 

Abbiamo già descritto cosa faremo in questa prima parte: realizzeremo la struttura di base, che 

ci permetterà di inserire diverse viste nella tab. È importante seguire bene tutti i passaggi per 

non ritrovarsi con errori strani, che spesso portano a perdere tempo e possono essere facilmente 

evitati. 

CREIAMO UNA TABBAR “PULITA” 

Iniziamo creando un nuovo progetto di tipo “Tab Bar Application” e chiamandolo “TabBarTutorial”. 

Vogliamo andare a definire una struttura di base pulita, personalizzandola poi a nostro 

piacimento. Eliminiamo, quindi, alcuni componenti che XCode ha già creato per noi, ma che 

non vogliamo sfruttare: cancelliamo il file “SecondView.xib”, “FirstViewController.h” e 

“FirstViewController.m”. 

Possiamo ora fare doppio clic su “MainWindow.xib”, si aprirà Interface Builder che ci mostrerà 

questo layout per la nostra applicazione: 


Selezioniamo ognuno dei tab ed eliminiamolo, ottenendo questa struttura: 

Salviamo questo file e chiudiamo pure Interface Builder. 

DEFINIAMO LE DUE VISTE 

Dobbiamo ora definire le due viste che dovremo inserire nella nostra applicazione. Dal menù 

“File” scegliamo “New File…” e selezioniamo “Empty XIB”. Creiamo due di questi file chiamandoli, 

rispettivamente, “PrimaVista” e “SecondaVista”. 


Nella cartella “Resources” del nostro progetto vedremo i due file appena creati: 

Dobbiamo ora creare anche le due classi che gestiranno le due viste: nel tutorial non serviranno 

a niente, ma voglio implementarle in modo da darvi già una struttura che potrete utilizzare nelle 

vostre applicazioni. 

Andiamo, quindi, in “File -> New File…” e spostiamoci nella sezione “Cocoa Touch Class”, in 

cui selezioniamo il modello “UIViewController”: anche in questo caso dobbiamo creare due 

classi, chiamate “PrimaVistaController” e “SecondaVistaController”. 

Possiamo spostare i file appena creati nella sezione “Classes” del nostro progetto. Abbiamo così 

definito tutti i componenti necessari, non ci resta che definire la struttura grafica delle due viste. 

CREIAMO L’ASPETTO GRAFICO DELLE DUE VISTE 

Clicchiamo su “PrimaVista.xib” per aprirla in Interface Builder. Dalla Libreria, inseriamo una 

“UIView” all’interno del Pannello dei Documenti (”Tools -> Reveal in Document Window”). 


Apriamo la vista appena inserita e modifichiamone l’aspetto a nostro piacimento (io per semplicità 

inserirò solo due label, in questo tutorial non ci servirà altro). Dall’”Attributes Inspector” 

selezioniamo “Tab Bar” dal sotto-menù a tendina “Bottom Bar”: 

Questa proprietà non ha nessun fine pratico, però ci consente di aver una visione completa della 

nostra vista, tenendo in considerazione anche la tab bar (in questo modo saprete esattamente 

quanto spazio avete a disposizione per i vostri componenti). Ecco come si presenta la nostra 

vista: 


Ora dobbiamo collegare questa vista con la classe che abbiamo definito in precedenza. Sempre 

dal Pannello dei Documenti selezioniamo il “File’s Owner”: 

In “Identity Inspector” selezioniamo “PrimaVistaController” dal menù a tendina “Class”. 


Andiamo poi in “Connections Inspector” e colleghiamo l’elemento “view” con la vista che abbiamo 

appena creato. Se abbiamo eseguito il passaggio in maniera corretta avremo questo risultato: 

Abbiamo così completato la definizione della vista. Eseguiamo lo stesso procedimento anche 

per il file “SecondaVista.xib”, collegandola però alla classe “SecondaVistaController”. Possiamo 

poi salvare tutto e chiudere Interface Builder. 

IMPOSTIAMO LA TABBAR 

Ora è giunto il momento di impostare la struttura vera e propria della nostra Tab Bar. Apriamo 

il file “MainWindow.xib” 

Dalla Libreria inseriamo due componenti UIViewController trascinandoli nella “Tab Bar” posta 

a fondo vista: 


Il risultato finale sarà il seguente: 

Iniziamo facendo clic sul primo elemento, facendo attenzione che si evidenzi in questo modo: 


Per prima cosa impostiamo la classe di questo UIViewController. Andiamo nel pannello “Identity 

Inspector” e selezioniamo “PrimaVistaController” come classe: 

È molto importante non saltare questo primo passo, altrimenti per viste di una certa complessità 

riceverete errori strani che non sapete da cosa dipendono, il tutto solamente per non aver 

impostato la classe della vista! 

Poi nel pannello “Attributes Inspector” selezioniamo “PrimaVista” dal menù “NIB Name”: 


Ora facciamo doppio clic sul nome del tab (che per default è “Item”), e rinominiamolo a nostro 

piacere. Ripetiamo, poi, lo stesso procedimento con il secondo tab, associando questa volta la 

“SecondaVista”. 

Se avete eseguito tutto in maniera corretta avrete il seguente risultato: 

Chiudiamo ora Interface Builder, salvando tutti i file. Da XCode clicchiamo su “Build and Go!” 

e testiamo se tutto funziona in maniera corretta! 


PARTE 2: INSERIAMO UNA NAVIGATIONBAR 

Nella seconda parte di questo tutorial analizzeremo l’aspetto più importante e più delicato, ovvero 

l’implementazione di una UINavigationBar e di una tabella. Questa combinazione ci permetterà 

di navigare nei sotto-elementi della tabella. Ovvero, quando l’utente seleziona una determinata 

cella si aprirà una corrispondente vista che avremo definito con Interface Builder. La 

navigation bar, poi, ci permetterà di tornare alla tabella principale. Un po’ come avviene nel 

menù “Impostazioni” del’iPhone / iPod Touch! 

CREIAMO UN NUOVO ELEMENTO PER LA TABBAR 

Iniziamo creando la classe che gestirà la nuova vista. Dal menù “File” scegliamo “New File…”, 

nel pannello che apparirà selezioniamo “UIViewController subclass” e spuntiamo la voce “UI- 

TableViewController subclass” presente nelle opzioni. Chiamiamo questa nuova classe “TabellaController”. 

Abbiamo già imparato a gestire una tabella nel capitolo 9, quindi non rispiegherò il codice utilizzato. 

Riutilizziamo gli stessi metodi, quindi inserite nel file “TabellaController.h” il seguente 

codice: 


1 

2 

3 

4 

5 

6 

7 

8 

9 

#import 

@interface TabellaController : UITableViewController {! 

! //array che conterrà gli elementi da visualizzare nella tabella 

! NSArray *lista; 

} 

@property (nonatomic, retain) NSArray *lista; 

@end 

Mentre in “TabellaController.m” inserite questi metodi: 

1 

2 

3 

4 

5 

6 

7 

8 

9 

10 

11 

12 

13 

14 

15 

16 

17 

18 

19 

20 

21 

#import "TabellaController.h" 

@implementation TabellaController 


- (void)awakeFromNib{! 

! // creiamo la lista e inseriamo una serie di elementi da visualizzare 

nella nostra tabella 

! lista = [[NSArray alloc] initWithObjects:! @"iPhone", @"iPod", 

@"iPod Touch", @"iMac", @"iBook", @"MacBook", @"MacBook Pro", @"Mac 

Pro", @"PowerBook", nil]; 

} 

//setta il numero di sezioni della tabella 

- (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView{ 

! return 1; 

} 

//setta il numero di righe della tabella 


numberOfRowsInSection:(NSInteger)section{ 

! //numero di righe deve corrispondere al numero di elementi della 

lista 

! return [lista count]; 

} 


22 

23 

24 

25 

26 

27 

28 

29 

30 

31 

32 

33 

34 

35 

//settiamo il contenuto delle varie celle 


cellForRowAtIndexPath:(NSIndexPath *)indexPath{ 

! 

! UITableViewCell *cell = [tableView 

dequeueReusableCellWithIdentifier:@"cellID"]; 

! 

! if (cell == nil){ 

! ! cell = [[[UITableViewCell alloc] initWithFrame:CGRectZero 

reuseIdentifier:@"cellID"] autorelease]; 

! ! 

! } 

! //inseriamo nella cella l'elemento della lista corrispondente 

! cell.textLabel.text = [lista objectAtIndex:indexPath.row]; 

! 


} 

Salviamo entrambi i file e riapriamo “MainWindow.xib” per tornare in Interface Builder. 

DEFINIAMO L’ASPETTO DEL NUOVO ELEMENTO 

Dalla Libreria prendiamo un componente UINavigationController e inseriamolo nella tab bar, 

proprio come abbiamo nella prima parte di questo tutorial. 


Proprio come abbiamo fatto in precedenza cambiamo il nome della scheda in “Tabella”. Ecco il 

risultato finale: 

Ora non ci resta che inserire la tabella all’interno di questa vista. Dalla Libreria prediamo un 

componente UITableViewController e inseriamolo nella nostra vista. Il risultato che dovete 

ottenere è il seguente: 


Ora dobbiamo solo collegare la classe alla tabella appena inserita. Dal Pannello dei Documenti 

(”Tools -> Reveal in Document Window”) navighiamo fino al seguente percorso: 

Come mostrato in figura, selezioniamo il componente “Table View Controller” (che non è altro 

che la nostra tabella) e apriamo l’”Identity Inspector”. Dal menù Class scegliamo “TabellaController”: 

Abbiamo così concluso con la creazione della nostra tabella. Salviamo tutto, torniamo in XCode 

e clicchiamo su “Build and Go!”: la tabella sarà ora presente e funzionante nell’applicazione! 


IMPLEMENTIAMO DUE VISTE DI DETTAGLIO 

Ora vediamo di analizzare un aspetto che molti utenti mi hanno chiesto via mail. Se noi volessimo 

associare un determinato file “xib” (ovvero creato con Interface Builder) ad una cella, come 

potremmo fare? In questa seconda parte del tutorial vedremo proprio di analizzare i passaggi 

necessari. Andremo a definire due viste, una che conterrà una foto dell’elemento “iPhone”, 

mentre un’altra che avviserà l’utente dell’assenza di informazioni per un determinato prodotto. 

Ovviamente potreste realizzare una vista con i dettagli per ogni prodotto presente nella 

tabella, ma il meccanismo rimane invariato. 

Iniziamo creando due nuovi file xib, dal menù “File -> New File…” e scegliendo “Empty XIB”. 

Io ho chiamato il primo file “iPhoneDetail” e il secondo “OtherDetail”, ma nulla vieta di chiamarli 

in modo diverso! 


Procediamo proprio come abbiamo fatto all’inizio dello scorso tutorial per le viste “PrimaVista” 

e “Seconda Vista”, quindi definiamo subito via codice le due classi necessarie. 

Andiamo, quindi, in “File -> New File…” e spostiamoci nella sezione “Cocoa Touch Class”, in 

cui selezioniamo il modello “UIViewController”: anche in questo caso dobbiamo creare due 

classi, chiamate “iPhoneDetailController” e “OtherDetailController”. 

Possiamo spostare i file appena creati nella sezione “Classes” del nostro progetto. Ora siamo 

pronti per definire l’aspetto di queste due nuove viste. 

DEFINIAMO L’ASPETTO DELLE DUE VISTE DI DETTAGLIO 

Apriamo il file “iPhoneDetail.xib” in Interface Builder. Il procedimento è, come già detto, 

uguale a quello svolto per la definizione delle due viste “PrimaVista” e “SecondaVista”. Inseriamo, 

quindi, un componente UIView nel Pannello dei Documenti e modifichiamolo a nostro 

piacimento. Io ho inserito una foto di un iPhone, ovviamente voi potrete inserire quello che 

volete. Ecco come risulta essere la mia vista: 


Ora associamo questa vista alla sua classe. Dal Pannello dei Documenti selezioniamo il “File’s 

Owner” e nell’”Identity Inspector” selezioniamo “iPhoneDetailController” come classe: 

Andiamo poi in “Connections Inspector” e colleghiamo l’elemento “view” con la vista che abbiamo 

appena creato (quella contenente le due label per intenderci). Se abbiamo eseguito il 

passaggio in maniera corretta avremo questo risultato: 


Abbiamo così completato la definizione della vista. Eseguiamo lo stesso procedimento anche 

per il file “OtherDetail.xib”, collegandola però alla classe “OtherDetailController”. Ecco come 

appare tale vista: 

Possiamo salvare tutto e chiudere Interface Builder. 


COME RICHIAMARE LE DUE VISTE VIA CODICE 

Ora non ci resta che analizzare il codice che ci permette di aprire queste due viste. Apriamo il 

file “TabellaController.h” e modifichiamolo nella seguente maniera: 

1 

2 

3 

4 

5 

6 

7 

8 

9 

10 

11 

12 

13 

14 

15 

#import 

#import "iPhoneDetailController.h" 

#import "OtherDetailController.h" 

@interface TabellaController : UITableViewController {! 

! //array che conterrà gli elementi da visualizzare nella tabella 

! NSArray *lista; 

! //controller della vista che dovrà essere aperta 

! UIViewController *detail; 

} 

@property (nonatomic, retain) NSArray *lista; 

@end 

Abbiamo per prima cosa importato le due classi delle viste (righe 2 e 3), e poi definito una vista 

generica (riga 10), che poi inizializzeremo con la classe “iPhoneDetailController” oppure “OtherDetailController”, 

a seconda del caso. Perché abbiamo utilizzato “UIViewController” come 

tipo dell’elemento “detail”? Perchè abbiamo sfruttato un paradigma della programmazione ad 

oggetti, che ci permette di definire un elemento con una superclasse, per poi inizializzarlo con 

una sottoclasse più specifica. 

Ora apriamo il file “TabellaController.m” e inseriamo il metodo che viene richiamato quando si 

clicca su una cella: 


1 

2 

3 

4 

5 

6 

7 

8 

9 

10 

11 

12 

13 

14 

15 

16 

17 

// Metodo relativo alla selezione di una cella 



! 

! if (indexPath.row == 0){ 

! ! //l'utente ha cliccato sull'elemento iPhone, quindi carichiamo 

la vista relativa 

! ! detail = [[iPhoneDetailController alloc] 

initWithNibName:@"iPhoneDetail" bundle:[NSBundle mainBundle]]; 

! } else { 

! ! detail = [[OtherDetailController alloc] 

initWithNibName:@"OtherDetail" bundle:[NSBundle mainBundle]]; 

! } 

! 

! //Facciamo visualizzare la vista con i dettagli 

! [self.navigationController pushViewController:detail 


! //rilasciamo il controller 

! [detail release]; 

! 

! detail = nil; 

} 

Anche questo metodo lo avevamo già trovato nel tutorial dedicato alle tabelle. Analizziamo, 

però, il codice al suo interno. Troviamo inizialmente un controllo if (riga 4), che controlla se 

l’utente ha selezionato al prima cella, ovvero quella contenente l’elemento iPhone: se il controllo 

da esito positivo, inizializziamo l’elemento “detail” con la classe relativa alla vista “iPhone- 

Detail” (riga 6), altrimenti con l’altra vista generica (riga 8). La clausola “initWithNibName” si 

riferisce proprio al file xib che deve essere associato all’elemento “detail”. 

Dopo il ciclo troviamo le istruzioni che ci permettono di far apparire la nuova vista; non 

preoccupatevi troppo, sono sempre queste istruzioni da utilizzare. 

Abbiamo concluso!! Clicchiamo su “Build and Go!” e godiamoci la nostra applicazione funzionante!! 



Capitolo 12: XML 

Dopo aver visto molti componenti, in questo capitolo vedremo come integrare una tecnologia 

molto utilizzata, specialmente in ambito web: stiamo parlando di XML. 

Vedremo, quindi, come leggere un file XML, da cui ricaveremo delle informazioni che abbiamo 

salvato. Questa operazione verrà eseguita in locale (ovvero il file xml sarà all’interno del nostro 

progetto), ma nulla vieta di avere il file caricato su un server web da cui accediamo tramite la 

nostra applicazione. 

COSA È XML? 

XML è un metalinguaggio (in quanto non è un linguaggio di programmazione vero e proprio) 

di markup, ovvero un linguaggio che consente di estendere o controllare il comportamento di 

altri linguaggi. Il linguaggio di markup più famoso è sicuramente l’HTML, che ha molte analogie 

con l’XML. 

XML è l’acronimo di eXtensible Markup Language, da cui possiamo capire la caratteristica 

fondamentale di questo linguaggio: ci permette di creare tag personalizzati, in base alle proprie 

esigenze. 

Sarà più semplice comprendere come funziona questo linguaggio mediante un esempio: 

La prima riga definisce la versione di XML in uso e la codifica utilizzata (secondo le norme 

ISO). Dalla seconda riga in poi, invece, troviamo dei tag personalizzati, che vanno a modellare 

dei dati a nostro piacimento. 

Possiamo vedere come abbiamo definito un tag generale “studenti”, che viene iniziato alla seconda 

riga e concluso all’ultima. Nel mezzo troviamo, invece, altri tag, che riportano le informazioni 

che vogliamo memorizzare, per poi utilizzarle a nostro piacimento. 

Ci sono alcune piccole regole da rispettare nella struttura XML: 


1. I tag non possono iniziare con numeri o caratteri speciali e non possono contenere spazi. 

Corretti: , , 

Errati: , , 

2. I tag devono essere bilanciati (ogni tag aperto deve essere chiuso) 

Corretto: Andrea 

Errato: Andrea 

3. I tag non devono contenere errori di annidamento. 

Ecco alcuni esempi errati: 

4. Si possono inserire degli attributi all’interno dei tag; la struttura sarà quindi la seguente: 

Valore 

I nostri elementi, quindi, potranno essere scritti anche nella seguente maniera: 

Questa struttura è del tutto uguale a quella precedente. Notate che in questo caso non abbiamo 

usato il tag di chiusura, ma abbiamo inserito “/” all’interno del tag stesso proprio per 

indicare che quel tag non ha elemento di chiusura. Quello che cambierà sarà solamente il 

modo di leggere i valori via codice. 


XML NEL SDK DI IPHONE 

Per ora abbiamo fatto una panoramica su XML in generale, presentando gli aspetti fondamentali 

di tale linguaggio. Ma come possiamo integrarlo con le nostre applicazioni? L’oggetto che si 

occupa di recuperare i dati da un file XML viene detto parser. 

Esistono vari tipi di parser (diversi per linguaggi e tecnologie), noi andremo ad utilizzare SAX. 

La caratteristica di questo parser sta nel fatto che processa i documenti linea per linea: dati a 

cui si è acceduto in precedenza non possono essere riletti senza la rielaborazione dell’intero 

documento. Può essere uno svantaggio, ma è l’unico parser disponibile nel SDK per iPhone!! 


Iniziamo ora a creare la nostra applicazione. Creiamo un nuovo progetto di tipo “View-Based 

Application” e chiamiamolo “xmlTutorial”. 

Prima di definire l’aspetto grafico, però, dichiariamo i componenti che ci servono. Apriamo il 

file “xmlTutorialViewController.h” e modificatelo così: 

1 

2 

3 

4 

5 

6 

7 

8 

9 

10 

11 

#import 

@interface xmlTutorialViewController : UIViewController 

{ 

! IBOutlet UITextView *textArea; 

! 

! NSString *path; 

} 

-(IBAction)avviaParsing; 

@end 

Abbiamo dichiarato una TextView in cui inseriremo i dati letti dal file xml, un’azione, che andrà 

collegata ad un bottone (tale azione farà iniziare il processo di parsing) e una stringa che 

conterrà il percorso del file xml. Possiamo salvare il file e dedicarci alla struttura grafica dell’applicazione. 

Ricordatevi, anche, di inserire nell’intestazione della classe il delegato 

“NSXMLParserDelegate” (riga 3). 

Apriamo ora il file “xmlTutorialViewControlle.xib”, che avvierà Interface Builder. Nella nostra 

applicazione, inseriamo un bottone e una TextView, di dimensioni abbastanza ampie, in quanto 

dovrà contenere tutti i valori letti dal file xml. Dovreste ottenere un risultato come questo: 


Ora, selezionando la UITextView, entriamo in “Attributes Inspector” e togliamo la spunta a 

“Editable”: 

questo perché non vogliamo che l’utente possa modificare i valori presenti nella TextView (ovvero 

deve essere di sola lettura). 

Dal pannello dei documenti (”Tools -> Reveal in Document Window”) selezioniamo “File’s 

Owner”, ovvero la classe che gestisce il nostro file. 


Apriamo il “Connections Inspector” e potremo vedere alcuni elementi, più i due che abbiamo 

definito noi all’inizio del nostro progetto. Colleghiamo “textArea” con la UITextView presente 

nella nostra vista, e l’azione “avviaParsing” con il bottone: quando apparirà il menù con tutte le 

azioni disponibili, scegliamo “Touch Up Inside”. Se avrete eseguito tutto correttamente avrete 

un pannello che si presenterà così: 

Abbiamo terminato la creazione della struttura grafica. Possiamo salvare tutto e chiudere Interface 

Builder. 


Prima di procedere con il codice necessario, dobbiamo inserire all’interno del progetto il file 

xml con i nostri dati. Trascinate il file xml (che potete creare ex-novo, oppure creare copiando il 

codice presentato nella prima parte di questo tutorial tutorial) all’interno della cartella “Resources” 

del nostro progetto, spuntando l’opzione per copiarlo nella cartella fisica del progetto: 


Apriamo ora il file “xmlTutorialViewController.m” e definiamo il seguente metodo: 

1 

2 

3 

4 

5 

6 

7 

// Metodo eseguito all'avvio della vista 



! // definiamo il percorso del file xml 

! NSString *pathProgetto = [[NSBundle mainBundle] bundlePath]; 

! path = [[NSString alloc] initWithString:[pathProgetto 

stringByAppendingPathComponent:@"dati.xml"]]; 

} 

Questo metodo viene eseguito all’avvio della vista, e ci permette di definire dei comportamenti 

che devono essere eseguiti prima di ogni altra cosa. Con le due istruzioni che abbiamo inserito 

definiamo il percorso del nostro file “dati.xml”: esso viene cercato all’interno della cartella del 

nostro progetto. Queste istruzioni sono molto importanti, in quanto non viene definito un 

percorso assoluto (soluzione sempre sconsigliabile e spesso errata), ma viene definito il percorso 

effettivo in cui si trova il file. 

Dobbiamo ora definire l’azione che viene eseguita quando premiamo sul pulsante. Ecco il codice 

da inserire: 


1 

2 

3 

4 

5 

6 

7 

8 

9 

10 

11 

12 

13 

14 

15 

16 

17 

18 

-(IBAction)avviaParsing{ 

! //Bisogna convertire il file in una NSURL altrimenti non funziona 

! NSURL *xmlURL = [NSURL fileURLWithPath:path]; 

! // Creiamo il parser 

! NSXMLParser *parser = [[ NSXMLParser alloc] 

initWithContentsOfURL:xmlURL]; 

! // Il delegato del parser e' la classe stessa (self) 

! [parser setDelegate:self]; 

! //Effettuiamo il parser 

! BOOL success = [parser parse]; 

! //controlliamo come è andata l'operazione 

! if(success == YES){ 

! ! //parsing corretto 

! } else { 

! ! //c'è stato qualche errore... 

! } 

! // Rilasciamo l'oggetto NSXMLParser 

! [parser release]; 

} 

Le istruzioni alle righe 3 e 5 ci permettono di definire il parser, partendo dal percorso del nostro 

file. Alla riga 9 avviamo il processo di parsing, salvando il risultato in una variabile booleana: 

se essa vale YES la conversione si è conclusa senza errori (riga 12), altrimenti c’è stato un 

errore (che potrebbe essere dovuto ad errori nella struttura del file xml oppure ad errori di 

scrittura del codice). 

Come potete vedere non si tratta di codice complesso, sono poche istruzioni che dovrebbero 

risultarvi chiare. 

La parte che viene ora è quella che si occupa di leggere i dati dal file xml. Iniziamo inserendo 

questo metodo: 


1 

2 

3 

4 

5 

6 

7 

8 

9 

10 

11 

12 

13 

14 

15 

16 

17 

18 

- (void)parser:(NSXMLParser *)parser didStartElement:(NSString *)elementName 

namespaceURI:(NSString *)namespaceURI 

qualifiedName:(NSString *)qualifiedName attributes:(NSDictionary 

*)attributeDict { 

! 

! if ([elementName isEqualToString:@"studenti"]){ 

! ! [textArea setText:[[NSString alloc] 

initWithFormat:@"%@\nInizio studenti",textArea.text]]; 

! } 

! else if([elementName isEqualToString:@"studente"]){ 


initWithFormat:@"%@\nNuovo studente",textArea.text]]; 

! } 

! else if([elementName isEqualToString:@"matricola"]) { 


initWithFormat:@"%@\nMatricola: ",textArea.text]]; 

! } 

! else if([elementName isEqualToString:@"cognome"]) { 


initWithFormat:@"%@\nCognome: ",textArea.text]]; 

! }! 

! else if([elementName isEqualToString:@"nome"]) { 


initWithFormat:@"%@\nNome: ",textArea.text]]; 

! } 

} 

Come potete osservare, vi sono una serie di controlli if, che vanno a testare l’elemento corrente, 

per riconoscerlo e per scrivere una stringa adeguata nella textArea che abbiamo predisposto. 

Questo processo è possibile perché conosciamo a priori la struttura del file xml: questo è quasi 

sempre vero, in quanto sarebbe quasi impossibile leggere un file xml di cui non conosciamo la 

struttura interna. 

Il metodo viene, ovviamente, richiamato ogni volta che il parser incontra un nuovo elemento, 

cioè l’apertura di un tag. 

Per completare il nostro programma mancano solo due metodi: 

1 

2 

3 

4 

5 

6 

7 

- (void)parser:(NSXMLParser *)parser foundCharacters:(NSString 

*)string { 

! [textArea setText:[[NSString alloc] 

initWithFormat:@"%@%@",textArea.text,string]]; 

} 

- (void)parser:(NSXMLParser *)parser didEndElement:(NSString *)elementName 


qualifiedName:(NSString *)qName { 

! [textArea setText:[[NSString alloc] initWithFormat:@"%@\nFine 

elemento: %@",textArea.text,elementName]]; 

} 


Il primo viene richiamato quando il parser incontra un valore racchiuso tra due tag (l’informazione 

vera e propria). Nel nostro caso ci limitiamo a inserirla nella textArea, però potreste fare 

delle operazioni più o meno complesse sulle informazioni che leggete dal file. 

L’ultimo metodo, invece, viene richiamato quando il parser incontra un tag di chiusura. Anche 

in questo caso l’unica azione che faremo sarà quello di inserire una stringa nella textArea. 

Possiamo finalmente cliccare su “Build and Go!” e testare la nostra applicazione funzionante! 


Capitolo 13: SQL 

Nel capitolo precedente abbiamo visto come leggere un file XML e fare il parsing dei dati contenuti 

al suo interno. Non esiste, però, solo quella possibilità per accedere ad un archivio di dati. 

La tecnologia di maggior successo è sicuramente SQL, che si basa su database relazionali. In 

questo capitolo vedremo come sfruttare SQLite per interfacciarci con un database presente in 

locale (quindi salvato all’interno del nostro progetto). Nulla vieta, però, che il database risieda 

su un server remoto, e che quindi la connessione avvenga tramite la rete. 

Creeremo, quindi, una tabella in cui andremo ad inserire i valori letti dal nostro database, dopo 

aver eseguito una query predefinita. 

Devo premettere, però, che non parlerò di SQL e database relazionali, che devono essere già 

conosciuti da chi affronta questo capitolo. È una scelta che potrebbe non piacere a molti di voi, 

però richiederebbe troppo tempo e una trattazione che non può essere fatta in un semplice tutorial. 

Detto ciò, è possibile seguire questa guida e concludere con successo l’applicazione, anche 

senza conoscere niente di SQL, ovviamente alcune caratteristiche e alcuni passaggi potrebbero 

risultare di difficile comprensione. 

In questa guida sentirete spesso parlare di SQLite, ma cosa è di preciso? 

SQLite è una libreria che implementa un DBMS SQL, permettendo di creare un database all’interno 

di un unico file. Esso è molto indicato per scopi come il nostro, ovvero la creazione di 

applicazioni per dispositivi mobili, che non possono permettersi di avere un DMBS dedicato 

per la gestione delle basi di dati. 

Ovviamente fornisce un supporto parziale all’SQL, in quanto manca di alcune caratteristiche 

avanzate, che però dubito possiate utilizzare all’interno di un’applicazione. SQLite, comunque, 

è molto veloce e leggero, perfetto quindi per applicazioni per iPhone. 

DEFINIAMO UN NUOVO PROGETTO 

Iniziamo creando un nuovo progetto di tipo “Navigation-based Application” e chiamiamolo 

“sqlTutorial”. Abbiamo quindi creato un progetto che ci fornisce già l’implementazione di una 

tabella, che visualizzerà i dati letti dal nostro database. 

Dobbiamo, però, inserire altre due cose molto importanti: una classe che si occuperà di comunicare 

con il database, e la libreria che permette tale comunicazione. 

Iniziamo creando la classe che serirà ai nostri scopi. Andiamo in “File -> New File…” e creiamo 

una “Objective-C class”, chiamandola semplicemente “Data”: 


Dobbiamo ora inserire nel nostro progetto la libreria (o framework) che si occupa del collegamento 

con il database sql. Clicchiamo con il tasto destro sulla cartella “Frameworks” all’interno 

del nostro progetto, poi andiamo in “Add -> Existing Frameworks…” e dall’elenco seguente che 

apparirà selezioniamo “libsqlite3.0.dylib”: 


Abbiamo così terminato la definizione della struttura principale del nostro progetto. Se avete 

eseguito tutto in maniera corretta dovreste avere un progetto come questo: 

DEFINIAMO LA CLASSE “DATA” 

Dobbiamo ora implementare la classe “Data”, su cui si basa gran parte di questo capitolo. Prima 

di iniziare a scrivere codice, focalizziamo l’attenzione su ciò che deve fare questa classe. Essa 

avrà il compito di: 

• creare una connessione con il database (di cui noi specificheremo un indirizzo, in questo 

caso locale, ma nulla vieterebbe di avere un database in remoto); 

• interrogare la base di dati eseguendo una query impostata via codice; 

• inserire i risultati della query all’interno di un’array, che verrà poi visualizzato all’interno 

della tabella. 

Vediamo ora di implementare queste funzionalità, più altre caratteristiche che ci serviranno 

come supporto. 

Iniziamo aprendo il file “Data.h” e inserendo il seguente codice: 


1 

2 

3 

4 

5 

6 

7 

8 

9 

10 

11 

12 

13 

14 

15 

16 

17 

#import 

#import 

@interface Data : NSObject { 

! // Lista contenente i dati letti dal database 


} 

- (id)init:(NSString *)pathDB; 

- (void)caricaValoriDaDB:(NSString *)dbPath; 

- (unsigned)getSize; 

- (id)objectAtIndex:(unsigned)theIndex; 


@end 

Alla riga numero 6 abbiamo dichiarato un array (di tipo NSMutableArray, quindi modificabile 

anche dopo la sua inizializzazione), che conterrà i valori letti dal database. Dalla riga 10 alla 13 

abbiamo definito i metodi che ci serviranno in tale classe, che implementeremo fra poco. Da 

notare, inoltre, la classe importata alla riga 2: è necessaria per dire alla nostra classe di utilizzare 

la libreria che abbiamo importato all’inizio della guida. 

Apriamo ora il file “Data.m” e iniziamo ad inserire il seguente codice: 

1 

2 

3 

4 

5 

6 

7 

8 

9 

10 

11 

12 

13 

14 

15 

16 

17 

18 

19 

20 

21 

22 

23 

24 

#import "Data.h" 

static sqlite3 *database = nil; 

@implementation Data 


// Inizializziamo l'oggetto della classe Data 

- (id)init:(NSString *)pathDB{ 

! // carichiamo i valori dal database 

! [self caricaValoriDaDB:pathDB]; 

return self; 

} 

// Ritorna la dimensione della lista (n° di elementi letti dal db) 

- (unsigned)getSize { 


} 

// Ritorna l'oggetto ad una data posizione 

- (id)objectAtIndex:(unsigned)index { 

return [lista objectAtIndex:index]; 

} 


La prima istruzione particolare compare alla riga 3, ed è la definizione dell’oggetto che ci servirà 

per creare la connessione con il database. 

Alla riga 10 viene dichiarato il primo metodo, “init”, che deve essere invocato quando si vuole 

inizializzare un oggetto appartenente alla classe Data. Alla riga 12 viene chiamiamo il metodo 

“caricaValoriDaDB”, che ha il compito di interfacciarsi con il database ed eseguire le query sui 

dati (vedremo fra poco la sua implementazione). Il “return self” alla riga 13, infine, ritorna il 

puntatore dell”oggetto appena creato. 

Alla riga 17 definiamo “getSize”, un semplice metodo che ci ritorna la dimensione della lista, e 

quindi il numero di elementi letti dalla nostra query. Questo ci servirà quando andremo a definire 

la tabella. 

Infine, alla riga 22, definiamo un metodo che ci ritorna un oggetto presente ad una determinata 

posizione della nostra lista. Ad esempio, potremo recuperare il 5° elemento della nostra lista, 

per poi elaborarlo oppure mostrarlo all’utente. 

Dobbiamo ora implementare il metodo più complesso di questa classe, ovvero “caricaValori- 

DaDB”. Ecco il codice di tale metodo: 


1 

2 

3 

4 

5 

6 

7 

8 

9 

10 

11 

12 

13 

14 

15 

16 

17 

18 

19 

20 

21 

22 

23 

24 

25 

26 

27 

28 

29 

30 

31 

32 

33 

34 

35 

36 

// Carica i valori dal database passato come parametro 

- (void)caricaValoriDaDB:(NSString *)dbPath { 

! NSLog(@"path: %@",dbPath); 

! // lista temporanea 

! NSMutableArray *listaTemp = [[NSMutableArray alloc] init]; 

! // Oggetto che contiene i vari elementi 

NSMutableDictionary *dictionary; 

! 

! NSMutableString *idPersona;//id della persona 

! NSMutableString *nome;//nome della persona 

! NSMutableString *cognome;//cognome della persona 

! 

! if (sqlite3_open([dbPath UTF8String], &database) == SQLITE_OK) { 

! ! // query che ricava i valori 

! ! const char *sql = "select ID, Nome, Cognome from PERSO- 

NA"; 

! ! sqlite3_stmt *selectstmt; 

! ! 

! ! if(sqlite3_prepare_v2(database, sql, -1, &selectstmt, 

NULL) == SQLITE_OK) { 

! ! ! while(sqlite3_step(selectstmt) == SQLITE_ROW) { 

! ! ! ! // ricaviamo i valori letti dalla query 

! ! ! ! idPersona = [NSString 

stringWithUTF8String:(char *)sqlite3_column_text(selectstmt, 0)]; 

! ! ! ! nome = [NSString stringWithUTF8String:(char 

*)sqlite3_column_text(selectstmt, 1)]; 

! ! ! ! cognome = [NSString stringWithUTF8String:(char 

*)sqlite3_column_text(selectstmt, 2)]; 

! ! ! ! // inseriamo tutti i valori letti in un unico 

oggetto 

! ! ! ! dictionary = [[NSMutableDictionary alloc] 

initWithObjectsAndKeys:idPersona, @"id", nome, @"nome", cognome, 

@"cognome", nil]; 

! ! ! ! [listaTemp addObject:dictionary]; 

! ! ! ! [dictionary release]; 

! ! ! } 

! ! } 

! ! self.lista = listaTemp; 

! ! [listaTemp release]; 

! } 

! else 

! ! sqlite3_close(database); 

! NSLog(@"tutto ok"); 

} 

Iniziamo ad analizzare questo metodo. Partiamo dall’intestazione, in cui viene definito un parametro 

“dbPath”: questo è il percorso del nostro database. Esso lo definiremo in seguito, nella 

classe che gestisce la tabella. In questo tutorial il database sarà in locale, ovverò sarà fisicamente 

presente nella cartella del nostro progetto. Nulla vieta, comunque, di inserire un indirizzo 

remoto, che ci consenta di connetterci ad un database presente su un server. 


Subito dopo, creiamo alcuni oggetti, che ci servono per gestire i dati ricavati dalle query. Abbiamo, 

infatti, un oggetto “dictionary”, che conterrà i vari elementi ricavati dall’interrogazione 

al database. Le stringhe “idPersona”, “nome”, “cognome”, infatti, servono per salvare i valori 

letti, e inserirli all’interno dell’oggetto appena menzionato. 

Alla riga 13 viene aperta la connessione con il database: essa si trova all’interno di un costrutto 

“if”: se tale controllo da esito positivo, si possono elaborare i dati, altrimenti si passa alla fine 

del metodo, in quanto non è possibile instaurare una connessione con il database. Se la connessione 

è stata creata, possiamo creare la query che andremo poi ad eseguire (riga 15). Alla riga 18 

eseguiamo poi tale query: anche in questo caso, se l’esecuzione ha avuto successo, possiamo 

ricavare i valori desiderati, altrimenti non verrà eseguita nessuna operazione. 

Il ciclo while (riga 19) ci permetterà di scorrere tutti i risultati della nostra query (che potrebbero 

essere, ovviamente, più di uno), fino al termine. Potete notare che i risultati vengono inseriti 

in un oggetto di tipo “NSMutableDictionary”: esso è come un grande contenitore, che ci 

permette di inserire valori associandoci un tag (quello che facciamo alla riga 25). 

Come vedete non si tratta di operazioni complesse, si tratta solo di capire come funziona il 

meccanismo, che potete poi variare a seconda delle vostre esigenze. 

Gli ultimi due metodi da inserire nel file “Data.m” sono i seguenti: 

1 

2 

3 

4 

5 

6 

7 

8 

9 

+(void)finalizeStatements { 

! if(database) 

! ! sqlite3_close(database); 

} 

-(void)dealloc { 

! [lista release]; 

! [super dealloc]; 

} 

Il primo si occupa di concludere la query e di chiudere la connessione al database (va sempre 

messo), mentre il secondo è il classico “dealloc”. 

Abbiamo concluso con la definizione della classe “Data”. Ora vedremo come creare il nostro 

database e inserirlo nel progetto. 

CREIAMO IL DATABASE 

Quello che dobbiamo andare a realizzare è un semplice database, con tecnologia SQLite. Per 

crearlo utilizzeremo un plug-in per Firefox, chiamato” SQLite Manager”, che potete trovare a 

questo indirizzo (https://addons.mozilla.org/en-US/firefox/addon/5817). In alternativa esistono 

alcuni programmi dedicati, come SQLiteManager (http://www.sqlabs.com/sqlitemanager.php), 

che è, però, a pagamento. 


Dopo aver installato l’estensione, andiamo in “Strumenti -> SQLite Manager”, si avvierà il tool 

che ci permetterà di creare il nostro database. Clicchiamo sull’icona del foglio bianco per creare 

un nuovo database: 

e inseriamo “persone” come nome per il file: 


e scegliamo dove salvare il file (vi consiglio sulla Scrivania, così potrete recuperarlo subito in 

seguito). 

Abbiamo così creato il nostro database, che risulta però essere completamente vuoto. Dobbiamo, 

quindi, creare la tabella “Persone”. Per fare ciò, facciamo clic con il tasto destro su “Tables” 

che trovate nella parte sinistra della schermata, e selezioniamo “Create Table”: 

Si aprirà una nuova schermata, in cui dovrete definire gli attributi della tabella. Ecco cosa dovete 

inserire: 


e clicchiamo poi su “Yes” nel messaggio successivo che apparirà. 

Abbiamo inserito gli attributi necessari, ovvero nome, cognome e un identificativo univoco 

(id). 

Non ci resta che inserire dei valori nella tabella. Per fare ciò, andate nella sezione “Execute 

SQL” inserite le seguenti istruzioni: 

INSERT INTO PERSONA (id,Nome,Cognome) VALUES ('1','Giovanni','Verdi'); 

INSERT INTO PERSONA (id,Nome,Cognome) VALUES ('2','Paolo','Rossi'); 

INSERT INTO PERSONA (id,Nome,Cognome) VALUES ('3','Luca','Bianchi'); 

INSERT INTO PERSONA (id,Nome,Cognome) VALUES ('4','Andrea','Busi'); 

Un messaggio in “Last Error” vi comunicherà se vi sono stati errori nell’inserimento dei dati, 

oppure se tutto è andato per il verso giusto. 

Possiamo, infine, controllare i valori che abbiamo inserito, spostandoci nella sezione “Browse 

& Search”: 


Abbiamo concluso! Chiudiamo pure il programmino, i cambiamenti sono già stati apportati al 

nostro database. 

CONCLUDIAMO L’APPLICAZIONE 

Torniamo ora ad XCode, e concludiamo lo sviluppo della nostra applicazione. Per prima cosa, 

dobbiamo inserire il database che abbiamo creato nel nostro progetto. Trasciniamo il file all’interno 

di XCode: 

e nella schermata che apparirà inserite la spunta a “Copy items into destination group’s folder” 

e cliccate su “Add” 


Siamo pronti per completare la nostra applicazione. Iniziamo aprendo il file 

“RootViewController.h” e inseriamo il seguente codice: 

1 

2 

3 

4 

5 

6 

7 

8 

#import "Data.h" 


! // Oggetto con la lista degli elementi letti dal db 

! Data *dataList; 

} 

@end 

Alla riga 5 abbiamo dichiarato la lista che conterrà gli elementi letti dal database. Per capirci, è 

quella che viene creata dal metodo “caricaValoriDaDB”, che abbiamo definito in precedenza. 

Passiamo ora al file “RootViewController.m”. Iniziamo con il metodo “viewDidLoad”, che, come 

ormai dovreste sapere, ci consente di eseguire delle operazioni al caricamento dell’applicazione. 

Ecco come dovete modificare tale metodo: 

1 

2 

3 

4 

5 

6 

7 

8 

9 

10 



! self.title = @"Lista Autori"; 

! //leggiamo il path del database 

! NSString *defaultDBPath = [[[NSBundle mainBundle] resourcePath] 

stringByAppendingPathComponent:@"persone.sqlite"]; 

! 

! //creiamo la lista degli autori 

! dataList = [[Data alloc] init:defaultDBPath]; 

} 

Alla riga 4 impostiamo il titolo alla nostra tabella, mentre alla riga 6 definiamo il percorso del 

nostro database. A prima vista può sembrare complessa, ma essa non fa altro che rilevare il percorso 

in cui si trova l’applicazione (sia essa su iPhone Simulator che su iPhone fisico) e aggiungere 

a tale percorso “persone.sqlite”, che è proprio il database che abbiamo inserito nel nostro 

progetto. 

Alla riga 9, infine, inizializiamo la lista, passando alla funzione “init” proprio il percorso che 

abbiamo definito poche righe sopra. 

Dobbiamo, ora, definire i metodi necessari per settare la tabella. Abbiamo già visto questi metodi 

nei tutorial dedicati alle TableView, quindi non mi soffermerò troppo sulla spiegazione. 

Sempre all’interno del file “RootViewController.m”, scorretelo verso il fondo, e troverete i metodi 

del protocollo UITableView, che dovrete completare nel seguente modo: 


1 

2 

3 

4 

5 

6 

7 

8 

9 

10 

11 

12 

13 

14 

15 

16 

17 

18 

19 

20 

21 

22 

23 

24 

25 

26 

- (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView { 

return 1; 

} 

// Customize the number of rows in the table view. 



return [dataList getSize]; 

} 

// Customize the appearance of table view cells. 


cellForRowAtIndexPath:(NSIndexPath *)indexPath { 

static NSString *CellIdentifier = @"Cell"; 

UITableViewCell *cell = [tableView 

dequeueReusableCellWithIdentifier:CellIdentifier]; 

if (cell == nil) { 

cell = [[[UITableViewCell alloc] 

initWithStyle:UITableViewCellStyleDefault 

reuseIdentifier:CellIdentifier] autorelease]; 

} 

! 

! NSDictionary *itemAtIndex = (NSDictionary *)[dataList 

objectAtIndex:indexPath.row]; 

! cell.textLabel.text = [itemAtIndex objectForKey:@"nome"]; 

} 

return cell; 

I tre metodi sono i soliti che vanno inseriti quando si lavora con le UITableView. Concentriamoci 

un attimo sulle righe 22 e 23. Esse hanno il compito di ricavare un oggetto dalla lista “dataLista” 

(che contiene tutti i valori letti da database), per estrarne poi il nome desiderato (ovviamente 

vengono estratti tutti i nomi, dal primo all’ultimo). Potete vedere che dall’oggetto 

“itemAtIndex” viene estratto solo il nome: potremmo creare anche altre combinazioni, ad 

esempio con il cognome. Per fare ciò vi basterà modificare la riga 23 ad esempio nel seguente 

modo: 

1 [itemAtIndex objectForKey:@"cognome"]; 

Abbiamo concluso la nostra applicazione! Clicchiamo su “Build and Go!” e controlliamo che 

funzioni tutto in maniera corretta. 



Parte 2: 

semplici applicazioni 


Capitolo 14: Creiamo un semplice lettore di feed RSS 

In questa prima applicazione realizzeremo un semplice ma utilissimo lettore di feed RSS. Vedremo, 

infatti, come leggere i dati (solitamente degli articoli) di un feed, visualizzandoli in una 

tabella. 

Per realizzare questo semplice lettore di feed RSS utilizzeremo due aspetti che abbiamo già 

visto nei precedenti capitoli: la gestione delle tabelle (capitolo 9) e l’utilizzo di XML (capitolo 

12). Gli elementi relativi a questi due aspetti, quindi, non verranno più spiegati in questo capitolo, 

ma verranno considerati come già appresi dal lettore. Ci concentreremo, quindi, solo sugli 

elementi di rilievo per il lettore di feed RSS. 


Iniziamo creando un nuovo progetto di tipo “Navigation-based Application” e chiamiamolo 

“SimpleRSSReader”. Abbiamo così creato il nostro nuovo progetto, che ci fornisce già una 

struttura a tabella, ottima per il nostro scopo. 

Solitamente la prima cosa che facciamo è realizzare la struttura grafica dell’applicazione. Oggi, 

però, non sarà necessario, in quanto XCode ci fornisce già un template predisposto, contenente 

una tabella che conterrà gli elementi che andremo a leggere. 

Il primo file che andremo a modificare è “RootViewController.h”. Apritelo e, al suo interno, 

scrivete il seguente codice: 

1 

2 

3 

4 

5 

6 

7 

8 

9 

10 

11 

12 

13 

14 

15 

16 

17 


! // parser XML 

! NSXMLParser *rssParser; 

! // elenco degli elementi letti dal feed 

! NSMutableArray *elencoFeed; 

! 

! //variabile temporanea per ogni elemento 

! NSMutableDictionary *item; 

! 

! // valori dei campi letti dal feed 

! NSString *currentElement; 

! NSMutableString *currentTitle, *currentDate, *currentSummary, 

*currentLink; 

} 

- (void)parseXMLFileAtURL:(NSString *)URL; 

@end 

Alla riga 3 abbiamo definito il nostro parser XML, che si occuperà di leggere il feed RSS e di 

convertirne gli elementi. Alla riga 5 è definito un NSMutableArray, ovvero una collezione di 

oggetti, in cui inseriremo i vari feed letti (con le varie informazioni, ovvero titolo, data, testo, 


etc). Le dichiarazioni alle righe 8, 11 e 12 servono proprio per i metodi del parser, sono i valori 

che vengono letti e che devono essere inseriti in un unico elemento (“item”), che andrà poi a 

comporre la lista degli elementi letti (“elencoFeed”). 

Apriamo, ora, il file “RootViewController.m”, in cui troverete già i metodi necessari per la definizione 

della tabella. Iniziamo a modificare i metodi già presenti, modificandoli a seconda 

delle nostre necessità. 

Il primo metodo da modificare è il seguente: 

1 

2 

3 



return [elencoFeed count]; 

} 

Come già sapete, questo metodo imposta il numero di righe della nostra tabella. Tale numero 

deve essere pari al numero di elementi che scarichiamo dal feed RSS. Ad esempio, se abbiamo 

ricavato 10 notizie dal nostro feed, dovranno essere 10 le righe della tabella, ovvio vero? 

Dobbiamo ora modificare il metodo che si occupa di inserire il testo all’interno delle varie celle. 

Ecco il metodo che si occupa di ciò: 

1 

2 

3 

4 

5 

6 

7 

8 

9 

10 

11 

12 

13 

14 







cell = [[[UITableViewCell alloc] 

initWithStyle:UITableViewCellStyleDefault 

reuseIdentifier:CellIdentifier] autorelease]; 

} 

! 

! // Configure the cell. 

! cell.textLabel.text = [[elencoFeed objectAtIndex:indexPath.row] 

objectForKey:@"title"]; 

! 


} 

Troverete anche questo metodo già definito, dovrete solo aggiungere l’istruzione alla riga 11. 

Tale istruzione va a ricavare l’elemento desiderato dalla lista (che coincide con il numero di riga, 

ricavato da “indexPath.row”), estrae il campo “title” (ovvero il titolo di ogni singolo elemento 

del feed RSS che avremo scaricato) e lo setta come contenuto della cella. 


Se provassimo ad eseguire il programma adesso, vedremmo che non farebbe ancora niente. 

Non abbiamo, infatti, ancora aggiunto la possibilità di scaricare il feed e di utilizzarlo. Quindi 

ora facciamo proprio questo. 

DEFINIAMO LE AZIONI DEL PARSER 

Ci siamo occupati, fino ad ora, solo della definizione della tabella. Non abbiamo ancora visto 

nessun aspetto relativo al parser XML. 

Iniziamo, quindi, dal metodo “viewDidLoad” (lo trovate commentato nelle prime righe della 

classe): 

1 

2 

3 

4 

5 

6 

7 

8 

9 

10 

11 



! self.title = @"BubiDevs"; 

! 

! NSString *path = @"http://feeds.feedburner.com/TheBubiDevs"; 

! [self parseXMLFileAtURL:path]; 

! 



// self.navigationItem.rightBarButtonItem = self.editButtonItem; 

} 

Come vedete abbiamo aggiunto alcune istruzioni. Alla riga 4 abbiamo settato un titolo alla nostra 

applicazione, che comparirà nella navigation bar sopra la tabella. Alla riga 6, invece, viene 

definita, una stringa “path”, in cui inseriamo l’indirizzo del feed RSS che vogliamo leggere. In 

questo caso io ho inserito l’indirizzo del feed del mio blog, BubiDevs, nulla vi vieta di inserire 

l’indirizzo del vostro feed preferito (speriamo che sia uguale al mio! ;-) ). Alla riga successiva, 

infine, avviamo il parsing del feed (tramite il metodo “parseXMLFileAtURL”, di cui abbiamo 

definito l’intestazione nel file “RootViewController.h”), passando proprio l’indirizzo “path” 

come parametro. 

Tale metodo, però, non è ancora stato implementato nella nostra funzione. Ecco, quindi, come 

dovrete definirlo: 


1 

2 

3 

4 

5 

6 

7 

8 

9 

10 

11 

12 

13 

14 

15 

16 

17 

18 

19 

20 

- (void)parseXMLFileAtURL:(NSString *)URL { 

! // inizializziamo la lista degli elementi 

! elencoFeed = [[NSMutableArray alloc] init]; 

! 

! // dobbiamo convertire la stringa "URL" in un elemento "NSURL" 

! NSURL *xmlURL = [NSURL URLWithString:URL]; 

! 

! // inizializziamo il nostro parser XML 

! rssParser = [[NSXMLParser alloc] initWithContentsOfURL:xmlURL]; 

! 

! [rssParser setDelegate:self]; 

! 

! // settiamo alcune proprietà 

! [rssParser setShouldProcessNamespaces:NO]; 

! [rssParser setShouldReportNamespacePrefixes:NO]; 

! [rssParser setShouldResolveExternalEntities:NO]; 

! 

! // avviamo il parsing del feed RSS 

! [rssParser parse]; 

} 

Come vedete il metodo non è molto complicato. I commenti presenti vi possono chiarire le 

varie istruzioni. Si parte dall’inizializzazione dell’array “elencoFeed” (riga 3), per poi passare all’inizializzazione 

del parser XML (riga 6) e al suo avvio (riga 19). 

Per funzionare correttamente, il parser ha bisogno di altri due metodi. Eccoveli (anche questi 

sono da inserire in “RootViewController.m”): 


1 

2 

3 

4 

5 

6 

7 

8 

9 

10 

11 

12 

13 

14 

15 

16 

17 

18 

19 

20 

21 

22 

23 

24 

25 

26 

27 

28 

- (void)parser:(NSXMLParser *)parser didStartElement:(NSString *)elementName 


qualifiedName:(NSString *)qName attributes:(NSDictionary *)attributeDict{! 

! ! 

! currentElement = [elementName copy]; 

! if ([elementName isEqualToString:@"item"]) { 

! ! // inizializza tutti gli elementi 

! ! item = [[NSMutableDictionary alloc] init]; 

! ! currentTitle = [[NSMutableString alloc] init]; 

! ! currentDate = [[NSMutableString alloc] init]; 

! ! currentSummary = [[NSMutableString alloc] init]; 

! ! currentLink = [[NSMutableString alloc] init]; 

! } 

} 

- (void)parser:(NSXMLParser *)parser didEndElement:(NSString *)elementName 


qualifiedName:(NSString *)qName{ 

! 

! if ([elementName isEqualToString:@"item"]) { 

! ! /* salva tutte le proprietà del feed letto nell'elemento 

"item", per 

! ! poi inserirlo nell'array "elencoFeed" */ 

! ! [item setObject:currentTitle forKey:@"title"]; 

! ! [item setObject:currentLink forKey:@"link"]; 

! ! [item setObject:currentSummary forKey:@"summary"]; 

! ! [item setObject:currentDate forKey:@"date"]; 

! ! 

! ! [elencoFeed addObject:[item copy]]; 

! } 

} 

Questi due metodi vengono richiamati, rispettivamente, quando inizia e quando finisce un 

elemento XML. Nel primo caso dovremo re-inizializzare tutti gli elementi, in modo da poter 

leggere un nuovo elemento senza errori. Al contrario, quando un elemento XML termina dovremo 

salvare tutti questi valori letti in un unico elemento (“item”) e inserirlo nella lista dei 

feed letti (“elencoFeed”). 

Per completare la definizione del parser ci mancano solo due metodi: 


1 

2 

3 

4 

5 

6 

7 

8 

9 

10 

11 

12 

13 

14 

15 

16 

17 

- (void)parser:(NSXMLParser *)parser foundCharacters:(NSString 

*)string{; 

! // salva i caratteri per l'elemento corrente 

! if ([currentElement isEqualToString:@"title"]){ 

! ! [currentTitle appendString:string]; 

! } else if ([currentElement isEqualToString:@"link"]) { 

! ! [currentLink appendString:string]; 

! } else if ([currentElement isEqualToString:@"description"]) { 

! ! [currentSummary appendString:string]; 

! } else if ([currentElement isEqualToString:@"pubDate"]) { 

! ! [currentDate appendString:string]; 

! } 

} 

- (void) parserDidEndDocument:(NSXMLParser *)parser { 

! [self.tableView reloadData]; 

} 

Il primo metodo viene richiamato ogni volta che viene letto un carattere all’interno del feed. A 

seconda dell’elemento che siamo considerando, andremo a inserire il carattere letto in coda a 

quelli già letti dello stesso carattere, in modo da ricostruire l’informazione completa. Ad esempio, 

stiamo considerando l’elemento “title”. Vengono letti, nell’ordine, i seguenti caratteri 

“Dev”, “Tutorial “, “#2ʺ″. Unendo i vari caratteri letti ricostruiremo il titolo esatto del nostro 

feed, ovvero “DevTutorial #2ʺ″. 

Il secondo metodo, invece, viene richiamato solo quando il parser completa la lettura del feed 

RSS, e noi non faremo altro che dire alla tabella di ricarcarsi (verranno, quindi, richiamati i metodi 

per settare il numero di righe e per inserire il testo nelle varie celle). 

CONCLUDIAMO L’APPLICAZIONE 

Abbiamo ormai concluso la nostra applicazione!! 

Come sempre dobbiamo ricordarci di completare il metodo “dealloc”, che è davvero molto importante, 

soprattutto nelle applicazioni di un certo grado di complessità. Ecco come dovrete 

definire il metodo: 

1 

2 

3 

4 

5 

6 

7 

8 

9 

10 

11 

12 

- (void)dealloc { 

! [currentElement release]; 

! [rssParser release]; 

! [elencoFeed release]; 

! [item release]; 

! [currentTitle release]; 

! [currentDate release]; 

! [currentSummary release]; 

! [currentLink release]; 

! 

[super dealloc]; 

} 


Ora siamo pronti per compilare ed eseguire la nostra applicazione! Cliccate su “Build and Run!” 

e testare il vostro personalissimo lettore di feed RSS!! 

UN PICCOLO MIGLIORAMENTO 

La nostra applicazione funziona ma.. provate a cliccare su un elemento. Non succederà niente. 

Non sarebbe invece più carino se si aprisse la pagina in Safari che ci permetta di leggere l’intera 

notizia? 

È presto fatto! Sempre all’interno di “RootViewController.m” cercate il metodo “tableView: 

didSelectRowAtIndexPath:” (è uno di quelli commentati di cui vi avevo accennato prima). 


Questo metodo viene richiamato ogni volta che si “clicca” su una cella. Sarà qui che andremo 

ad inserire il codice necessario: 

1 

2 

3 

4 

5 

6 

7 

8 

9 

10 

11 

12 

13 



! // ricaviamo il link dell'elemento selezionato 

! NSString *link = [[elencoFeed objectAtIndex:indexPath.row] objectForKey: 

@"link"]; 

! 

! // ripuliamo il link da spazi, return e tabs 

! link = [link stringByReplacingOccurrencesOfString:@" " 

withString:@""]; 

! link = [link stringByReplacingOccurrencesOfString:@"\n" 


! link = [link stringByReplacingOccurrencesOfString:@"! " 


! 

! // apriamo la notizia in Safari 

! [[UIApplication sharedApplication] openURL:[NSURL 

URLWithString:link]]; 

} 

Il procedimento è molto simile a quello visto per la definizione delle celle della tabella. Alla riga 

4, infatti, andiamo a ricavare la proprietà “link” dell’elemento selezionato, associandola ad 

una stringa chiamata appunto “link”. Con le istruzioni seguenti, invece, ripuliamo l’indirizzo da 

eventuali caratteri indesiderati, come spazi, return o tab. Con l’istruzione alla riga 12, infine, 

apriamo Safari passandogli come parametro proprio il link da noi voluto (che deve essere trasformato 

in un NSURL). Fatto! 

Salvate il tutto, cliccate su “Build and Run” e godetevi la vostra bellissima applicazione!! 



Capitolo 15: Creiamo un client per Twitter! 

Attenzione: recentemente Twitter ha cambiato le modalità di accesso, abbandonando le API 

che vengono sfruttate in questo tutorial. Ne deriva, quindi, che questa guida non funziona correttamente, 

in quanto l’applicazione non riesce a leggere i dati da Twitter. Sono già al lavoro 

per cercare di sistemare questo problema, spero di poter aggiornare la guida in tempi brevi. 

Dopo aver creato un semplice lettore di feed RSS, complichiamo un po’ le cose. In questo capitolo 

realizzeremo un nostro personalissimo client per Twitter, uno dei social network di maggior 

successo dell’ultimo periodo (io lo trovo molto utile). 

Nella realizzazione di questa applicazione vedremo vari aspetti diversi. Utilizzeremo, infatti, 

una classe che ho trovato su Internet: MGTwitterEngine (link del sito originale), che ci permetterà 

di interagire in maniera facile e veloce con Twitter. Analizzeremo, poi, altri due aspetti 

molto importanti: le UITableViewCe", ovvero le celle personalizzate per le UITableView e la 

classe NSUserDefault, che ci permetterà di salvare i dati della nostra applicazione. 

PARTE 1: CONNETTIAMOCI A TWITTER 

Nella prima parte del tutorial vedremo come connetterci a Twitter utilizzando la classe 

MGTwitterEngine che abbiamo già nominato più volte. Leggeremo, poi, tutta la nostra timeline 

e la salveremo all’interno di una struttura dati che creeremo appositamente. 

IMPOSTIAMO LA LIBRERIA “MGTWITTERENGINE” 

Iniziamo creando un nuovo progetto di tipo “View-based application” e chiamiamolo “SampleTwitterClient”. 

Prima di fare qualsiasi altra cosa, dobbiamo inserire la libreria MGTwitterEngine, che ci 

permetterà di interagire con Twitter. Scaricate l’ultima versione da questa repository SVN (trovate 

qui una mia guida su come fare), oppure scarica la versione 1.08 che vi mettiamo noi a disposizione 

(la trovate anche nei codici sorgenti forniti insieme a questo libro). 

Estraiamo l’archivio ed apriamo il file “MGTwitterEngine.xcodeproj”, un progetto esempio 

fornito dai creatori della classe, che potete guardare per avere una panoramica della libreria. La 

procedura da seguire è spiegata nel file “README.txt” di questo progetto, ma vi illustrerò tutti 

i passaggi in modo che non abbiate problemi di alcun genere. 

A noi interessa la cartella “MATwitterEngine” che trovate all’interno di “Classes”: 


Prendetela e trascinatela all’interno del nostro progetto “SimpleTwitterClient” che abbiamo 

creato poco fa: 

e cliccate su “Add” nella schermata che vi apparirà appena rilascerete la cartella, ricordandovi di 

mettere il segno di spunta nell’opzione in alto. 


Possiamo chiudere il progetto “MGTwitterEngine” e tornare al nostro “SampleTwitterClient”. 

Importiamo, ora, il framework che si dovrà occupare del parsing XML. Clicchiamo con il tasto 

destro sulla cartella “Frameworks” e scegliamo “Add” -> “Existing Frameworks…”: 

Dall’elenco che appare selezioniamo poi “libxml2.dylib” e clicchiamo su “Add”. 


Abbiamo così importato il framework necessario. 

Ci manca solo un’operazione per fare in modo che la libreria “MGTwitterEngine” funzioni alla 

perfezione. Facciamo doppio clic sul nome del progetto per aprirne le proprietà. Nella sezione 

“Build” cerchiamo la voce “Header Search Path”: 


facciamo doppio clic su tale voce e quando si apre inseriamoci la stringa “$SDKROOT/usr/include/libxml2ʺ″ 

(ci basterà cliccare sul bottoncino “+”): 

Clicchiamo infine su “OK”. Abbiamo concluso la fase iniziale di creazione del nostro progetto. 

DEFINIAMO LA VISTA DI CARICAMENTO 

XCode ha già creato per noi una vista, “SampleTwitterClientViewController.xib”. Questa verrà 

caricata all’avvio dell’applicazione, sarà quindi qui che andremo a leggere la nostra timeline di 

Twitter. Prima di fare ciò, creiamo un semplice aspetto grafico per questa vista. 

Aprite il file “SampleTwitterClientViewController.xib” e modificatelo a vostro piacere. Io l’ho 

impostato così: 


L’unico componente di rilievo è il componente “UIActivityIndicatorView” posto sotto la label 

“Caricamento in corso...”, che utilizzeremo per far capire all’utente che l’applicazione sta caricando 

i dati e non è bloccata. 

Salvate il file e chiudete pure Interface Builder. 

CREIAMO LA CLASSE “TWEET” 

Come abbiamo già detto, la nostra applicazione andrà a leggere la timeline del nostro account 

di Twitter. Dobbiamo creare una classe, quindi, in grado di ospitare le informazioni di ogni singolo 

tweet letto. Per semplicità, ci limiteremo a salvare solo alcuni dati di ogni tweet: il nome 

dell’utente che ha “cinguettato”, la sua immagine del profilo e il testo del tweet. 

Facciamo clic con il tasto destro su “Classes” e clicchiamo poi su “Add” -> “New File…”. Creiamo 

poi una classe del tipo “Objective-C class”, e chiamiamola “Tweet”. Vediamo di definire le 

variabili e i metodi di questa classe. 


Nel file “Tweet.h” inseriamo il seguente codice: 

1 

2 

3 

4 

5 

6 

7 

8 

9 

10 

11 

12 

13 

#import 

@interface Tweet : NSObject { 

! NSString *testo; 

! NSString *user; 

! UIImage *immagine; 

} 

@property (nonatomic, retain) NSString *testo; 

@property (nonatomic, retain) NSString *user; 

@property (nonatomic, retain) UIImage *immagine; 

@end 

Abbiamo dichiarato tre elementi, come vi ho anticipato poco fa: 

1. testo, che conterrà il messaggio del tweet, il testo appunto; 

2. user, che conterrà l’username di chi ha inserito il tweet letto; 

3. immagine, è l’immmagine (l’avatar) dell’utente che ha lasciato il tweet. 

Niente di complicato quindi. Nel file “Tweet.m” dovrete solo implementare il metodo “dealloc” 

e inserire “@synthesize”: 

1 

2 

3 

4 

5 

6 

7 

8 

9 

10 

11 

12 

13 

14 

15 

#import "Tweet.h" 

@implementation Tweet 

@synthesize testo, user, immagine; 

-(void)dealloc{ 

! [testo release]; 

! [user release]; 

! [immagine release]; 

! [super dealloc]; 

} 

@end 

Ovviamente se intendete creare un client più complesso potrete aumentare i componenti di 

questa classe, oppure inserire dei metodi che eseguano qualche operazione (ad esempio un controllo 

dei dati). Per questo tutorial, tuttavia, ci basteranno questi semplici elementi. 

DEFINIAMO LA CLASSE “SAMPLETWITTERCLIENTVIEWCON- 

TROLLER” 

È venuto finalmente il momento di implementare la classe che si occuperà di leggere la timeline 

di Twitter. 

Apriamo il file “SampleTwitterClientViewController.h” e inseriamo il seguente codice: 


1 

2 

3 

4 

5 

6 

7 

8 

9 

10 

11 

12 

13 

14 

15 

16 

17 

18 

19 

20 

#import 

#import "MGTwitterEngine.h" 

@class Tweet; 

@interface SampleTwitterClientViewController : UIViewController 

{ 

! MGTwitterEngine *twitterEngine; 

! NSMutableArray *listaTweet; 

! 

! IBOutlet UIActivityIndicatorView *spinner; 

} 

-(NSString*)getMessaggio:(NSDictionary*)element; 

-(NSString*)getUser:(NSDictionary*)element; 

-(NSURL*)getUrlImage:(NSDictionary*)element; 

@property (nonatomic, retain) NSMutableArray *listaTweet; 

@property (nonatomic, retain) IBOutlet UIActivityIndicatorView 

*spinner; 

@end 

Alla riga 7 abbiamo definito un elemento di tipo “MGTwitterEngine”, proprio quello della classe 

che abbiamo inserito all’inizio del tutorial. Sarà questo componente che si occuperà della 

connessione con Twitter e della lettura della nostra timeline. Nell’intestazione (riga 6) abbiamo 

anche inserito il protocollo di questa classe, che ci “obbliga” così ad implementare dei metodi 

che vedremo in seguito. 

L’array dichiarato alla riga 8 conterrà vari elementi del tipo “Tweet”, ognuno dei quali conterrà 

un tweet letto dal nostro account. Sarà, quindi, una lista che conterrà tutti i tweet della nostra 

timeline. 

La riga 10, invece, contiene la definizione della “spinning wheel”, ovvero la classica “rotella che 

gira”, l’UIActivityIndicatorView che abbiamo inserito in precedenza nella vista (e che collegheremo 

fra poco in IB). 

Ci sono poi 3 metodi getter (“getMessaggio”, “getUser” e “getUrlImage”) che avranno il compito 

di ricavare il campo desiderato, partendo dall’NSDictionary che ricevono in input, e di salvare 

le varie informazioni di ogni singolo tweet. 

Salviamo la classe e, prima di continuare l’implementazione, apriamo nuovamente il file 

“SampleTwitterClientViewController.xib”, in cui dovremo collegare l’elemento “UIActivityIndicatorView” 

che abbiamo appena definito con quello che abbiamo inserito in IB. 

Dal Pannello dei Documenti clicchiamo sul “File’s Owner” e andiamo poi nel “Connections 

Inspector”. Colleghiamo l’elemento “spinner” con il componente grafico “UIActivityIndicatorView” 

che abbiamo inserito in precedenza. Se abbiamo eseguito tutto correttamente avrete 

il seguente risultato: 


Possiamo salvare e chiudere Interface Builder 

LEGGIAMO LA TIMELINE 

Iniziamo ad implementare il codice che deve leggere i tweet dalla nostra timeline. Apriamo il 

file “SampleTwitterClientViewController.m” ed inseriamo il seguente codice: 

1 

2 

3 

4 

5 

6 

7 

8 

9 

10 

11 

12 

13 

14 

15 

16 

17 

18 

19 

20 

21 

22 

#import "SampleTwitterClientViewController.h" 


@implementation SampleTwitterClientViewController 

@synthesize listaTweet, spinner; 

-(void)viewDidLoad{ 

! 

! // Username e password per accedere a Twitter 

NSString *username = @"user_name"; 

NSString *password = @"password"; 

// Create a TwitterEngine and set our login details. 

twitterEngine = [[MGTwitterEngine alloc] initWithDelegate:self]; 

[twitterEngine setUsername:username password:password]; 

// Get updates from people the authenticated user follows. 

[twitterEngine getFollowedTimelineFor:username since:nil 

startingAtPage:0]; 

! ! 

! [spinner startAnimating]; 

} 

Non preoccupatevi troppo di capire il codice, in quanto l’ho preso direttamente dall’esempio 

fornito con la classe “MGTwitterEngine”. Ricordatevi, comunque, di inserire i vostro dati per il 

login alla riga 11 e 12. Le righe seguenti, invece, servono per inizializzare l’elemento “twitterEngine”, 

che si occuperà di leggere la timeline di Twitter. 

Alla riga 21, inoltre, abbiamo avviato la rotella (che fermeremo quando la procedura di lettura e 

conversione dei dati sarà terminata). 


Nota: se invece di leggere la vostra timeline vorreste leggere i messaggi di un utente (non la 

sua timeline, solo i suoi tweet) dovete sostituire l’istruzione alla riga 19 con la seguente: 

1 [twitterEngine getUserTimelineFor:username sinceID:nil 

startingAtPage:0 count:5]; 

Inseriamo, ora, dei metodi obbligatori da inserire, in quanto parte del delegato “MGTwitterEngineDelegate”. 

Eccoli: 

1 

2 

3 

4 

5 

6 

7 

8 

9 

10 

11 

12 

13 

14 

15 

16 

17 

18 

19 

20 

21 

22 

23 

24 

- (void)requestSucceeded:(NSString *)requestIdentifier{ 

NSLog(@"Request succeeded (%@)", requestIdentifier); 

} 

- (void)requestFailed:(NSString *)requestIdentifier 

withError:(NSError *)error{ 

NSLog(@"Twitter request failed! (%@) Error: %@ (%@)", requestIdentifier, 

[error localizedDescription], 

[[error userInfo] objectForKey:NSErrorFailingURLStringKey]); 

! [spinner stopAnimating]; 

! UIAlertView *alert = [[UIAlertView alloc] 

initWithTitle:@"Errore!" 

message:@"Connessione non riuscita.\nControlla i dati d'accesso" 

delegate:self cancelButtonTitle:@"OK" otherButtonTitles:nil]; 

! [alert show]; 

! [alert release]; 

} 

- (void)directMessagesReceived:(NSArray *)messages 

forRequest:(NSString *)identifier{ 

NSLog(@"Got direct messages:\r%@", messages); 

} 

- (void)userInfoReceived:(NSArray *)userInfo forRequest:(NSString 

*)identifier{ 

NSLog(@"Got user info:\r%@", userInfo); 

} 

- (void)miscInfoReceived:(NSArray *)miscInfo forRequest:(NSString 

*)identifier{ 

! NSLog(@"Got misc info:\r%@", miscInfo); 

} 

L’unico metodo a cui ho aggiunto un po’ di codice è il secondo, ovvero “requestFailed: withError:”. 

Questo è richiamato se la connessione con Twitter non è possibile, quindi avviamo una 

UIAlertView che lo comunica all’utente e fermiamo la rotella. Come messaggio comunichiamo 

che i dati d’accesso sono errati, in realtà dovremmo controllare il codice d’errore e inserire un 

messaggio a seconda dell’errore riscontrato (potrebbe non essere presente la connessione, oppure 

Twitter potrebbe essere down, o i dati inseriti potrebbero essere errati, etc). 


Mancano solo pochi metodi per concludere questo primo tutorial. Ecco cosa dovete inserire 

ora: 

1 

2 

3 

4 

5 

6 

7 

8 

9 

10 

11 

12 

13 

14 

15 

16 

17 

18 

19 

20 

21 

22 

23 

24 

25 

26 

27 

28 

29 

- (void)statusesReceived:(NSArray *)statuses forRequest:(NSString 

*)identifier{ 

! 

! listaTweet = [[NSMutableArray alloc] init]; 

! Tweet *elemento; 

! 

for (int i=0; i

molto semplice leggere le informazioni dei vari campi, vi basterà utilizzare il metodo “object- 

ForKey” e inserire l’attributo che volete leggere. 

Nota: il metodo “getUser” ci restituisce il nome completo dell’utente di cui abbiamo letto il 

messaggio. Se volete, invece, solo leggerne il nickname utilizzate questa istruzione (riga 23): 

1 return [[element objectForKey:@"user"] objectForKey:@"screen_name"]; 

Quello che potrebbe sembrarvi più complicato è la lettura dell’immagine. Il metodo “getUrlImage” 

ci restituisce un elemento NSURL, che è l’indirizzo web dell’immagine dell’utente. Alla 

riga 10 creiamo, poi, un’immagine a partire dai dati letti a quell’indirizzo (XCode ci restituisce 

infatti un elemento NSData, che va convertito in UIImage). L’immagine convertita viene poi 

inserita nell’elemento corrente (ovviamente nel campo “immagine”). 

Alla fine del ciclo for avremo la “listaTweet” che conterrà n elementi di tipo Tweet, ognuno dei 

quali avrà le informazioni ricavate in precedenza. Proprio ciò che volevamo. 

Abbiamo così completato questa prima parte del tutorial! 

PARTE 2: CREIAMO LA TABELLA CON I TWEET LETTI 

In questa seconda parte vedremo come creare una tabella con le celle personalizzate, che dovrà 

visualizzare gli elementi Tweet che abbiamo salvato nella lista. Utilizzeremo, quindi, la classe 


UITableViewCell per creare delle celle personalizzate, in modo da ottenere una tabella con 

un layout ad-hoc. 

Come prima cosa, andremo a creare la tabella che conterrà i tweet letti dalla nostra timeline. 

Iniziamo a creare, quindi, una tabella e la classe per gestirla. 

Andiamo “File” -> “New File…” e dalla sezione “Cocoa Touch Class” scegliamo “UIViewController 

subclass”, mettendo la spunta sulle opzioni “UITableViewController subclass” e “With 

XIB for user interface”. 

Facendo così avremo già un file “.xib” contenente una tabella e la classe associata, risparmiando 

tempo e lavoro. 

Se abbiamo creato tutto in modo corretto avremo i seguenti file nel nostro progetto (io li ho 

spostati per avere tutto ordinato): 


Apriamo il file “tabellaTwitterViewController.xib”, dovremo fare una piccola modifica. Dal 

Pannello dei Documenti selezioniamo la “Table View” (ovvero la tabella) e apriamo poi il “Size 

Inspector”. Modifichiamo l’altezza delle celle, portando il valore a 70. Il campo da modificare è 

il seguente: 

Ovviamente potete dimensionare le celle a vostro piacimento, io ho ritenuto questa dimensione 

accettabile per la struttura che avevo in mente. 

Abbiamo così concluso la definizione grafica della tabella. Possiamo salvare e chiudere Interface 

Builder. 

CREIAMO LA CELLA PERSONALIZZATA 

Vediamo, ora, un’aspetto nuovo. Solitamente quando utilizziamo le tabelle ci limitiamo ad inserire 

del testo che sarà contenuto all’interno della cella. Per questo tutorial, invece, andremo a 

creare una nostra cella personalizzata, che comporrà poi la tabella. 


Il procedimento non è difficile, però merita attenzione per non perdere nessun passaggio. Iniziamo 

creando un file xib vuoto (“File” -> “New File…” -> “Empty XIB”) e chiamiamolo “cellaTweet”. 

Facciamo doppio clic sul file appena creato per aprirlo in IB. 

Inseriamo all’interno della vista un componente di tipo “UITableViewCell”: 

Facciamo doppio clic sul componente che abbiamo appena inserito, si aprirà questa piccola vista: 

Questa è la base della nostra cella personalizzata. Fra poco inseriremo i componenti che conterranno 

poi le informazioni che desideriamo (che saranno, ovviamente, quelle che abbiamo 

fatto salvare nella prima parte del tutorial, quindi nome utente, testo del tweet e immagine dell’utente). 

Prima di fare ciò, andiamo nel “Size Inspector” e modifichiamo l’altezza a 70 (lo stesso 

valore che abbiamo impostato prima nella tabella, ricordate?): 


Andiamo, poi, nell’”Attributes Inspector” e nel campo “Identifier” inseriamo “Cell”: 

Ora inseriamo gli elementi che dovranno comporre tutte le singole celle. Ci serviranno due 

UILabel e una UIImageView. Io le ho disposte e personalizzate come vedete di seguito, voi siete 

liberissimi di inserirle in maniera diversa! 


Manca solo una piccola operazione. Dobbiamo dare ai componenti un identificatore univoco, 

in modo che potremo, poi, selezionarli via codice in maniera molto veloce. Selezioniamo la 

UIImageView e andiamo nell’”Attributes Inspector”. Nel campo tag inseriamo il valore 0 (dovrebbe 

già essere presente): 

Facciamo la stessa operazione con le due label, impostando per la label del nome utente il tag 1, 

mentre per la label che conterrà il testo del tweet il tag 2. Questa seconda label conterrà il testo 

dei tweet, quindi dobbiamo fare in modo che possa contenere più testo. Riduciamo le dimensioni 

del font e impostiamo il numero massimo di righe a 2: 


Abbiamo così concluso anche la definizione della cella personalizzata. Come vedete questo metodo 

è molto versatile, potrete personalizzare al massimo qualsiasi tabella! 

DEFINIAMO LA CLASSE DELLA TABELLA 

Dobbiamo ora iniziare a mettere mano al codice. Per prima cosa definiamo la tabella che mostrerà 

i tweet che abbiamo letto durante il caricamento dell’applicazione. 

Ecco il codice da inserire nel file “TabellaTwitterViewController.h”: 

1 

2 

3 

4 

5 

6 

7 

8 

9 

10 

11 

12 

13 

#import 

@interface TabellaTwitterViewController : UITableViewController { 


! UITableViewCell *cellaNib; 

} 


@property (nonatomic, retain) IBOutlet UITableViewCell *cellaNib; 

- (UIImage *)scale:(UIImage *)image toSize:(CGSize)size; 

@end 

Come vedete il codice rispecchia quello che solitamente è utilizzato per la gestione delle tabelle. 

Abbiamo definito una lista di elementi (alla riga 4), che corrisponderà a quella che abbiamo 

definito nella classe “SampleTwitterClientViewController”. L’elemento “cellaNib”, invece, cor- 


isponderà alla cella che abbiamo creato poco fa in Interface Builder. 

Alla riga 11, infine, troviamo la definizione di un metodo “scale”, che ci permetterà di ridimensionare 

l’immagine per essere contenuta interamente nella UIImageView della cella personalizzata. 

Questo ci permetterà di non sprecare memoria inutilmente. 

Definiamo, ora, il contenuto del file “TabellaTwitterViewController.m”. Iniziamo inserendo le 

seguenti intestazioni: 

1 

2 

3 

4 

5 

6 

#import "TabellaTwitterViewController.h" 


@implementation TabellaTwitterViewController 

@synthesize lista, cellaNib; 

Modifichiamo, poi, il metodo “tableView: numberOfRowInSection:” impostando come valore 

di ritorno la dimensione della lista: 

1 

2 

3 




} 

Ora dobbiamo implementare il metodo “tableView: cellForRowAtIndexPath:”. È un po’ diverso 

dal solito, eccovelo: 

1 

2 

3 

4 

5 

6 

7 

8 

9 

10 

11 

12 

13 

14 

15 

16 

17 

18 

19 

20 

21 







! ! [[NSBundle mainBundle] loadNibNamed:@"cellaTweet" 

owner:self options:NULL]; 

! ! cell = cellaNib; 

} 

! 

! Tweet *elemento = [lista objectAtIndex:indexPath.row]; 

! UILabel *testoLabel = (UILabel*)[cell viewWithTag:2]; 

! testoLabel.text = elemento.testo; 

! UILabel *userLabel = (UILabel*)[cell viewWithTag:1]; 

! userLabel.text = elemento.user; 

! 

! UIImageView *immagine = (UIImageView*)[cell viewWithTag:3]; 

! [immagine setImage:[self scale:elemento.immagine 

toSize:CGSizeMake(60, 60)]]; 

! 


} 


Come potete vedere, l’inizializzazione della cella avviene in maniera diversa dal solito. Alla riga 

7, infatti, viene creata una nuova cella partendo dal file xib “cellaTweet”. Nelle istruzioni successive 

vengono invece settate le varie informazioni del tweet (nome utente, testo e immagine). 

Potete vedere che l’elemento della cella viene richiamato mediante il tag (con la funzione [cell 

viewWithTag:X]), ecco perchè prima lo abbiamo impostato in Interface Builder. 

L’imagine, inoltre, viene ridimensionata con la funzione “scale: toSize:”. Importante sono i valori 

che vengono passati nell’oggetto CGMakeSize (riga 18): essi sono le dimensioni a cui vogliamo 

ridimensionare le nostre immagini (devono corrispondere con le dimensioni che avete impostato 

alla UIImageView nella cella personalizzata). 

Ecco, quindi, la definizione del metodo che ridimensiona le immagini: 

1 

2 

3 

4 

5 

6 

7 

- (UIImage *)scale:(UIImage *)image toSize:(CGSize)size{ 

UIGraphicsBeginImageContext(size); 

[image drawInRect:CGRectMake(0, 0, size.width, size.height)]; 

UIImage *scaledImage = 

UIGraphicsGetImageFromCurrentImageContext(); 

UIGraphicsEndImageContext(); 

return scaledImage; 

} 

Non commento questo metodo, in quanto l’ho trovato anche io su Internet, per la precisione a 

questo indirizzo. Ringrazio, quindi, il legittimo autore. 

La nostra tabella è completa! 

COMPLETIAMO L’APPLICAZIONE 

Ci mancano solo due cose per completare il nostro client. 

Per prima cosa, apriamo nuovamente il file “cellaTweet.xib”. Selezioniamo il “File’s Owner” ed 

entriamo nell’”Identity Inspector”. Impostiamo come classe della vista “TabellaTwitterView- 

Controller”: 


Spostiamoci, poi, nel pannello “Connections Inspector” e colleghiamo l’elemento “cellaNib” al 

componente UITableViewCell che avevamo in precedenza inserito. Se avete fatto in maniera 

corretta il collegamento avrete il seguente risultato: 

Salviamo e chiudiamo pure Interface Builder. 

Dobbiamo ora solo completare il caricamento dell’applicazione, che deve avviare la tabella dopo 

aver letto la nostra timeline. Torniamo, quindi, in “SampleTwitterClientViewController.h”. 

Dobbiamo definire un elemento “TabellaTwitterViewController”, in modo da poterlo richiamare 

alla fine del caricamento dei tweet, facendo così apparire la nostra tabella. Modifichiamo 

così il file “SampleTwitterClientViewController.h”: 


1 

2 

3 

4 

5 

6 

7 

8 

9 

10 

11 

12 

13 

14 

15 

16 

17 

18 

19 

20 

21 

22 

23 

24 

#import 


@class Tweet; 

@class TabellaTwitterViewController; 


{ 



! 


! 

! TabellaTwitterViewController *tabellaTwitterViewController; 

} 






*spinner; 

@property (nonatomic, retain) IBOutlet TabellaTwitterViewController 

*tabellaTwitterViewController; 

@end 

Andiamo, poi, nel file “SampleTwitterClientViewController.m”. Modifichiamo le dichiarazioni 

e le importazioni nel seguente modo: 

1 

2 

3 

4 

5 

6 

7 

#import "SampleTwitterClientViewController.h" 


#import "TabellaTwitterViewController.h" 

@implementation SampleTwitterClientViewController 

@synthesize listaTweet, spinner, tabellaTwitterViewController; 

Modifichiamo, ora, il metodo “statusesReceived: forRequest:”, inserendo il seguente codice alla 

fine di tale metodo: 

1 

2 

3 

4 

5 

6 

7 

8 

[elemento release]; 

! 

self.tabellaTwitterViewController.lista = self.listaTweet; 

! 

[spinner stopAnimating]; 

! 

[self presentModalViewController:self.tabellaTwitterViewController 



Con queste poche righe abbiamo semplicemente impostato la lista degli elementi della nostra 

tabella, che corrisponderà alla lista dei tweet che abbiamo creato in precedenza (parte 1 del tutorial). 

Abbiamo quasi terminato! Dobbiamo impostare la gestione di più viste proprio come abbiamo 

visto nel capitolo 10. Salviamo tutte le classi che abbiamo appena modificato e apriamo il file 

“SampleTwitterClientViewController.xib”. Inseriamo un elemento “UIViewController”: 

Selezioniamo poi tale elemento e in “Identity Inspector” selezioniamo come classe “TabellaTwitterViewController”. 


Nell’”Attributes Inspector” selezioniamo il file xib che deve essere associato a questa vista, ovvero 

“tabellaTwitterViewController”: 

Spostiamoci, infine, nel “File’s Owner” e colleghiamo l’elemento “tabellaTwitterViewController” 

con l’elemento UIViewController appena inserito. Ecco come deve presentarsi il pannello 

dopo il collegamento: 


Abbiamo concluso! Salviamo tutto, chiudiamo Interface Builder, clicchiamo su “Build and Go!” 

e testiamo il nostro personalissimo client di Twitter! 


PARTE 3: IL SALVATAGGIO DEI DATI 

In questa terza e ultima parte vedremo come utilizzare la classe NSUserDefault, che ci permette 

di salvare delle informazioni relative alla nostra applicazione. Quello che andremo a salvare 

sarà la data in cui è stato eseguito l’ultimo refresh della timeline, che mostreremo all’avvio 

all’utente. 

Ovviamente questa è una semplificazione, in applicazioni più complesse potremmo avere molte 

più informazioni da memorizzare (ad esempio dei settaggi come l’autorefresh, il nome utente o 

la password). Analizzeremo, quindi, solo il salvataggio di un parametro, ma vedrete che non sarà 

nulla di difficile! 

La prima cosa da fare è inserire una label in cui venga visualizzata l’ultima data in cui è stato 

eseguito un refresh della nostra timeline. 

Nel file “SampleTwitterClientViewController.h” inseriamo la seguente dichiarazione (righe 12 e 

24): 

1 

2 

3 

4 

5 

6 

7 

8 

9 

10 

11 

12 

13 

14 

15 

16 

17 

18 

19 

20 

21 

22 

23 

24 

25 

26 

#import 


@class Tweet; 

@class TabellaTwitterViewController; 


{ 



! 


! IBOutlet UILabel *labelUltimoRefresh; 

! 

! TabellaTwitterViewController *tabellaTwitterViewController; 

} 






*spinner; 

@property (nonatomic, retain) IBOutlet TabellaTwitterViewController 

*tabellaTwitterViewController; 

@property (nonatomic, retain) IBOutlet UILabel *labelUltimoRefresh; 

@end 

Salviamo il file e apriamo poi “SampleTwitterClientViewController.xib”, che aprirà IB. Inserite 

una o due label (a vostro piacere), io ho fatto così: 


La seconda label (quella che contiene il testo “Label”) sarà quella che visualizzerà la data dell’ultimo 

refresh della timeline. Selezionate il “File’s Owner” e collegate l’elemento “labelUltimo- 

Refresh”, che abbiamo appena definito, con la label in questione. Se avete eseguito il collegamento 

in maniera corretta avrete il seguente risultato: 


Abbiamo così completato questo step. Possiamo salvare tutto e chiudere Interface Builder. 

GESTIAMO IL CARICAMENTO / SALVATAGGIO DEI DATI 

Ora possiamo occuparci del codice che ci interessa, che andrà inserito nel file 

“SimpleTwitterClientViewController.m”. 

Prima di fare qualsiasi cosa, ricordiamoci di importare la property definita in precedenza, tramite 

la seguente istruzione (dovete solo aggiungere “labelUltimoRefresh”, le altre le avete già 

definite): 

1 @synthesize listaTweet, spinner, tabellaTwitterViewController, labelUltimoRefresh; 

Possiamo passare alla parte più importante. Vediamo, quindi, come salvare i valori che ci interessano. 

Come abbiamo già detto, dobbiamo salvare la data dell’ultimo refresh che l’applicazione 

ha eseguito. 

Il punto migliore per eseguire il salvataggio è dopo la creazione della lista con i vari tweet, che 

avviene nel metodo “statusesReceived: forRequest:”. Ecco, quindi, il codice da inserire in tale 

metodo: 

1 

2 

3 

4 

5 

6 

7 

8 

[spinner stopAnimating]; 

! 

NSDate *dataCorrente = [NSDate date]; 

NSUserDefaults *defaults = [NSUserDefaults standardUserDefaults]; 

[defaults setObject:dataCorrente forKey:@"data"]; 

[defaults synchronize]; 

! 

[self presentModalViewController:self.tabellaTwitterViewController 


Nel istruzioni alle righe 1 e 8 le trovete già (le abbiamo inserite nei precedenti tutorial), dovete 

solo inserire le restanti. Alla riga 3 abbiamo istanziato un elemento di tipo NSDate, richiamando 

poi il metodo “date”, che ci restituisce la data e l’ora corrente. Abbiamo ottenuto, quindi, la 

data dell’ultimo refresh. 

Alla riga 4 e 5 eseguiamo il salvataggio vero e proprio: prima viene istanziato un oggetto di tipo 

NSUserDefault, poi si salvano al suo interno i valori desiderati. Ci sono vari metodi che devono 

essere utilizzati per salvare le variabili, a seconda del loro tipo. Nel nostro caso abbiamo utilizzato 

“setObject”, in quanto NSDate è un oggetto generico. Eccovi altri esempi di metodo per il 

salvataggio di variabili: 

1. [defaults setInteger:5 forKey:@"numeroIntero"]; 

2. [defaults setBool:YES forKey:@"valoreBooleano"]; 

3. [defaults setFloat:0.24 forKey:@"numeroFloat"]; 

Come potete notare ci sono vari metodi, a seconda del tipo di variabile. Li trovate tutti, comunque, 

nella documentazione. 


L’ultima istruzione è alla riga 6, ovvero la chiamata del metodo “synchronize”. Non fateci troppo 

caso, inseritela. Chi di voi svilupperà applicazioni con multithread o accesso a risorse condivise 

dovrà sviluppare questo aspetto, per gli altri non è nulla di importante. 

Ora non ci resta che inserire il codice che deve occuparsi della lettura del valore salvato. Tale 

lettura va eseguita, ovviamente, all’avvio dell’applicazione. Nel metodo “viewDidLoad”, quindi, 

aggiungiamo il codice seguente (dalla riga 14 alla 19): 

1 

2 

3 

4 

5 

6 

7 

8 

9 

10 

11 

12 

13 

14 

15 

16 

17 

18 

19 

20 

21 

22 

-(void)viewDidLoad{ 

! 

! // Username e password per accedere a Twitter 

NSString *username = @"user_name"; 

NSString *password = @"password"; 

// Create a TwitterEngine and set our login details. 

twitterEngine = [[MGTwitterEngine alloc] initWithDelegate:self]; 

[twitterEngine setUsername:username password:password]; 

// Get updates from people the authenticated user follows. 

[twitterEngine getFollowedTimelineFor:username since:nil 

startingAtPage:0]; 

! 

! NSDate *dataUltimoAgg = [[NSUserDefaults standardUserDefaults] 

objectForKey:@"data"]; 

! if (dataUltimoAgg == nil) { 

! ! labelUltimoRefresh.text = @"nessun refresh precedente"; 

! }else{ 

! ! labelUltimoRefresh.text = [[NSString alloc] 

initWithFormat:@"%@",dataUltimoAgg]; 

! } 

! 

! [spinner startAnimating]; 

} 

Come potete vedere, abbiamo definito un oggetto di tipo NSDate, che dovrà contenere il valore 

della data che leggeremo dai salvataggi. Per leggere tale valore, utilizziamo un metodo appropriato, 

nel nostro caso è “objectForKey”. Se, invece, avessimo dovuto leggere un numero 

intero avremmo utilizzato il metodo “integerForKey”. Sono speculari, insomma, a quelli visti 

per il salvataggio dei dati. Nella documentazione, comunque, trovate tutti i metodi disponibili. 

Abbiamo poi eseguito un controllo su tale valore: nel caso l’oggetto sia nullo (quindi non è stato 

letto niente), vuol dire che l’applicazione è avviata per la prima volta, quindi scriviamo un 

testo appropriato. In caso contrario, inseriamo nella label la data letta. 

Abbiamo concluso anche il salvataggio dei dati! 


Ecco il vostro client di Twitter completato e funzionante!! 


Capitolo 16: Realizziamo il nostro “Brushes” 

Quello che ho pensato per voi questa volta è un po’ particolare, ma secondo me molto carino e 

con molte cose utili. Sicuramente tutti voi conoscerete Brushes (link iTunes), un programma 

molto famoso per disegnare sul proprio iPhone e iPod Touch. 

Ho pensato, quindi, di spiegarvi come realizzarne uno tutto vostro! Realizzeremo una vista che 

conterrà la “tavola grafica”, ovvero la parte in cui l’utente potrà diegnare. Ci sarà, poi, una seconda 

vista in cui inseriremo le impostazioni, per permettere all’utente di cambiare il colore e 

la dimensione del pennello. Vedremo, infine, come fare in modo che l’utente possa salvare i 

propri disegni nell’Album foto dell’iPhone. 

PARTE 1: CREIAMO LA TAVOLA GRAFICA 

In questa prima parte vedremo come fare in modo che l’utente possa, muovendo il dito sullo 

schermo, disegnare a suo piacimento. Per questa applicazione sfrutteremo il template “Utility 

Application”, che ci permette di avere già due viste, in modo da risparmiare un po’ di lavoro. 


Iniziamo creando il progetto per la nostra applicazione. Create un nuovo progetto di tipo “Utility 

Application” e inserite “SampleBrushes” come nome. 

La struttura che abbiamo selezionato ci mette a disposizione due viste: una “Main View” che è 

quella che appare inizialmente, e una “Flipside View”, che appare se viene premuto il pulsante 

“i” (info), con un’animazione già definita. Queste due viste, quindi, potremo sfruttarle per creare 

la nostra applicazione: nella “Main View” creeremo la zona in cui l’utente potrà disegnare, 

mentre nella “Flipside View” inseriremo le impostazioni (quindi il colore del pennello, la dimensione, 

etc). 

Prima di definire l’aspetto grafico della nostra applicazione, definiamo un componente che poi 

andremo a collegare con un elemento in Interface Builder. 

Aprite, quindi, il file “MainViewController.h” (nella sottocartella “Main View”) e inserite le seguenti 

definizioni: 

1 

2 

3 

4 

5 

6 

7 

8 

9 

10 

11 

#import "FlipsideViewController.h" 

@interface MainViewController : UIViewController 

{ 

! IBOutlet UIImageView *viewDisegno; 

! 

} 

- (IBAction)showInfo; 

- (IBAction)cancella; 

@end 


Alla riga 4 abbiamo definito un oggetto di tipo UIImageView, che sarà l’oggetto in cui l’utente 

disegnerà, e che visualizzerà, quindi, una serie di componenti grafiche colorate. Alla riga 9, invece, 

abbiamo definito un’azione, che ci servirà per cancellare tutto ciò che l’utente ha disegnato. 

DEFINIAMO L’ASPETTO GRAFICO DELL’APPLICAZIONE 

Salviamo il file e apriamo “MainView.xib”. Ci ritroveremo con una vista come questa: 

Dobbiamo modificarne un po’ l’aspetto. Iniziamo scegliendo come colore di sfondo il bianco 

(lo fate semplicemente dal pannello Attributes Inspector). Cancellate, inoltre, il bottone “i” che 

è presente nell’angolo basso destro della vista. 

Inserite, quindi, un componente di tipo “UIImageView”, in modo che occupi tutta la vista: 


Aggiungete, poi, una UIToolbar sul fondo della vista stessa. Io ho messo come stile della toolbar 

“Black Translucent”, ovviamente voi potete farla come preferite. Inserite, inoltre, due bottoni 

“Bar Button Item”, e un “Flexible Space Bar Button Item” tra i due. Il primo bottone rinominatelo 

in “Cancella” mentre il secondo in “Settings” (Impostazioni è troppo lunga come 

dicitura xD). Ecco l’aspetto finale della mia applicazione: 


Ovviamente sarebbe più carino inserire delle immagini nei bottoni, ma per semplicità ho inserito 

dei semplici nomi. 

Colleghiamo, ora, l’elemento e le azioni che abbiamo definito poco fa via codice (l’azione 

“showInfo” era già presente di default). Dal pannello dei documenti selezioniamo “File’s Owner” 

e spostiamoci in “Connections Inspector”. Colleghiamo “viewDisegno” con la UIImage- 

View che abbiamo inserito, l’azione “cancella” colleghiamola con l’omonimo pulsante, mentre 

“showInfo” collegatela con il bottone “Settings”. Se avrete eseguito tutto correttamente avrete 

un pannello delle connessioni come questo: 

Abbiamo concluso questa fase. Possiamo salvare il tutto e chiudere Interface Builder. 


DEFINIAMO I METODI NECESSARI 

Torniamo ora al file “MainViewController.h”. Dobbiamo definire degli elementi che ci serviranno 

nel nostro programma. Ecco il codice da aggiungere a quello già presente: 

1 

2 

3 

4 

5 

6 

7 

8 

9 

10 

11 

12 

13 

14 

15 



{ 


! 

! CGPoint ultimoPunto; 

! 

! float dimensionePennello; 

! UIColor *colorePennello; 

} 



@end 

Analizziamo gli elementi che abbiamo appena inserito. Alla riga 6 abbiamo definito un oggetto 

CGPoint, che non è altro che un contenitore delle due componenti di un punto: le coordinate 

x e y. Questo ci servirà per sapere il punto precedente a quello considerato, permettendoci così 

di tracciare una linea. Alla riga 8 e 9 definiamo le caratteristiche del pennello: dimensione e colore. 

La dimensione è una variabile di tipo reale (float), mentre il colore è definito dal tipo UI- 

Color, che inizializzeremo con lo standard RGB. 

Queste sono le uniche dichiarazioni di cui abbiamo bisogno. Salviamo quindi questo file e spostiamoci 

in “MainViewController.m”. 

Le azioni che ci interessa definire saranno da implementare in 3 metodi tipici della gestione del 

multitouch: 

1. touchesBegan, richiamato quando si inizia un movimento. Dovremo ricavare il punto in cui 

deve iniziare il disegno; 

2. touchesMoved, richiamato quando un movimento è in corso. Ogni volta che viene avviato 

deve disegnare un segmento colorato, in modo che appaia una linea raffigurante il disegno 

dell’utente; 

3. touchesEnded, metodo richiamato quando il movimento è terminato. In particolare serve 

quando l’utente compie solo un singolo tap, disegnando così un semplice punto. 

Iniziamo, quindi, a scrivere il codice necessario. Iniziamo con il metodo “viewDidLoad”: 


1 

2 

3 

4 

5 

6 



! 

! dimensionePennello = 5.0; 

! colorePennello = [[UIColor colorWithRed:1.0 green:0.0 blue:0.0 

alpha:1.0] retain]; 

} 

Il suo compito è molto semplice e chiaro: viene impostata una dimensione standard del pennello, 

a 5.0 (pixel) e un colore, in questo caso il rosso. La definizione del colore avviene settando le 

componenti RGB, ovvero Red (rosso), Green (verde) e Blue (blu): variando le quantità con un 

valore compreso da 0.0 a 1.0 otterremo tutti i colori ammessi da questo sistema. Il campo alpha, 

invece, rappresenta la trasparenza. Fate qualche prova per prendere confidenza con questo 

sistema! 

Il secondo metodo che andiamo a definire è “touchesBegan”. La sua implementazione è molto 

semplice, dobbiamo solo ricavare il punto di inizio del movimento. Ecco il metodo da inserire: 

1 

2 

3 

4 

5 

- (void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event { 

! 

! UITouch *touch = [touches anyObject]; 

! ultimoPunto = [touch locationInView:viewDisegno]; 

} 

Come vedete è molto semplice: dall’oggetto touch si ricava il punto (sempre definito come 

CGPoint), che viene assegnato all’oggetto “ultimoPunto” (riga 4). È importante specificare 

“viewDisegno” come parametro della funzione “locationInView”, altrimenti ricaverete tocchi 

relativi anche ad altre parti dello schermo, che però a noi non interessano. 

Passiamo ora alla definizione del metodo più impegnativo e importante: “touchesMoved”. Ecco 

il metodo da inserire: 


1 

2 

3 

4 

5 

6 

7 

8 

9 

10 

11 

12 

13 

14 

15 

16 

17 

18 

19 

20 

21 

22 

23 

24 

25 

- (void)touchesMoved:(NSSet *)touches withEvent:(UIEvent *)event { 

! UITouch *touch = [touches anyObject];! 

! CGPoint puntoCorrente = [touch locationInView:viewDisegno]; 

! 

! // definiamo il contest grafico 

! UIGraphicsBeginImageContext(viewDisegno.frame.size); 

! [viewDisegno.image drawInRect:CGRectMake(0, 0, 

viewDisegno.frame.size.width, viewDisegno.frame.size.height)]; 

! // settiamo la forma e la dimensione del pennello 

! CGContextSetLineCap(UIGraphicsGetCurrentContext(), kCGLineCapRound); 

! CGContextSetLineWidth(UIGraphicsGetCurrentContext(), dimensione- 

Pennello); 

! // convertiamo il colore e impostiamolo come colore del pennello 

! const CGFloat *components = CGColorGetComponents([colorePennello 

CGColor]); 

! CGContextSetRGBStrokeColor(UIGraphicsGetCurrentContext(), components[0], 

components[1], components[2], components[3]); 

! // disegna il percorso 

! CGContextBeginPath(UIGraphicsGetCurrentContext()); 

! CGContextMoveToPoint(UIGraphicsGetCurrentContext(), 

ultimoPunto.x, ultimoPunto.y); 

! CGContextAddLineToPoint(UIGraphicsGetCurrentContext(), 

puntoCorrente.x, puntoCorrente.y); 

! CGContextStrokePath(UIGraphicsGetCurrentContext()); 

! // settiamo il disegno appena creato 

! viewDisegno.image = UIGraphicsGetImageFromCurrentImageContext(); 

! UIGraphicsEndImageContext(); 

! 

! ultimoPunto = puntoCorrente;! 

} 

Iniziamo ad analizzare passo passo il codice che abbiamo appena scritto. 

Alla riga 7 troviamo la definizione di un “Graphics Contexts”. Questo è un aspetto complesso 

del Core Graphics, ma utilizzando questa funzione lo adattiamo semplicemente alla nostra 

UIImageView, che infatti gli passiamo come parametro. Questo ci permetterà di disegnare all’interno 

della nostra immagine. Con l’istruzione seguente, infatti, definiamo l’area in cui potremo 

disegnare: essa avrà la stessa dimensione dell’immagine “viewDisegno”. 

Le righe 10 e 11 si riferiscono alla definizione del “pennello”, con cui l’utente disegnerà sullo 

schermo. Prima, infatti, viene impostata la forma (in questo caso “kCGLineCapRound” è di 

forma circolare, ma possiamo anche farlo quadrato o triangolare, vi basta guardare la documentazione 

per vedere gli altri valori possibili), poi la dimensione, passando ovviamente la variabile 

“dimensionePennello”, che contiene proprio il valore desiderato (riga 11). 

Le righe 13 e 14 servono per impostare il colore al nostro pennello. Abbiamo visto prima che il 

colore è definito da un elemento UIColor. Purtroppo dobbiamo convertire le varie componenti 

in CGFloat, e l’unico modo che ho trovato è quello che vedete nel codice. Prima convertiamo 


l’elemento “colorePennello” in un array di tipo CGFloat (riga 13), poi passiamo le varie componenti 

all’istruzione che setta il colore del pennello (riga 14). 

Le righe dalla 16 alla 19 sono quelle che si occupano del disegno vero e proprio della linea. Partendo 

da “ultimoPunto” fino a “puntoCorrente” viene disegnato un tratto, un disegno, che 

comporrà poi il tratto voluto dall’utente. 

Le righe 21 e 22 settano il disegno che è stato creato nell’immagine “viewDisegno”, rendendola 

così visibile all’utente. 

Come vedete non è poi così complicato il codice, però bisogna fare attenzione a non dimenticare 

niente. 

Manca poco per terminare il nostro programma! Dobbiamo definire il metodo “touchesEnded”. 

Esso dovrà esattamente fare le stesse cose che fa il metodo “touchesMoved”. Potremmo 

anche non implementare questo metodo, però in caso di singolo tap non succederebbe niente, 

mentre noi vogliamo disegnare un singolo punto. Ovviamente potete personalizzare questo 

aspetto, decidendo voi l’azione da compiere. Ecco il codice da inserire se volete che ad un singolo 

tap venga disegnato un punto: 

1 

2 

3 

4 

- (void)touchesEnded:(NSSet *)touches withEvent:(UIEvent *)event { 

! 

! [self touchesMoved:touches withEvent:event]; 

} 

Come vedete non facciamo altro che richiamare il metodo “touchesMoved”, davvero semplicissimo. 

L’ultima cosa da fare è l’implementazione del metodo “cancella”. Anche questo è davvero molto 

semplice, per cancellare tutto ciò che l’utente ha disegnato basta porre a “nil” l’immagine: 

1 

2 

3 

- (IBAction)cancella{ 

! viewDisegno.image = nil; 

} 

Davvero semplice! 

Abbiamo concluso questa prima parte del nostro tutorial! Clicchiamo “Build and Run” e testiamo 

il nostro personalissimo Brushes! 


PARTE 2: INSERIAMO I SETTAGGI 

In questa seconda parte aggiungeremo alcuni aspetti fondamentali per migliorare l’applicazione: 

la possibilità di cambiare la dimensione e il colore del pennello, e la possibilità di salvare i 

disegni. 

Vedremo, quindi, come due classi diverse possano comunicare tra loro, e come utilizzare il metodo 

“imageSavedToPhotosAlbum” che permette di salvare delle immagini nella galleria dell’utente. 

AGGIUNGIAMO LE IMPOSTAZIONI 

Iniziamo dichiarando nella classe “FlipsideViewController.h” gli elementi che poi andremo a 

definire in Interface Builder. Ecco il codice da inserire: 


1 

2 

3 

4 

5 

6 

7 

8 

9 

10 

11 

12 

13 

14 

15 

16 

17 

18 

19 

20 

21 

22 

23 

24 

25 

26 

27 

28 

@protocol FlipsideViewControllerDelegate; 

@interface FlipsideViewController : UIViewController { 

! id delegate; 

! 

! IBOutlet UISlider *sliderRosso, *sliderBlu, *sliderVerde, *sliderAlpha, 

*sliderDimensione; 

! IBOutlet UIImageView *viewColore; 

! IBOutlet UILabel *labelDimensione; 

! 



} 

@property (nonatomic, assign) id 

delegate; 

@property (nonatomic, assign) UIColor *colorePennello; 

@property (nonatomic, assign) float dimensionePennello; 

- (IBAction)done; 

- (IBAction)cambiaColore; 

- (IBAction)cambiaDimensione; 

@end 

@protocol FlipsideViewControllerDelegate 

- (void)flipsideViewControllerDidFinish:(FlipsideViewController 

*)controller nuovoColore:(UIColor*)colore 

nuovaDimensione:(float)dimensione; 

@end 

Parte di questo codice è già presente nella classe. Alle righe 7, 8, 9 abbiamo definito gli elementi 

grafici che ci serviranno. Come potete vedere, ci serviranno tre slider per cambiare il colore del 

pennello (più uno per la trasparenza, “alpha”), una UIImageView in cui mostreremo il colore 

corrente, in modo che l’utente possa vedere subito quale colore sta selezionando, uno slider e 

una label per la dimensione del pennello. Abbiamo, inoltre, definito due nuove azioni (righe 20 

e 21): esse verranno richiamate quando si muovono gli slider. 

Salviamo il file e apriamo “FlipsideView.xib”. Inserite i componenti necessari in modo da avere 

una struttura come la seguente: 


Dobbiamo eseguire i collegamenti con gli elementi che abbiamo definito in precedenza. Dal 

Pannello dei Documenti selezionate il “File’s Owner” e nel pannello “Connection Inspector” 

collegate i vari slider e la UIImageView (niente di difficile). Se avete eseguito questi collegamenti 

correttamente avrete un pannello come questo: 


Dobbiamo adesso collegare anche le due azioni. Collegate “cambiaColore” con tutti e quattro 

gli slider del colore, selezionando ogni volta “Value Changed” nel menù che vi appare. Collegate, 

infine, “cambiaDimensione” con lo slider della dimensione del pennello. Ecco come appare 

il vostro pannello con tutti i collegamenti effettuati: 

Abbiamo quasi concluso questa parte. Ci manca solo la definizione dei valori massimi e minimi 

dei vari slider. Selezioniamo il primo slider (quello per il rosso), spostiamoci nell’Attributes Inspector 

e controlliamo che come “Minumum Value” sia impostato 0.0, mentre come “Maximum 

Value” ci sia 1.0: 

Controllate anche i restanti slider dedicati al colore. 


Per lo slider della dimensione, invece, dobbiamo impostare dei valori diversi. Io ho scelto 1.0 

come minimo, e 25.0 come massimo. Ovviamente potete variare come volete questi valori, magari 

effettuando delle prove. 

Abbiamo concluso la definizione grafica del pannello delle impostazioni. Salviamo il file e chiudiamo 

Interface Builder. 


Dobbiamo ora impostare il codice necessario. Apriamo il file “FlipsideViewController.m” e iniziamo 

ad inserire questo codice: 

1 

2 

3 

4 

5 

6 

7 

8 

9 

10 

11 

12 

13 

14 

15 

16 

17 

18 

19 


@implementation FlipsideViewController 

@synthesize delegate, colorePennello, dimensionePennello; 



self.view.backgroundColor = [UIColor viewFlipsideBackgroundColor]; 

! 

! const CGFloat *components = CGColorGetComponents([colorePennello 

CGColor]); 

! [sliderRosso setValue:components[0]]; 

! [sliderVerde setValue:components[1]]; 

! [sliderBlu setValue:components[2]]; 

! [sliderAlpha setValue:components[3]]; 

! [viewColore setBackgroundColor:colorePennello]; 

! labelDimensione.text = [NSString 

stringWithFormat:@"%f",dimensionePennello]; 

! [sliderDimensione setValue:dimensionePennello]; 

} 


Per prima cosa ricordatevi di inserire le @synthesize degli elementi “colorePennello” e “dimensionePennello”. 

Questi due valori li passeremo direttamente dalla “MainView”, quindi è importante 

che ci siano le due proprietà impostate correttamente. Passeremo i due valori in modo 

che all’apertura del pannello per modificare il pennello l’utente trovi i valori correnti che sta 

utilizzando (quindi colore e dimensione attuali). 

Nel metodo “viewDidLoad” facciamo proprio quello che vi ho appena detto, ovvero inizializziamo 

i componenti grafici ai valori del pennello. All’avvio dell’applicazione tali valori saranno 

rosso per il colore, e 5.0 per la dimensione. Questi valori, però, potranno essere variati dall’utente, 

quindi è necessario che ogni volta che viene aperta la vista delle impostazioni essi siano 

settati correttamente. In particolare, ricaviamo dal colore le varie componenti (come abbiamo 

già visto nella prima parte del tutorial), e settiamo il valore degli slider (righe 11-15). Alla 

riga 16 impostiamo il colore della UIImageView, che ci mostrerà così il colore del nostro pennello. 

Le ultime due righe, infine, servono per ricavare la dimensione del pennello e settare la 

label predisposta. 

Dobbiamo ora definire le due azioni collegate agli slider. Ecco i due metodi (davvero semplici) 

da implementare: 

1 

2 

3 

4 

5 

6 

7 

8 

- (IBAction)cambiaColore{ 

! [viewColore setBackgroundColor:[UIColor 

colorWithRed:sliderRosso.value green:sliderVerde.value 

blue:sliderBlu.value alpha:sliderAlpha.value]]; 

} 

- (IBAction)cambiaDimensione{ 

! labelDimensione.text = [NSString 

stringWithFormat:@"%f",sliderDimensione.value]; 

} 

Il primo metodo (“cambiaColore”) non fa altro che leggere i valori degli slider e settare lo sfondo 

dell’immagine con l’UIColor corrispondente. Il secondo metodo lavora nello stesso modo, 

solamente che visualizza il valore dello slider della dimensione del pennello. Semplici vero? 

Ci manca solo una modifica ad un metodo già esistente. Dobbiamo, infatti, passare alla classe 

“MainView” i nuovi valori della dimensione e del colore del pennello. Modifichiamo, quindi, il 

metodo “done” nel seguente modo: 

1 

2 

3 

4 

5 

6 

- (IBAction)done { 

! dimensionePennello = sliderDimensione.value; 

! colorePennello = [UIColor colorWithRed:sliderRosso.value 

green:sliderVerde.value blue:sliderBlu.value 

alpha:sliderAlpha.value]; 

! [self.delegate flipsideViewControllerDidFinish:self 

nuovoColore:colorePennello nuovaDimensione:dimensionePennello];! 

} 

Abbiamo semplicemente letto il valore della dimensione e del colore del pennello, per poi passarlo 

al metodo “flipsideviewControllerDidFinish”, che abbiamo opportunamente modificato 

(infatti vedrete che ci sono dei nuovi parametri che gli vengono passati). 


Torniamo al file “FlipsideViewController.h” e modifichiamo anche l’intestazione del metodo 

che troviamo nel fondo della classe: 

1 

2 

3 

@protocol FlipsideViewControllerDelegate 



nuovaDimensione:(float)dimensione; 

@end 

Abbiamo quasi terminato. 

Torniamo al file “MainViewController.m”, dobbiamo modificare due cose. Dobbiamo fare in 

modo che venga passato alla vista delle impostazioni i valori del pennello, e, viceversa, che vengano 

aggiornati dopo che l’utente li ha variati. 

Iniziate modificando il metodo “flipsideViewControllerDidFinish”, che trovate già nella vostra 

classe: 

1 

2 

3 

4 

5 

6 

7 

8 



nuovaDimensione:(float)dimensione{ 

! const CGFloat *components = CGColorGetComponents([colore CGColor]); 

! colorePennello = [[UIColor colorWithRed:components[0] 

green:components[1] blue:components[2] alpha:components[3]] retain]; 

! dimensionePennello = dimensione; 

! 

! [self dismissModalViewControllerAnimated:YES]; 

} 

Come potete vedere, è stata per prima cosa modificata l’intestazione del metodo (proprio quello 

che vi ho accennato poco fa). Vengono, poi, aggiornate le caratteristiche del pennello, inserendo 

il nuovo colore e la nuova dimensione. 

Il secondo metodo da modificare è “showInfo”, anch’esso già definito da XCode: 

1 

2 

3 

4 

5 

6 

7 

8 

9 

10 

11 

12 

- (IBAction)showInfo { 

! 

! FlipsideViewController *controller = [[FlipsideViewController 

alloc] initWithNibName:@"FlipsideView" bundle:nil]; 

! controller.delegate = self; 

! controller.modalTransitionStyle = UIModalTransitionStyleFlipHorizontal; 

! 

! controller.dimensionePennello = dimensionePennello; 

! controller.colorePennello = colorePennello; 

! 

! [self presentModalViewController:controller animated:YES]; 

! 

! [controller release]; 

} 


A questo metodo aggiungiamo solo le righe 6 e 7, in modo da passare alla vista delle impostazioni 

le proprietà correnti del nostro pennello (quelle che vengono lette nel metodo 

“viewDidLoad” che abbiamo scritto prima). 

Abbiamo concluso anche questa parte. 

INSERIAMO IL SALVATAGGIO DEL DISEGNO 

Vogliamo ora aggiungere una funzione molto importante: il salvataggio del disegno creato. Vogliamo 

permettere all’utente, quindi, di salvare il suo disegno, in modo che possa poi ritrovarlo 

nel Rullino Fotografico. 

Iniziamo definendo in “MainViewController” un metodo che assoceremo ad un pulsante nella 

nostra applicazione. Ecco cosa dovete aggiungere nel file “MainViewController.h”: 

1 

2 

3 

4 

5 

6 

7 

8 

9 

10 

11 

12 

13 

14 

15 

16 



{ 


! 

! CGPoint ultimoPunto; 

! 



} 



- (IBAction)salva; 

@end 

Come vedete abbiamo aggiunto solo la definizione del metodo “salva” alla riga 14. 

Salviamo il file e apriamo la vista “MainView.xib”. Nella toolbar inseriamo un bottone, dal “File’s 

Owner” colleghiamo l’azione salva a tale bottone. Se avrete eseguito tutto correttamente 

avrete i seguenti risultati: 


Salvate tutto e spostatevi nel file “MainViewController.m”. 

Dobbiamo ora definire il metodo salva, scrivendo il codice necessario per salvare l’immagine 

nella galleria dell’utente. Ecco il codice da inserire: 


1 

2 

3 

4 

5 

6 

7 

8 

9 

10 

11 

12 

13 

14 

15 

16 

17 

18 

- (IBAction) salva{ 

! UIImageWriteToSavedPhotosAlbum(viewDisegno.image, self, @selector(imageSavedToPhotosAlbum: 

didFinishSavingWithError: contextInfo:), 

nil); 

} 

- (void)imageSavedToPhotosAlbum:(UIImage *)image 

didFinishSavingWithError:(NSError *)error contextInfo:(void *)contextInfo 

{ 

NSString *messaggio; 

NSString *titolo; 

if (!error) { 

! ! titolo = @"Salvataggio"; 

messaggio = @"Immagine salvata con successo"; 

! } else { 

titolo = @"Errore"; 

! ! messaggio = [error description]; 

! } 

! UIAlertView *alert = [[UIAlertView alloc] initWithTitle:titolo 

message:messaggio delegate:nil cancelButtonTitle:@"OK" 

otherButtonTitles:nil]; 

! [alert show]; 

! [alert release]; 

} 

Come potete vedere il codice è molto semplice. Il metodo salva non fa altro che richiamare un 

metodo “imageSavedToPhotosAlbum”, che si occupa di salvare l’immagine nella galleria. In tale 

metodo, infatti, non vedrete istruzioni che si occupano del salvataggio, ma solo un controllo se 

l’operazione è andata a buon fine. Viene infatti controllata la variabile “error” (riga 8), e viene 

impostato un messaggio da visualizzare poi all’utente, che dovrà essere avvisato se il salvataggio 

si è concluso correttamente oppure se ci sono stati degli errori. 

Tutto molto semplice come sempre! 

Abbiamo concluso! Cliccate su “Build and Go!” e testate il vostro programma funzionante! 



Bibliografia 

I miei tutorial spesso sono nati prendendo spunto da altre guide trovate su Internet, scritte da 

altre persone. Mi pare corretto, quindi, riportare di seguito i link da cui ho preso alcuni tutorial, 

in modo da dare il giusto riconoscimento ai legittimi autori. 

Capitolo 3: iPhone SDK Articles, “First iPhone Application”, 

http://www.iphonesdkarticles.com/2008/07/first-iphone-application.html 

Capitolo 4: iPhone Development Central, “TrashTutorial”, 

http://www.iphonedevcentral.org/tutorials.php?page=ViewTutorial&id=30&uid=68863015 

Capitolo 5: iPhone Development Central, “UIToolbar and AutoRotation”, 


Capitolo 6: iPhone Development Central, “UIProgressView Tutorial”, 


Capitolo 7: iPhone Noob, “Access the Address Book”, 

http://iphone.zcentric.com/2008/09/19/access-the-address-book/ 

Capitolo 11: iPod Touch Fans Forum, “[Tutorial] Getting to know Xcode/Interface Buider: PARTS 

I & II: UITabBar projects”, 

http://www.ipodtouchfans.com/forums/showthread.php?t=137183 

Capitolo 14: The Apple Blog, “iPhone SDK Tutorial: Build a Simple RSS reader for the iPhone”, 

http://theappleblog.com/2008/08/04/tutorial-build-a-simple-rss-reader-for-iphone/ 

Capitolo 16: iPod Touch Fans Forum, “[Tutorial] Drawing to the screen”, 

http://www.ipodtouchfans.com/forums/showthread.php?t=132024 


Andrea Busi 

“Tutorial pratici per iPhone SDK” 

versione 1.6, dicembre 2010 

! 182

Tutorial pratici per iPhone SDK v1.6 - Get a Free Blog

Create successful ePaper yourself

Delete template?

Save as template?