Creazione della prima applicazione AIR per iOS

AIR 2.6 o successivo, iOS 4.2 o successivo

Potete codificare, compilare e testare le funzioni di base di un'applicazione iOS utilizzando esclusivamente strumenti Adobe. Tuttavia, per installare e provare un'applicazione iOS su un dispositivo e distribuirla, dovete aderire al programma Apple iOS Developer, un servizio gratuito. Una volta effettuata l'iscrizione al programma iOS Developer, potete accedere al sito iOS Provisioning Portal, dove è possibile procurarsi le risorse e i file indicati di seguito, necessarie per installare un'applicazione su un dispositivo a scopo di test e successiva distribuzione. Tali risorse e file sono:

  • Certificati di sviluppo e di distribuzione

  • ID applicazione

  • File di provisioning di sviluppo e di distribuzione

Creare il contenuto dell'applicazione

Create un file SWF che visualizza il testo "Hello world!". Potete effettuare questa operazione utilizzando Flash Professional, Flash Builder o un altro ambiente IDE. In questo esempio vengono utilizzati un editor di testo e il compilatore SWF della riga di comando inclusi in Flex SDK.

  1. Create una directory in una posizione comoda in cui salvare il file dell'applicazione. Create un file denominato HelloWorld.as e modificatelo nel vostro editor di codice preferito.

  2. Aggiungete il codice seguente:

    package{ 
         
        import flash.display.Sprite; 
        import flash.text.TextField; 
        import flash.text.TextFormat; 
        import flash.text.TextFieldAutoSize; 
         
        public class HelloWorld extends Sprite 
        { 
            public function HelloWorld():void 
            { 
                var textField:TextField = new TextField(); 
                textField.text = "Hello World!"; 
                textField.autoSize = TextFieldAutoSize.LEFT; 
                     
                var format:TextFormat = new TextFormat(); 
                format.size = 48; 
                 
                textField.setTextFormat ( format ); 
                this.addChild( textField ); 
            } 
        } 
    }
  3. Compilate la classe usando il compilatore amxmlc:

    amxmlc HelloWorld.as

    Un file SWF, HelloWorld.swf, viene creato nella stessa cartella.

    Nota: l'esempio presuppone che sia stata impostata la variabile d'ambiente dei percorsi includendo la directory che contiene amxmlc. Per informazioni sull'impostazione del percorso, vedete Variabili d'ambiente dei percorsi. In alternativa, potete digitare l'intero percorso di amxmlc e degli altri tool della riga di comando usati nell'esempio.

Creare un disegno icona e un disegno schermata iniziale per l'applicazione

Tutte le applicazioni iOS dispongono di icone che vengono visualizzate nell'interfaccia utente dell'applicazione iTunes e sullo schermo del dispositivo.

  1. Create una directory all'interno della directory di progetto e denominatela Icone.

  2. Create tre file PNG nella directory Icone e denominateli Icon_29.png, Icon_57.png e Icon_512.png.

  3. Modificate i file PNG per creare il disegno appropriato per l'applicazione. Le risoluzioni dei file devono essere 29x29 pixel, 57x57 pixel e 512x512 pixel. Per questa prova, potete semplicemente utilizzare quadrati a tinta unita.

    Nota: quando inviate un'applicazione ad App Store di Apple, utilizzate una versione JPG (non una versione PNG) del file da 512 pixel. Potete utilizzare la versione PNG durante la prova delle versioni di sviluppo di un'applicazione.

Tutte le applicazioni iPhone visualizzano un'immagine iniziale mentre l'applicazione viene caricata sull'iPhone. Definite l'immagine iniziale in un file PNG:

  1. Nella directory di sviluppo principale, create un file PNG denominato Default.png. (Non collocate questo file nella sottodirectory icons. Accertatevi di denominare il file Default.png, con una D maiuscola.)

  2. Modificate il file in modo che sia largo 320 pixel e alto 480 pixel. Per il momento, il contenuto può essere un semplice rettangolo bianco. (Potrete cambiare questo aspetto in seguito.)

Per informazioni dettagliate su queste immagini, vedete Icone dell'applicazione.

Creare il file descrittore dell'applicazione

Create un file descrittore dell'applicazione che specifichi le proprietà di base dell'applicazione. Potete effettuare questa operazione utilizzando un ambiente IDE quale Flash Builder o un editor di testo.

  1. Nella cartella del progetto che contiene HelloWorld.as, create un file XML denominato HelloWorld-app.xml. Modificate questo file nel vostro editor XML preferito.

  2. Aggiungete il codice XML seguente:

    <?xml version="1.0" encoding="utf-8" ?> 
    <application xmlns="http://ns.adobe.com/air/application/2.7" minimumPatchLevel="0"> 
        <id>change_to_your_id</id> 
        <name>Hello World iOS</name> 
        <versionNumber>0.0.1</versionNumber> 
        <filename>HelloWorld</filename> 
        <supportedProfiles>mobileDevice</supportedProfiles> 
        <initialWindow> 
            <content>HelloWorld.swf</content> 
            <title>Hello World!</title> 
        </initialWindow> 
        <icon> 
            <image29x29>icons/AIRApp_29.png</image29x29> 
            <image57x57>icons/AIRApp_57.png</image57x57> 
            <image512x512>icons/AIRApp_512.png</image512x512> 
        </icon> 
    </application>

    Per semplicità, in questo esempio vengono impostate solo alcune delle proprietà disponibili.

    Nota: se usate AIR 2 o una versione precedente, dovete utilizzare l'elemento <version> anziché <versionNumber>.
  3. Impostate l'lD applicazione in modo che corrisponda all'ID applicazione specificato nel sito iOS Provisioning Portal. (Non includete la porzione del bundle seed casuale all'inizio dell'ID.)

  4. Provate l'applicazione con ADL:

    adl HelloWorld-app.xml -screensize iPhone

    ADL dovrebbe aprire una finestra sul desktop nella quale compare il testo Hello World!. In caso contrario, controllate il codice di origine e il descrittore dell'applicazione per verificare se contengono errori.

Compilare il file IPA

A questo punto potete compilare il file del programma di installazione IPA con ADT. Dovete disporre del certificato sviluppatore Apple e della chiave private in formato file P12, nonché del profilo di provisioning di sviluppo Apple.

Eseguite l'utilità ADT con le opzioni seguenti, sostituendo i valori keystore, storepass e provisioning-profile con quelli appropriati:

adt -package -target ipa-debug 
    -keystore iosPrivateKey.p12 -storetype pkcs12 -storepass qwerty12 
    -provisioning-profile ios.mobileprovision 
    HelloWorld.ipa 
    HelloWorld-app.xml 
    HelloWorld.swf icons Default.png

(Utilizzate una sola riga di comando; le interruzioni di riga nell'esempio sono presenti solo per facilitare la leggibilità.)

ADT genera il file del programma di installazione dell'applicazione iOS, HelloWorld.ipa, nella directory del progetto. La compilazione del file IPA può richiedere alcuni minuti.

Installare l'applicazione su un dispositivo

Per installare l'applicazione iOS a scopo di test:

  1. Aprite l'applicazione iTunes.

  2. Se non l'avete già fatto, aggiungete il profilo di provisioning per questa applicazione a iTunes. In iTunes, selezionate File > Aggiungi alla Libreria, quindi scegliete il file del profilo di provisioning (il cui tipo è mobileprovision).

    Per provare l'applicazione sul dispositivo per sviluppatori, utilizzate per il momento il profilo di provisioning di sviluppo.

    In seguito, durante la distribuzione di un'applicazione a iTunes Store, utilizzate il profilo di distribuzione. Per distribuire l'applicazione ad hoc a più dispositivi senza passare per iTunes Store, utilizzate il profilo di provisioning ad hoc.

    Per ulteriori informazioni sui profili di provisioning, vedete Configurazione per iOS.

  3. Alcune versioni di iTunes non sostituiscono l'applicazione se la stessa versione dell'applicazione è già installata. In questo caso, cancellate l'applicazione dal dispositivo e dall'elenco delle applicazioni in iTunes.

  4. Fate doppio clic sul file IPA per l'applicazione. Il file dovrebbe essere visualizzato nell'elenco delle applicazioni in iTunes.

  5. Collegate il dispositivo alla porta USB del computer.

  6. In iTunes, controllate la scheda Applicazione per il dispositivo e verificate che l'applicazione sia selezionata nell'elenco delle applicazioni da installare.

  7. Selezionate il dispositivo nell'elenco a sinistra dell'applicazione iTunes. Quindi fate clic sul pulsante Sincronizza. Al termine della sincronizzazione, l'applicazione Hello World viene visualizzata sull'iPhone.

Se la nuova versione non è installata, eliminatela dal dispositivo e dall'elenco delle applicazioni in iTunes, quindi ripetete questa procedura. Questa situazione può verificarsi se la versione installata utilizza lo stesso ID applicazione e la stessa versione.

Modificare il grafico della schermata iniziale

Prima di compilare l'applicazione, create un file Default.png (vedete Creare un disegno icona e un disegno schermata iniziale per l'applicazione). Questo file PNG serve come immagine di avvio durante il caricamento dell'applicazione. Durante la prova dell'applicazione sull'iPhone, potreste aver notato questo schermo vuoto all'avvio.

Modificate questa immagine per farla corrispondere alla schermata di avvio dell'applicazione (“Hello World!”):

  1. Aprite l'applicazione sul dispositivo. Quando viene visualizzato il primo testo “Hello World”, tenete premuto il pulsante Home (sotto lo schermo). Tenendo premuto il pulsante Home, premete il pulsante Power/Sleep (nella parte superiore dell'iPhone). Questa operazione consente di scattare un'istantanea e di inviarla all'album Rullino fotografico.

  2. Caricate l'immagine nel computer di sviluppo trasferendo le fotografie da iPhoto o da un'altra applicazione di trasferimento foto. (In Mac OS, potete anche utilizzare l'applicazione Acquisizione immagine.)

    Potete anche inviare la foto via e-mail al computer di sviluppo:

    • Aprite l'applicazione Foto.

    • Aprite l'album Rullino fotografico.

    • Aprite l'istantanea acquisita.

    • Toccate l'immagine, quindi toccate il pulsante (freccia) “avanti” nell'angolo inferiore sinistro. Fate clic su Invia foto per e-mail e inviate l'immagine a voi stessi.

  3. Sostituite il file Default.png (nella directory di sviluppo) con una versione PNG dell'immagine acquisita dallo schermo.

  4. Ricompilate l'applicazione (vedete Compilare il file IPA) e reinstallatela sul dispositivo.

L'applicazione utilizza ora la nuova schermata di avvio durante il caricamento.

Nota: potete creare qualsiasi disegno preferite per il file Default.png, purché sia delle dimensioni corrette (320 x 480 pixel). Tuttavia, spesso è preferibile che l'immagine Default.png corrisponda allo stato iniziale dell'applicazione.