Mobiletuts + coprirà tutte le principali piattaforme mobili: iPhone, Windows, Android e Blackberry. Questo tutorial esamina lo sviluppo con l'iPhone SDK. Imparerai informazioni sulla piattaforma iPhone, su come configurare e configurare il tuo ambiente di sviluppo, e i passaggi necessari per creare una semplice applicazione del biscotto della fortuna!
iOS è una variante ottimizzata per dispositivi mobili di Mac OS X creata da Apple Inc. È distribuita con tutti i dispositivi iPod touch, iPhone e iPad e occupa solo circa 500 MB di spazio di archiviazione.
Esistono tre diversi approcci allo sviluppo di iOS:
L'originale OS OS 1.0 richiedeva che tutte le applicazioni non Apple fossero basate sul Web ed eseguite all'interno del browser web Safari. Poiché Mobile Safari non supporta plug-in come Adobe Flash o Microsoft Silverlight, ciò significa che tutte le applicazioni di terze parti sono state originariamente scritte in HTML, CSS e JavaScript. Questo metodo di sviluppo rimane un'opzione valida oggi, specialmente per le applicazioni che devono essere accessibili su una vasta gamma di dispositivi o per i team di sviluppo con un'avversione verso Mac OS X e Objective-C.
Con il rilascio di iPhone OS 2.0 e l'introduzione di iPhone SDK e iTunes App Store, gli sviluppatori sono stati incoraggiati a scrivere applicazioni native per iPhone utilizzando Objective-C e Xcode. Le applicazioni native sono binari compilati che vengono installati ed eseguiti sul dispositivo dell'utente. Queste applicazioni hanno un accesso considerevole all'hardware del dispositivo e solo i binari dell'applicazione nativi possono essere distribuiti tramite iTunes App Store. Poiché il sistema operativo dell'iPhone funziona su dispositivi iPod touch, iPhone e iPad, la maggior parte delle applicazioni può essere realizzata per tutti e tre i dispositivi con solo piccole variazioni di codice, sebbene vi siano vantaggi significativi nell'ottimizzazione dell'applicazione per lo schermo dell'iPad molto più grande.
È anche possibile combinare gli approcci di cui sopra e creare applicazioni iPhone installate sul dispositivo dell'utente, scritte principalmente in HTML, CSS e JavaScript e rilasciate tramite iTunes App Store. Tali applicazioni stanno diventando sempre più popolari grazie a librerie open-source come QuickConnect e piattaforme come PhoneGap, AppCelerator e rhomobile.
Mobiletuts + coprirà tutti i metodi sopra descritti di sviluppo del sistema operativo per iPhone, ma questo tutorial si concentrerà sullo sviluppo di applicazioni native con l'SDK iPhone ufficiale utilizzando Objective-C e Xcode. Questo è il metodo consigliato da Apple per creare applicazioni native per iPhone OS da distribuire nell'App Store di iTunes.
Per sviluppare applicazioni iPhone SDK e continuare questo tutorial, avrai bisogno di quanto segue:
Per poter scrivere applicazioni native con l'iOS SDK ufficiale e testare le tue applicazioni nell'iPhone o iPad Simulator ufficiale di Apple, dovrai essere in grado di eseguire Snow Leopard, l'ultimo sistema operativo desktop e portatile di Apple.
È necessario per scaricare iPhone SDK 4, Xcode IDE e iPhone Simulator. Dovrai registrarti qui per un account sviluppatore Apple. La registrazione è gratuita e ti consentirà di eseguire le applicazioni nel simulatore iPhone. Un account gratuito è tutto ciò che è necessario per questo tutorial, ma per eseguire effettivamente le tue app su un dispositivo o pubblicarle tramite l'App Store di iTunes che dovrai pagare per iscriverti al Programma per gli sviluppatori di iPhone.
Dopo aver effettuato l'accesso al tuo account sviluppatore, scarica e installa Xcode 3.2.5 e iPhone SDK 4 (o le ultime versioni disponibili).
Dopo aver ottenuto quanto sopra, dovresti essere pronto per tuffarti nella costruzione di "Fortune Crunch", una semplice applicazione per iPhone che permetterà agli utenti di "scricchiolare" un biscotto della fortuna e leggere un messaggio.
Xcode è un ambiente di sviluppo integrato (IDE) che combina i molteplici strumenti necessari per creare un programma iPhone in un'unica applicazione. Avvia Xcode ora cercandolo sotto i riflettori o usando il finder per navigare al percorso di installazione predefinito di / Developer / Applications / Xcode.
Seleziona "Crea un nuovo progetto Xcode" dalla finestra di dialogo che appare.
Seleziona "Applicazione" sotto iOS nella colonna di sinistra. Familiarizzare con i vari tipi di modelli di applicazione disponibili nel pannello dei contenuti. Questo tutorial sarà una semplice app a vista singola, quindi seleziona l'icona "View-based Application" e fai clic su "Scegli".
Inserisci il testo "FortuneCrunch" nel campo "Salva come" per nominare il nostro progetto e fai clic su "Salva".
Il modello di progetto di FortuneCrunch dovrebbe ora essere visualizzato sullo schermo.
È importante rendersi conto che questo punto di partenza è un programma completamente eseguibile. Vai avanti e usa il simulatore iPhone per eseguire il modello facendo clic "Costruisci ed esegui" o selezionando Build> Build ed Esegui dalla barra dei menu.
Anche se il modello di applicazione predefinito è incredibilmente triste, il simulatore di iPhone non lo è. Fai clic sul pulsante Home nel simulatore per tornare al dock di iPhone e navigare un po '. Notare inoltre le seguenti scorciatoie del simulatore:
Comando + freccia sinistra: Ruota il dispositivo a sinistra.
Comando + freccia destra: Ruota il dispositivo verso destra.
Ctrl + Comando + Z: Emula un gesto di scuotimento (questo non verrà visualizzato visivamente).
L'interfaccia predefinita fornita con un modello basato su Visualizza è incredibilmente noiosa, quindi continuiamo creando l'interfaccia utente della nostra cookie Fortune. Utilizzeremo due immagini del biscotto della fortuna che sono state prese appositamente per questo tutorial: cookie-closed.png e cookie-crunched.png. Li potete trovare nel file di download allegato a questo post, e sono liberamente distribuiti sotto la licenza WTFPL.
Dopo aver ottenuto le immagini del biscotto della fortuna necessarie, avviare Interface Builder accedendo al riquadro "Gruppi e file" in Xcode, espandendo la cartella "Risorse" e facendo doppio clic sul file FortuneCrunchViewController.xib.
Interface Builder è uno strumento grafico che ti consente di creare rapidamente e facilmente il layout della tua applicazione senza scrivere una singola riga di codice Objective-C. Come vedremo, consente anche di definire visivamente le relazioni tra oggetti come i pulsanti e i metodi che scrivi nella tua applicazione.
Ci sono quattro finestre principali di Interface Builder che è necessario conoscere:
Ora che hai familiarità con Interface Builder, possiamo continuare a configurare l'interfaccia della nostra applicazione.
Per prima cosa, cambiamo il colore dello sfondo dal grigio al bianco. Fai questo selezionando la View Istance descritta sopra. La finestra dell'ispettore dovrebbe ora caricare le proprietà della vista. Selezionare la scheda degli attributi nell'ispettore, individuare l'attributo dello sfondo e la tavolozza dei colori e cambiare il colore in bianco.
Ora, creeremo un pulsante per rappresentare il nostro biscotto della fortuna. Nella finestra della biblioteca, digita "UIButton" nella casella di ricerca in basso.
Quindi, trascina il pulsante sull'istanza della vista.
Abbiamo bisogno di aggiungere le immagini cookie-closed.png e cookie-crunched.png alla cartella delle risorse in Xcode. Torna alla finestra principale di Xcode e trascina ogni immagine nella cartella Risorse nel pannello Gruppi e File. Apparirà una finestra di dialogo. Seleziona la casella "Copia gli elementi nella cartella del gruppo di destinazione" e fai clic su "Aggiungi".
Tornare a Interface Builder e selezionare UIButton aggiunto in precedenza. Usa la linguetta degli attributi dell'ispettore per cambiare la proprietà dell'immagine in cookie-crunched.png e il tipo di immagine in "personalizzato". Ridimensiona l'UIButton alla dimensione dell'immagine selezionando Layout> Dimensioni adatte.
Ora abbiamo un biscotto della fortuna rotto sullo schermo. Creiamo la nostra fortuna trascinando un UILabel dalla libreria alla vista. Cambia il testo per leggere "Happy iPhone Hacking" e usa la scheda degli attributi dell'ispettore per cambiare il carattere in 12 punti e il carattere in grassetto. Dimensiona la UILabel in modo che si adatti al testo e posizionala sopra la striscia di carta bianca sopra l'immagine del cookie spezzata. Ora seleziona la casella di controllo "Nascosto" poiché vogliamo che questa etichetta venga visualizzata solo dopo che l'utente ha premuto il pulsante.
Seleziona nuovamente UIButton e modifica l'impostazione dell'immagine nella scheda degli attributi dell'ispettore su cookie-closed.png.
Assicurati di salvare tutto il tuo lavoro in Interface Builder, e quindi tornare a Xcode e creare ed eseguire nuovamente l'applicazione. Ora dovresti vedere il pulsante del biscotto della fortuna ininterrotto sullo schermo.
Con l'interfaccia configurata, siamo pronti per immergerci in Objective-C e iniziare a scrivere il codice che renderà funzionante la nostra applicazione.
Indietro in Xcode, selezionare il file FortuneCrunchViewController.h sotto il Classi cartella nel Gruppi e file riquadro. Questo file è noto come file "header", "interface" o "declaration" per la classe FortuneCrunchViewController. È qui che dichiariamo le variabili interne, i metodi, i protocolli e altri componenti che verranno utilizzati nella classe.
La classe FortuneCrunchViewController è stata rappresentata visivamente in Interface Builder come "canvas" in cui siamo stati in grado di trascinare le istanze UILabel e UIButton. Ora aggiorneremo il file di intestazione della classe in modo che possiamo fare riferimento a questi oggetti più avanti nel nostro codice.
Aggiorna il file di intestazione apportando le seguenti modifiche:
#importare@interface FortuneCrunchViewController: UIViewController IBOutlet UIButton * fortuneCookieButton; IBOutlet UILabel * fortuneLabel; @property (nonatomic, retain) IBOutlet UIButton * fortuneCookieButton; @property (nonatomic, retain) IBOutlet UILabel * fortuneLabel; - (IBAction) crunchCookie: (id) del mittente; @fine
La linea 1 è nota come direttiva preprocessore e sta essenzialmente dicendo al preprocessore di rendere disponibile il framework UIKit per l'uso all'interno della classe.
La riga 3 utilizza @interface per dichiarare che questa è una definizione di interfaccia per la classe FortuneCrunchViewController. La parte ": UIViewController" di questa riga indica che FortuneCrunchViewController è una classe figlia della classe UIViewController.
La riga 5 dichiara un puntatore della classe UIButton chiamato fortuneCookieButton come IBOutlet. Il tag IBOutlet non ha alcun significato reale per il compilatore e viene utilizzato da Interface Builder solo per determinare quali oggetti della classe possono essere collegati alla loro rappresentazione visiva nel file XIB di Interface Builder. La classe UIButton dovrebbe essere familiare dal nostro lavoro nel passaggio 2.
La riga 6, simile alla riga 5, dichiara un puntatore alla classe UILabel chiamato fortuneLabel come IBOutlet.
Le righe 10-11 usano l'istruzione @property per dire al compilatore che fortuneCookieButton e fortuneLabel saranno accessibili come proprietà della classe, ma che dichiareremo i metodi per accedervi dinamicamente in seguito.
La riga 13 è una firma di funzione per il metodo crunchCookie. La parte - (IBAction) dell'istruzione dichiara che questo metodo è del tipo di dati IBAction, che è essenzialmente lo stesso del tipo di dati void, con l'unica differenza degna di nota che IBAction rende questo metodo accessibile come azione in Interface Builder . La parte ": (id) mittente" dell'istruzione dice al compilatore di accettare un argomento chiamato "mittente" del tipo di dati "id". In Cocoa-Touch, id è un tipo di dati generico che può essere un riferimento puntatore a qualsiasi sottoclasse di NSObject e nella nostra applicazione che chiama il metodo crunchCookie premendo fortuneCookieButton invierà effettivamente un riferimento a fortuneCookieButton come oggetto "mittente". Questo non è necessario per la nostra applicazione, ma è incluso qui perché è una convenzione comune che vedrai spesso.
Infine, la riga 15 indica che questa è la fine della nostra dichiarazione @interface.
Ora che abbiamo dichiarato le variabili interne ei metodi che verranno utilizzati dalla nostra applicazione e li abbiamo taggati con IBOutlet e IBAction, dobbiamo completare il cerchio collegando i nostri oggetti Interface Builder alla classe FortuneCrunchViewController.
Fare doppio clic sul file FortuneCrunchViewController.xib e avviare nuovamente Interface Builder.
Fare clic con il pulsante destro del mouse o selezionare l'oggetto Proprietario del file nel controller XIB. Apparirà una finestra che elenca i vari oggetti nel proprietario del file che possono essere collegati agli oggetti nell'XIB. Si noti che la "vista" è già collegata per noi.
Fai clic sul cerchio a destra di fortuneCookieButton e trascina dalla casella Proprietario del file al UIButton effettivo nell'area di disegno. La finestra del proprietario del file deve essere aggiornata graficamente per visualizzare la connessione tra il fortuneCookieButton e l'oggetto UIButton nello stesso modo in cui indica la connessione tra il punto di vista e l'oggetto View.
Ora fai lo stesso per la connessione fortuneLabel.
Ora dobbiamo stabilire una connessione tra UIButton e il nostro metodo crunchCookie. Interface Builder ci fornisce molti modi diversi per farlo. Controlla il clic o fai clic con il pulsante destro del mouse sul pulsante del nostro biscotto della fortuna per visualizzare un elenco di eventi disponibili.
Due delle opzioni più comunemente usate includono:
Touch Up Inside è solitamente l'opzione scelta quando si lavora con i pulsanti, ma nel nostro caso vogliamo che il biscotto della fortuna si spezzi nel momento in cui il dito dell'utente lo tocca, quindi legheremo l'evento Touch Down al nostro metodo crunchCookie. A tale scopo, trascinare dal cerchio all'oggetto Proprietario del file nella finestra XIB, quindi assicurati di selezionare il metodo crunchCookie dalla finestra di dialogo che si apre.
Salva il tuo lavoro in Interface Builder e quindi tornare a Xcode.
Con il file XIB di Interface Builder configurato e la nostra interfaccia di classe scritta, non resta che codificare i metodi di classe che l'applicazione utilizzerà per scricchiolare i cookie e visualizzare l'etichetta di fortuna. Il file di implementazione della classe è FortuneCrunchViewController.m, aprilo ora selezionandolo dal Classi cartella nel Gruppi e file vetro.
Aggiorna il codice al seguente:
#import "FortuneCrunchViewController.h" @implementation FortuneCrunchViewController @synthesize fortuneCookieButton; @synthesize fortuneLabel; // Questo metodo cambia l'immagine del cookie quando viene premuto il pulsante: - (IBAction) crunchCookie: (id) sender NSLog (@ "In crunchCookie"); [fortuneCookieButton setImage: [UIImage imageNamed: @ "cookie-crunched.png"] forState: UIControlStateNormal]; fortuneLabel.hidden = NO; // Questi metodi sono correlati alla gestione della memoria: - (void) viewDidUnload [fortuneCookieButton release]; fortuneCookieButton = nil; - (void) dealloc [fortuneCookieButton release]; [versione fortuneLabel]; [super dealloc]; @fine
La riga 1 è la direttiva del preprocessore per includere il file di interfaccia prima della compilazione della classe.
La linea 3 inizia la nostra implementazione di classe.
Le righe 5 - 6 usano l'istruzione @synthesize per creare dinamicamente metodi per accedere e salvare gli oggetti puntatore fortuneCookieButton e fortuneLabel che abbiamo dichiarato nel file di intestazione. Questo passaggio rimuove la necessità di utilizzare i metodi getVariable () e setVariable () per tutti gli oggetti dichiarati.
Il metodo crunchCookie si trova nelle righe 8 - 12 ed è il cuore di questo programma.
Alla riga 9-10 creiamo un nuovo oggetto UIImage usando l'immagine cookie-crunched.png. Quindi passiamo questo oggetto nel setImage: forState: metodo dell'oggetto fortuneCookieButton. Questo metodo modificherà l'attributo dell'immagine che impostiamo manualmente su cookie-closed.png in Interface Builder sul nuovo oggetto UIImage che abbiamo passato. Il passaggio dei messaggi è un componente centrale del linguaggio Objective-C e generalmente segue questo modello:
[metodo myObjectParam1: valore1 metodoParam2: valore2];
La riga 11 accede all'attributo "nascosto" dell'oggetto fortuneLabel e imposta il valore su NO. Questo rivelerà il nostro oggetto etichetta dopo l'aggiornamento dell'immagine al cookie crunch.
Tutte le restanti linee trattano problemi di gestione della memoria che saranno trattati in modo più approfondito nei futuri tutorial. Per riassumere, tuttavia, quando la vista viene scaricata, è necessario essere sicuri di aver rilasciato tutti gli oggetti IBOutlet che sono stati creati. Per quanto riguarda il metodo dealloc, questo è il distruttore di oggetti e viene chiamato quando l'oggetto sta per essere distrutto. Entrambi questi metodi esistono già nella classe per impostazione predefinita, ma sarà necessario aggiungere le linee a essi mostrate.
Con il codice sopra riportato, siamo pronti a salvare, compilare ed eseguire la nostra applicazione finita!
Questo tutorial ti ha fornito una breve introduzione allo sviluppo di applicazioni native per iPhone OS con Xcode, Interface Builder e l'SDK di iPhone. Abbiamo coperto alcune delle basi della piattaforma e ti sei bagnato con Interface Builder e Xcode.
Il materiale trattato in questo tutorial verrà ampliato in future esercitazioni mentre ci addentriamo ulteriormente in Objective-C, Cocoa-Touch e nell'SDK di iPhone.