T#043 – Creiamo il nostro lettore di feed RSS per iPhone
Oggi parleremo ancora di XML, questa volta, però, con un esempio pratico. Andremo a creare infatti, con questo nuovo tutorial, un lettore di feed RSS per il nostro iPhone. Impareremo quindi a sfruttare il parser XML disponibile con l’SDK di Apple, “NSXMLParser”, per interfacciare la nostra applicazione, ad esempio, con i feed RSS del nostro sito. Ricaveremo un elenco delle ultime notizie pubblicate e, al tocco da parte dell’utente su una voce nell’elenco, faremo in modo di aprire una nuova vista con la news pronta da leggere. Interessante vero? Ma ora basta chiacchere e partiamo subito con il nostro tutorial.
1. Creiamo un nuovo progetto
Aprimo Xcode, selezioniamo “File -> New Project”. Nel menù che ci appare selezioniamo “Navigation-Based Application”, clicchiamo su “Choose…”, immettiamo come nome “SimpleRSSreader” e facciamo clic su “Save”. Abbiamo così creato il nostro nuovo progetto.
Solitamente tra le prime cose 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 (UITableView) che a suo volta conterrà gli elementi che andremo a leggere. Ci concentreremo, quindi, sugli aspetti più importanti.
2. Definiamo gli elementi necessari
Il primo file che andremo a modificare è “RootViewController.h”. Apriamolo e, al suo interno, scriviamo il seguente codice:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 | @interface RootViewController : UITableViewController { // parser XML NSXMLParser *rssParser; // elenco degli elementi letti dal feed NSMutableArray *elencoFeed; //variabile temporanea pe ogni elemento NSMutableDictionary *item; // valori dei campi letti dal feed NSString *currentElement; NSMutableString *currentTitle, *currentDate, *currentSummary, *currentLink; } - (void)parseXMLFileAtURL:(NSString *)URL; @end |
Come già saprete, questo è il file di implementazione, in cui definiamo tutti gli elementi, quelli che vengono solitamente chiamati “variabili globali”. Questi elementi li utilizzeremo nei vari metodi che andremo a definire fra poco.
Alla riga 3 abbiamo definito il nostro parser XML, che si occuperà di leggere il feed RSS e di convertirne le notizie. 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 7, 10 e 11 servono proprio per i metodi del parser, quindi non preoccupatevi troppo se non le capite pienamente.
Apriamo, ora, il file “RootViewController.m”. Possiamo subito notare che sono già presenti diversi metodi. Tutti si riferiscono alla definizione e al popolamento della tabella. Tali metodi sono obbligatori e necessari per il corretto funzionamento della tabella stessa.
Iniziamo a modificare i metodi già presenti a seconda delle nostre necessità.
Il primo metodo da modificare è il seguente:
1 2 3 | - (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section { return [elencoFeed count]; } |
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 no?
Le parentesi quadre [] che trovate intorno all’elemento “elencoFeed” servono per richiamare un metodo o una proprietà: in questo caso abbiamo richiamato la proprietà “count”, che ci ritorna il numero di elementi presenti nella nostra lista.
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 15 | // Customize the appearance of table view cells. - (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath { static NSString *CellIdentifier = @"Cell"; UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier]; if (cell == nil) { cell = [[[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:CellIdentifier] autorelease]; } // Configure the cell. cell.textLabel.text = [[elencoFeed objectAtIndex:indexPath.row] objectForKey:@"title"]; return cell; } |
Troveremo tale metodo già definito, dovremo solo aggiungere l’istruzione alla riga 12. Tale istruzione va a ricavare l’elemento desiderato dalla lista (che coincide con il numero di riga, ricavato da “indexPath.row”), estrae quindi il campo “title” e lo setta come testo della cella.
Se scorriamo verso il basso il file, possiamo notare alcuni metodi commentati (riconoscibili perchè Xcode li colora in verde). Essi sono ancora relativi alla gestione della tabella, ma in questo tutorial non ci serviranno (tranne uno, che utilizzeremo dopo).
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, faremo proprio questo.
3. 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 possiamo trovare commentato tra le prime righe della classe):
1 2 3 4 5 6 7 8 9 10 11 | - (void)viewDidLoad { [super viewDidLoad]; self.title = @"devAPP RSS"; NSString *path = @"http://feeds.feedburner.com/devAPP"; [self parseXMLFileAtURL:path]; // Uncomment the following line to display an Edit button in the navigation bar for this view controller. // 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. 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 come dovremo 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 ci possono chiarire le varie istruzioni. Si parte dall’inizializzazione dell’array “elencoFeed”, per poi passare all’inizializzazione del parser XML e al suo avvio.
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 | - (void)parser:(NSXMLParser *)parser didStartElement:(NSString *)elementName namespaceURI:(NSString *)namespaceURI 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 namespaceURI:(NSString *)namespaceURI 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 altri due metodi:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 | - (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).
4. 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 dovremo 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! Clicchiamo su “Build and Run!” e testiamo il nostro personalissimo lettore di feed RSS!!
5. 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 una nuova vista in cui venisse caricato l’articolo completo. Ci basterà, quindi, creare una nuova vista, in cui inseriremo una UIWebView, che sarà il nostro browser per l’articolo.
Dal menù “File” scegliamo “New File…”, andiamo nella sezione “Cocoa Touch Class” e scegliamo “UIViewController subclass” come tipo di classe, spuntando inoltre l’opzione “With XIB for user interface”:
Inseriamo “ViewArticolo” come nome e clicchiamo su “Finish”. Abbiamo così creato la classe e la relativa vista.
Apriamo il file “ViewArticolo.h” e inseriamo le seguenti dichiarazioni:
1 2 3 4 5 6 7 8 9 10 11 | #import <UIKit/UIKit.h> @interface ViewArticolo : UIViewController { IBOutlet UIWebView *webView; NSString *indirizzo; } @property (nonatomic, retain) NSString *indirizzo; @end |
Come potete facilmente notare, abbiamo dichiarato una UIWebView (che andremo fra poco a definire in Interface Builder) e una variabile indirizzo, che conterrà l’URL dell’articolo da caricare.
Apriamo ora il file “ViewArticolo.m” e inseriamo il seguente codice (che vi abbiamo già spiegato in questo tutorial):
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 | #import "ViewArticolo.h" @implementation ViewArticolo @synthesize indirizzo; // Implement viewDidLoad to do additional setup after loading the view, typically from a nib. - (void)viewDidLoad { [super viewDidLoad]; //crea un oggetto URL NSURL *url = [NSURL URLWithString:indirizzo]; NSURLRequest *requestObj = [NSURLRequest requestWithURL:url]; // visualizza la pagina nella UIWebView [webView loadRequest:requestObj]; } |
Salviamo entrambi i file e apriamo “ViewArticolo.xib”, in cui andremo ad inserire la UIWebView. Dalla Libreria prendiamo un componente di tipo UIWebView e inseriamolo nella vista, così:
Apriamo, infine, il Pannello dei Documenti, selezioniamo il “File’s Owner” e colleghiamo l’elemento “webView” con la UIWebView che abbiamo appena inserito nella vista:
Salviamo tutto e chiudiamo Interface Builder.
Abbiamo quasi concluso! Torniamo al file ”RootViewController.m” e cerchiamo il metodo “tableView: didSelectRowAtIndexPath:” (è uno di quelli commentati che 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 che ci permetterà di aprire la news selezionata:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 | // Override to support row selection in the table view. - (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath { // ricaviamo il link dell'elemento selezionato NSString *link = [[elencoFeed objectAtIndex:indexPath.row] objectForKey: @"link"]; // ripiliamo il link da spazi, return e tabs link = [link stringByReplacingOccurrencesOfString:@" " withString:@""]; link = [link stringByReplacingOccurrencesOfString:@"\n" withString:@""]; link = [link stringByReplacingOccurrencesOfString:@" " withString:@""]; // apriamo la nuova vista ViewArticolo *controller = [[ViewArticolo alloc] initWithNibName:@"ViewArticolo" bundle:nil]; controller.indirizzo = link; [self.navigationController pushViewController:controller animated:YES]; } |
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 le ultime istruzioni inizializziamo la classe relativa alla vista che abbiamo appena definito, passandogli come parametro l’indirizzo dell’articolo che l’utente ha selezionato.
Manca solo una piccolissima cosa da fare: sempre nel file “RootViewController.m” inseriamo l’importazione della “ViewArticolo” (riga 2):
1 2 3 4 | #import "RootViewController.h" #import "ViewArticolo.h" @implementation RootViewController |
Salviamo il tutto, clicchiamo su “Build and Run” e godiamoci la nostra bellissima applicazione!!
Se avete problemi con il tutorial, questo è il nostro file di progetto.
Nota: Purtroppo “NSXMLParser” è l’unico parser XML semplice e disponibile su iPhone. Questo ha molti svantaggi, non è perfetto e presenta diversi problemi relativi alla gestione della memoria. Per questo esempio, tuttavia, è più che sufficiente, però se vi servisse per un’applicazione più complessa prendete in seria considerazione l’idea di realizzarvi un parser tutto vostro.
La guida è stata tradotta e ampliata da Andrea Busi. Trovare la versione originale a questo indirizzo: iPhone SDK Tutorial: Build a Simple RSS reader for the iPhone. I meriti, quindi, sono dei legitimi autori per le rispettive versioni.























Grandi!!!! Una domanda, se volessi aggiungere altri dati all’elenco scaricato dal feed? Ad esempio la data, un breve accenno all’articolo, l’autore ed eventualmente un’immagine? Un po’ come accade nella maggior parte delle applicazioni di news?