Creación de su primera aplicación de AIR para iOS

Cree un archivo SWF que muestre el texto “Hello world!” Esta tarea se puede realizar utilizando Flash Professional, Flash Builder u otro IDE. En este ejemplo simplemente se utiliza un editor de texto y el compilador SWF de la línea de comandos incluido en el SDK de Flex.

1. Cree un directorio en una ubicación adecuada para almacenar los archivos de la aplicación. Cree un archivo denominado HelloWorld.as y edítelo en su editor de código favorito.

2. Añada el siguiente código:

   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. Compile la clase utilizando el compilador amxmlc:

   amxmlc HelloWorld.as

   Un archivo SWF, HelloWorld.swf , se crea en la misma carpeta.

   Nota: en este ejemplo se da por sentado que ha configurado la variable de ruta de su entorno para que incluya el directorio que contiene amxmlc. Para obtener información sobre la configuración de la ruta, consulte Variables del entorno de ruta . Como alternativa, es posible indicar la ruta completa en amxmlc y las otras herramientas de la línea de comandos utilizadas en este ejemplo.

Todas las aplicaciones para iOS tienen iconos que aparecen en la interfaz de la aplicación iTunes y en la pantalla del dispositivo.

1. Cree un directorio en el directorio del proyecto y llámelo “icons”.

2. Cree tres archivos PNG en el directorio de iconos. Llámelos Icon_29.png, Icon_57.png e Icon_512.png.

3. Edite los archivos PNG para crear los gráficos que desee para la aplicación. Los archivos deben tener 29x29, 57x57 y 512x512 píxeles. Para esta prueba, basta con usar cuadrados de color sólido como gráficos.

   Nota: cuando se envía una aplicación al App Store de Apple, se utiliza una versión JPG (no PNG) del archivo de 512 píxeles. Utilizará la versión PNG durante las versiones de desarrollo de pruebas de la aplicación.

Todas las aplicaciones para iPhone muestran una página inicial mientras se carga en el iPhone. Puede definir la imagen inicial en un archivo PNG:

1. En el directorio de desarrollo principal, cree un archivo PNG llamado Default.png. ( No coloque este archivo en un subdirectorio de iconos.) Es importante que el nombre sea Default.png, con D mayúscula.)

2. Edite el archivo para que tenga 320 píxeles de ancho por 480 píxeles de alto. De momento, el contenido puede ser un rectángulo blanco sencillo. (Lo cambiaremos más adelante.)

Para obtener información detallada sobre estos gráficos, consulte Iconos de la aplicación .

Cree un archivo descriptor de la aplicación que especifique las propiedades básicas de la aplicación. Esta tarea se puede completar utilizando un IDE como, por ejemplo, Flash Builder o un editor de texto.

1. En la carpeta del proyecto que contiene HelloWorld.as, cree un archivo XML denominado, HelloWorld-app.xml . Edite este archivo en el editor de XML favorito.

2. Añada el siguiente código XML:

   <?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>

   Por motivos de simplicidad, en este ejemplo solo se establecen algunas de las propiedades disponibles.

   Nota: si está utilizando AIR 2 o anterior, debe usar el elemento <version> en lugar de <versionNumber> .

3. Cambie el ID de la aplicación para que coincida con el ID especificado en iOS Provisioning Portal. (No incluya la parte raíz del paquete aleatoria al principio del ID.

4. Pruebe la aplicación utilizando ADL:

   adl HelloWorld-app.xml -screensize iPhone

   ADL debe abrir una ventana en el escritorio que muestre el texto: Hello World! Si no es así, compruebe el descriptor de la aplicación y el código fuente para localizar errores.

Ahora puede compilar el archivo de instalación IPA utilizando ADT. Debe contar con el certificado de desarrollador de Apple y la clave privada en formato de archivo P12 y el archivo de suministro de desarrollo de Apple.

Ejecute la utilidad ADT con las siguientes opciones, sustituyendo el almacén de claves, la contraseña para acceder al almacén y los valores del perfil de suministro con los suyos propios:

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

(Utilice una sola línea de comandos; los saltos de línea de este ejemplo solo se añaden para facilitar la lectura.)

ADT genera el archivo instalador de la aplicación de iOS, HelloWorld.ipa , en el directorio del proyecto. La compilación del archivo IPA puede tardar varios minutos.

Para instalar la aplicación de iOS para prueba:

1. Abra la aplicación iTunes.

2. Si aún no lo ha hecho, añada el archivo de suministro de esta aplicación a iTunes. En iTunes, seleccione Archivo > Añadir a la biblioteca. Posteriormente, seleccione el archivo de suministro (que tendrá mobileprovision como tipo de archivo provisional).

   Por ahora, para probar la aplicación en su dispositivo de desarrollador, utilice el perfil de suministro de desarrollo.

   Más adelante, cuando distribuya aplicaciones a iTunes Store, utilizará el perfil de distribución. Para distribuir la aplicación ad hoc (a varios dispositivos sin tener que pasar por iTunes Store), utilice el archivo de suministro ad hoc.

   Para obtener más información sobre el suministro de perfiles, consulte Configuración de iOS .

3. Algunas versiones de iTunes no sustituyen la aplicación si ya está instalada la misma versión. En ese caso, elimine la aplicación del dispositivo y de la lista de aplicaciones de iTunes.

4. Haga doble clic en el archivo IPA de su aplicación. Debe aparecer en la lista de aplicaciones en iTunes.

5. Conecte el dispositivo al puerto USB del equipo.

6. En iTunes, compruebe la ficha Aplicaciones del dispositivo y verifique que la aplicación aparece seleccionada en la lista de aplicaciones para instalar.

7. Seleccione el dispositivo en la lista de la izquierda de la aplicación iTunes. Haga clic en el botón Sincronizar. Cuando finalice la sincronización, la aplicación Hello World aparecerá en el iPhone.

Si no tiene instalada la versión más reciente, elimínela del dispositivo y de la lista de aplicaciones de iTunes y vuelva a realizar este procedimiento. Puede darse el caso si la versión instalada utiliza el mismo ID y versión que la aplicación existente.

Recuerde que antes de compilar la aplicación, creó un archivo Default.png (consulte la sección Creación de gráficos de iconos y de la pantalla inicial de la aplicación ). Este archivo PNG sirve de imagen inicial cuando se carga la aplicación. Al probar la aplicación en el iPhone, probablemente se haya dado cuenta de que la pantalla inicial aparece en blanco.

Debe cambiar esta imagen para que coincida con la pantalla de inicio de la aplicación (“Hello World!”):

1. Abra la aplicación en el dispositivo. Cuando aparezca el primer texto “Hello World”, pulse el botón Inicio (debajo de la pantalla) y no lo suelte. Con el botón Inicio presionado, pulse el botón de encendido/reposo (en la parte superior del iPhone). De este modo hará una captura de pantalla y enviará la imagen al Carrete.

2. Transfiera la imagen al equipo de desarrollo desde iPhoto u otra aplicación de transferencia de fotografías. (En Mac OS, también puede utilizar la aplicación Instantánea.)

   También puede enviar la fotografía al equipo de desarrollo por correo electrónico:

   • Abra la aplicación Fotos.

   • Abra el Carrete.

   • Abra la captura de pantalla que realizó anteriormente.

   • Toque la imagen y luego toque el botón “reenviar” (flecha) situado en la esquina inferior izquierda. Seguidamente, toque el botón Enviar foto y envíese la fotografía a usted mismo.

3. Reemplace el archivo Default.png (en su directorio de desarrollo) por una versión PNG de la imagen de la captura de pantalla.

4. Vuelva a compilar la aplicación (consulte la sección Compilación del archivo IPA ) y reinstálela en el dispositivo.

La aplicación utilizará la nueva pantalla de inicio cuando se cargue.