{"id":825,"date":"2009-11-15T11:00:49","date_gmt":"2009-11-15T10:00:49","guid":{"rendered":"http:\/\/www.devapp.it\/wordpress\/?p=825"},"modified":"2010-03-25T15:29:03","modified_gmt":"2010-03-25T14:29:03","slug":"t008-creiamo-un-browser","status":"publish","type":"post","link":"https:\/\/www.devapp.it\/wordpress\/t008-creiamo-un-browser\/","title":{"rendered":"T#008 – Creiamo un Browser"},"content":{"rendered":"
Oggi creeremo un semplice browser completo di tutte le funzionalit\u00e0 necessarie per la navigazione su internet. Il tutto sar\u00e0 incentrato sull’oggetto UIWebView, dove verranno appunto caricate le pagine web che andremo a visitare. Aprite Xcode, cliccate su “Nuovo progetto”, selezionate “View-based Application” dall’elenco dei Template disponibili e proseguite. Inserite un nome per la vostra applicazione, ad esempio “MyBrowser”, scegliete quindi la posizione dove salvare e andate avanti. Apriamo il file “myBrowserViewController.h” e creiamo 2 oggetti. Il primo di tipo UIWebView, che chiamiamo semplicemente webView, e il secondo un UITextField, che chiameremo “Indirizzo” e che ci servir\u00e0 per inserire gli indirizzi dei siti da visitare. Entrambi gli oggetti andranno poi collegati tramite Interface Builder ai rispettivi oggetti che disegneremo nell’interfaccia grafica pi\u00f9 avanti. Dichiariamo inoltre le property per i due oggetti che ci permetteranno di usare le loro propriet\u00e0 nel nostro progetto. Il codice sar\u00e0 come il seguente:<\/p>\n
Apriamo ora Interface Builder facendo doppio click sul file “myBrowserViewController.xib” e disegnamo la nostra interfaccia grafica. Trascinate, posizionate e modificate le propriet\u00e0, come mostrato nella figura sotto l’elenco, dei seguenti oggetti:<\/p>\n
\n
N. 1 UIToolBar<\/li>\n
N. 4 UIBarButtonItem (da posizionare dentro la UIToolBar)<\/li>\n
N. 1 Flexible Space Bar Button Item (da posizionare tra i Button Item nella ToolBar come in figura)<\/li>\n
N. 1 UIWebView<\/li>\n
N. 1 UITextField<\/li>\n
N. 1 UIButton<\/li>\n<\/ul>\n
\n \n<\/center><\/p>\n
Effettuiamo ora i collegamenti tra gli oggetti appena creati e quelli creati da Xcode. Clicchiamo su File’s Owner e colleghiamo “Indirizzo” con l’UITextField, webView con l’UIWebView e “apriPagina” con l’UIButton, facendo attenzione a selezionare “Touch Up Inside”. Clicchiamo quindi sulla UIWebView e colleghiamo le quattro “Received Action” presenti con i rispettivi pulsanti nella ToolBar inseriti in precedenza. Salviamo e torniamo ad Xcode.<\/p>\n
Apriamo il file “myBrowserViewController.m” e andiamo quindi a scrivere il codice vero e proprio della nostra applicazione:<\/p>\n
\r\n\/\/Con la direttiva @synthetize potremo accedere a tutte le propriet\u00e0 dei rispettivi oggetti\r\n@synthesize webView;\r\n@synthesize indirizzo;\r\n\r\n- (IBAction)apriPagina{\r\n\tNSString *strIndirizzo = indirizzo.text;\r\n\tNSURL *url = [NSURL URLWithString:strIndirizzo];\r\n\tNSURLRequest *request = [NSURLRequest requestWithURL:url];\r\n\t[webView loadRequest:request];\r\n\t[webView setScalesPageToFit:YES];\r\n}\r\n\r\n- (void)viewDidLoad {\r\n [super viewDidLoad];\r\n\tNSString *strIndirizzo = @\"http:\/\/www.devapp.it\/\";\r\n\tNSURL *url = [NSURL URLWithString:strIndirizzo];\r\n\tNSURLRequest *request = [NSURLRequest requestWithURL:url];\r\n\t[webView loadRequest:request];\r\n\t[webView setScalesPageToFit:YES];\r\n}\r\n<\/pre>\n
Iniziamo a vedere come funziona il metodo “apriPagina”. Abbiamo creato un oggetto NSString, chiamato “strIndirizzo” a cui passeremo il contenuto della UITextField, ovvero l’indirizzo che vorremo visitare durante l’esecuzione del programma. L’indirizzo viene quindi passato a un oggetto NSURL che passer\u00e0 a sua volta ad un’altro di tipo NSURLRequest, chiamato “request”, che useremo infine per caricare la pagina tramite il metodo “loadRequest” della UIWebView. L’ultima istruzione, setScalesPageToFit:YES , serve ad abilitare lo zoom (e di conseguenza lo scrool) nelle pagine che andremo a visitare.<\/p>\n
Inseriamo pi\u00f9 o meno lo stesso codice al caricamento della view, quindi all’interno del metodo “viewDidLoad”, che dovremo “scommentare”, per\u00f2 questa volta impostiamo esplicitamente un indirizzo web, che sar\u00e0 la nostra pagina predefinita all’apertura del programma, nel nostro caso abbiamo inserito “NSString *strIndirizzo = @”http:\/\/www.devapp.it\/”;”. Il significato del resto del codice \u00e8 lo stesso visto poco fa per il metodo “apriPagina”.<\/p>\n
A questo punto il programma \u00e8 quasi terminato. Non ci resta altro, infatti, che inserire il solito metodo per la chiusura della tastiera (sempre in questo file su cui stiamo lavorando):<\/p>\n
\r\n\/\/Metodo per nascondere la tastiera\r\n-(BOOL)textFieldShouldReturn:(UITextField *)textField{ \r\n\t[textField resignFirstResponder]; \r\n\treturn YES; \r\n}\r\n<\/pre>\n
Torniamo quindi su Interface Builder, clicchiamo sulla UITextView, apriamo la finestra “Connections” e colleghiamo l’unico Outlets presente con File’s Owner. Salviamo e chiudiamo. Possiamo provare la nostra applicazione. Per farlo clicchiamo su “Build and Run” da Xcode. Ricordate di inserire anche “http:\/\/” negli indirizzi<\/strong> durante il test dell’applicazione, perch\u00e8 non abbiamo gestito questo aspetto. Il risultato \u00e8 quello mostrato in figura:<\/p>\n
![\"t008_IS\"](\"http:\/\/www.devapp.it\/wordpress\/wp-content\/uploads\/2009\/11\/t008_IS1.jpg\" "\\"t008_IS\\"")
Oggi creeremo un semplice browser completo di tutte le funzionalit\u00e0 necessarie per la navigazione su internet. Il tutto sar\u00e0 incentrato sull’oggetto UIWebView, dove verranno appunto caricate le pagine web che andremo a visitare. Aprite Xcode, cliccate su “Nuovo progetto”, selezionate “View-based Application” dall’elenco dei Template disponibili e proseguite. Inserite un nome per la vostra applicazione, ad esempio “MyBrowser”, scegliete quindi la posizione dove salvare e andate avanti. Apriamo il file “myBrowserViewController.h” e creiamo 2 oggetti. Il primo di tipo UIWebView, che chiamiamo semplicemente webView, e il secondo un UITextField, che chiameremo “Indirizzo” e che ci servir\u00e0 per inserire gli indirizzi dei siti da visitare. Entrambi gli oggetti andranno poi collegati tramite Interface Builder ai rispettivi oggetti che disegneremo nell’interfaccia grafica pi\u00f9 avanti. Dichiariamo inoltre le property per i due oggetti che ci permetteranno di usare le loro propriet\u00e0 nel nostro progetto. Il codice sar\u00e0 come il seguente:<\/p>\n![\"t008_IB\"](\"http:\/\/www.devapp.it\/wordpress\/wp-content\/uploads\/2009\/11\/t008_IB.jpg\" "\\"t008_IB\\"")