{"id":8411,"date":"2012-01-19T12:28:15","date_gmt":"2012-01-19T11:28:15","guid":{"rendered":"http:\/\/www.devapp.it\/wordpress\/?p=8411"},"modified":"2012-01-19T12:28:15","modified_gmt":"2012-01-19T11:28:15","slug":"t106-json-e-ios-5-creiamo-il-client-iphone-per-il-nostro-web-service-php-parte-2","status":"publish","type":"post","link":"https:\/\/www.devapp.it\/wordpress\/t106-json-e-ios-5-creiamo-il-client-iphone-per-il-nostro-web-service-php-parte-2\/","title":{"rendered":"T#106 \u2013 JSON e iOS 5: creiamo il client iPhone per il nostro web service PHP (Parte 2)"},"content":{"rendered":"

\"json<\/a> Come promesso nel precedente tutorial<\/a>, creeremo oggi un client iOS utilizzando le grandi novit\u00e0 di iOS5, utilizzeremo infatti sia ARC che Storyboard.
\nIniziamo creando un nuovo progetto di tipo “Empty application”. Potremmo selezionare anche “Master-detail Application”, ma ci troveremmo troppa pappa pronta e questo non va bene.<\/p>\n


\n\"\"<\/a>
\n<\/center><\/p>\n

Chiamiamo il progetto JSClient e assicuriamoci di aver selezionato “iPhone” e “Use automatic reference counting” come mostrato in foto:<\/p>\n


\n\"\"<\/a>
\n<\/center><\/p>\n

L’applicazione in questo momento \u00e8 veramente vuota per cui bisogna aggiungere almeno un file storyboard, aggiungiamolo cliccando su file->new file e selezionando la voce “storyboard”:<\/p>\n


\n\"\"<\/a>
\n<\/center><\/p>\n

Attenzione a selezionare iPhone come Device Family.<\/p>\n

Dobbiamo ora fare in modo che l’app utilizzi questo file per caricare l’interfaccia e per far ci\u00f2 selezioniamo l’icona del progetto in alto a sinistra e scegliamo il corretto storyboard dalla combobox Main Storyboard:<\/p>\n


\n\"\"<\/a>
\n<\/center><\/p>\n

C’\u00e8 un’altra modifica da effettuare affich\u00e9 venga correttamente utilizzato lo storyboard e consiste nell’eliminare il contenuto del metodo:<\/p>\n

\r\n- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions\r\n<\/pre>\n
Nell’appdelegate, assicuratevi semplicemente di mantenere un:<\/p>\n
\r\nreturn TRUE;\r\n<\/pre>\n
Possiamo passare alla creazione dell’interfaccia dentro lo storyboard. Se non l’avete mai utilizzato potete farvi un’idea leggendo l’articolo Introduzione a Storyboard<\/a>.<\/p>\n
Trasciniamo sullo storyboard un UITableViewController e scegliamo “embed in-> navigation controller” dal men\u00f9 Editor, otterremo questo risultato:<\/p>\n

\n\"\"<\/a>
\n<\/center><\/p>\n
Come abbiamo gi\u00e0 detto nel precedente articolo, abbiamo trascinato un generico<\/em> tableViewController, ma a noi serve una nostra classe che erediti da tableViewController, aggiungiamo quindi un nuovo file al progetto (sempre file->new file) selezionando la voce UIViewController Subclass e scegliendo infine UITableViewController dalla combobox SubClass of:<\/p>\n

\n\"\"<\/a>.
\n<\/center><\/p>\n
A questo punto possiamo specificare all’interno del file storyboard che il tableviewcontroller non \u00e8 un generico tableviewcontroller, ma una istanza dell’appena inserito MainTableViewController.<\/p>\n
Selezioniamolo quindi all’interno del file storyboard e settiamone correttamente la propriet\u00e0 custom class come mostrato nello screenshot:<\/p>\n

\n\"\"<\/a>
\n<\/center><\/p>\n
Vogliamo che selezionando un contatto dalla tabella venga visualizzata una view con i dettagli di quel contatto. Per questo ci servir\u00e0 un secondo viewController. Trasciniamo quindi nello storyboard un viewController standard e trasciniamo dalla cella del tableViewController verso il viewController appena creato e selezioniamo “push” dal men\u00f9 che viene visualizzato. Questo sar\u00e0 il risultato:<\/p>\n

\n\"\"<\/a>
\n<\/center><\/p>\n
Anche in questo caso abbiamo usato un generico viewController, ma in realt\u00e0 ci servir\u00e0 uno specifico viewController, aggiungiamolo quindi da file->new file e poi modifichiamo lo storyboard affinch\u00e9 rispecchi la nuova classe, allo stesso modo di come abbiamo fatto poco fa con il MainTableViewController.<\/p>\n
Ci serviranno 4 textField per visualizzare i dettagli del contatto selezionato e per fare ci\u00f2 sfruttiamo una comoda funzionalit\u00e0 del nuovo XCode, apriamo lo storiboard e trasciniamo 4 textfield sul viewcontroller, selezioniamo la visualizzazione dell’assistant editor e trasciniamo dalle textfield verso l’intestazione della classe:<\/p>\n

\n\"\"<\/a>
\n<\/center><\/p>\n
In questo modo verranno automaticamente create le quattro property necessarie per accedere alle textfield.<\/p>\n
Realizzazione della logica applicativa<\/h4>\n
Possiamo passare ora a realizzare la parte di logica del programma che ci permetter\u00e0 di scaricare il JSON dal nostro server e visualizzare i contatti nella tabella.<\/p>\n
Apriamo il file MainTableViewController e aggiungiamo un’array come variabile di istanza dove memorizzare tutti i contatti:<\/p>\n
\r\n@property (nonatomic, strong) NSArray *contatti;\r\n<\/pre>\n
non dimentichiamoci:<\/p>\n
\r\n@synthesize contatti;\r\n<\/pre>\n
nel file MainTableViewController.m.<\/p>\n
All’interno del metodo viewDidLoad occupiamoci di interrogare il server per ottenere il JSON, ma non lo faremo nel thread principale, useremo invece il gran central dispatcher per eseguire il download in background. Modifichiamo quindi il metodo in questo modo:<\/p>\n
\r\n- (void)viewDidLoad\r\n{\r\n    [super viewDidLoad];\r\n    dispatch_async(dispatch_get_global_queue(DISPATCH_QUEUE_PRIORITY_DEFAULT, 0), ^{\r\n        NSData* data = [NSData dataWithContentsOfURL:[NSURL URLWithString:@\"http:\/\/localhost:8888\"]];\r\n        [self performSelectorOnMainThread:@selector(fetchedData:)\r\n                               withObject:data waitUntilDone:YES]; });\r\n}\r\n<\/pre>\n
Come potete notare dopo aver scaricato il JSON ed averlo memorizzato all’interno dell’oggetto data richiamiamo fetchedData, che si occuper\u00e0 di effettuare il parsing.<\/p>\n
Il metodo \u00e8 questo:<\/p>\n
\r\n- (void)fetchedData:(NSData *)responseData {\r\n    NSArray* json = [NSJSONSerialization\r\n                          JSONObjectWithData:responseData \/\/1\r\n                          options:kNilOptions error:nil];    \r\n    self.contatti = json;\r\n    [self.tableView reloadData];\r\n}\r\n<\/pre>\n
Tutta la magia avviene grazie alla classe NSJSONSerialization ed al suo metodo JSONObjectWithData:options:error<\/strong> che si occupa di parsare il JSON e restituire un array di dizionari. Fin troppo semplice, non credete?<\/p>\n
Infatti ci tocca complicare un po’ le cose ed adesso vediamo insieme il perch\u00e9.<\/p>\n
Con i due metodi precedenti abbiamo interrogato un webservice e ricevuto un JSON contenente una lista di contatti e, una volta ricevuta tale lista, abbiamo inserito in un array tanti oggetti NSDictionary quanti sono i contatti ricevuti. Ma l’oggetto NSDictionary \u00e8 un tipo generico non \u00e8 una nostra classe il che porta (magari non in questo esempio, ma di sicuro nella vita reale) ad avere diversi problemi durante la stesura del progetto. Vediamo quali sono i pregi derivanti dall’utilizzo di una classe:<\/p>\n