Desarrollo AIR Mobile

Desarrollo Móvil con Flash – Adobe AIR (Android & iPhone)

Saúl Buentello Sánchez

@cosmoduende

Android SDK iOS SDK

ANDROID

IPHONE

As you can see, some core mobile services are unsupported:

➤➤ Native UI controls ➤➤ Music player and library ➤➤ Bluetooth ➤➤ Contacts ➤➤ Calendar ➤➤ Preferences

Showcase… http://www.adobe.com/devnet/air/samples-mobile.html

PREPARANDO….

Para Android, configurar AIR SDK:

➤Close Flash➤Download the AIR SDK http://www.adobe.com/devnet/air.html➤Update Flash to the latest if available

➤ Rename folder C:\Program Files\Adobe\AIRn.v and replace with new version➤Copy the airglobal.swc file within the Adobe Flash CS5/AIRn.v/frameworks/libs/air folder into the Adobe Flash CS5/Common/Configuration/ActionScript 3.0/ AIRn.v/

http://www.adobe.com/devnet/air.html

Para Android, crear certificado:

➤Create new fla Android from template➤In properties edit application android settings➤Click the Deployment tab and click create to fill some inputs.

➤ Select output path to this certificate

Para Android, instalar SDK Android:

➤Download SDK Tools from developer.android.com/sdk.➤Install and open when finish.➤To connect your Android device to a Windows machine, download the USB Driver in manager extras and put on enable debugging mode in your settings device Applications

Development.➪ ➤ Download and activate with AVD some emulator ➤ Install in your device or AVD adobe AIR from market

Para iOS, entrar en programa developers:

➤Go to http://developer.apple.com/iphone/program. Starting point for registering and purchasing $99/year➤After you purchase the Developer Program, Apple has to approve you before awarding your developer certificate. The usual turnaround time is within a couple of hours➤Confirm the e-mail you recive and activate following instructions

http://developer.apple.com/iphone/program

Para iOS, obtener Certificate Signing Request (CSR):

➤With Apple’s approval in hand, you’ve joined the club and are ready to log in to the Program Portal and download your developer certificate.➤Generating a CSRUsing Mac os X Launch the Keychain Access utility from Applications/Utilities.➤Choose Keychain Access Preferences➪➤In the Certificates pane, set the Online Certificate Status Protocol and Certificate RevocationList to Off.

➤ Close the Preferences dialog box. Choose Keychain Access Certificate Assistant Request a Certificate from a ➪ ➪Certifi cateAuthority. The Certificate Assistant is displayed

Para iOS, obtener Certificate Signing Request (CSR) :

➤Select the Saved to Disk radio option. Check the Let Me Specify Key Pair Information check box. Click Continue.➤Save your .certSigningRequest fi le on your desktop or in another appropriate location. In the Key Pair Information panel, select 2048 bits in the Key Size combo box. ➤ Select RSA for the Algorithm. Continue to generate the certificate request.

Para iOS, enviar certificado para aprobación:

➤Go to the Program Portal section of the iPhone Developer Program website. The Program is the main area you’ll work with in the iPhone Developer Program for testing your apps before submittal to the App Store. You can manage team members, certificates, devices, and provisioning profiles.➤Click the Certificates link. Click the Request Certificate button.➤ Click the Choose File button on the Create iPhone Development Certificate page, and choose the certificate file from your computer. Click the Submit button.

Para iOS, enviar certificado para aprobación:

➤ After your certificate request is submitted, you receive the approval (or disapproval) via e‑mail. If the request is approved in the e‑mail, you can download your certificate.

Para iOS, convirtiendo el .cer. en .p12:

➤ Double-click the developer_identity.cer file to launch the Keychain Access utility Select the Keys category from the left pane. You’ll see a public and private key listed. Right-click the private key and click the Export item from the pop-up menu. Save the certificate in the Personal Information Exchange (p.12) format.➤Your developer certificate is now ready to go. You’ll need this when you publish your iPhone apps in Flash

Para iOS, Agregando un device:

➤ Connect your iPhone or iPod touch to your desktop computer and open iTunes.

➤ Display the Summary page for your iPhone. ➤ Click the serial number displayed at the top to display the

UDID (unique device identifier)

Para iOS, Agregando un device:

➤ Copy the UDID number to the Clipboard. Go to the Program Portal section of the iPhone Developer Program website.

➤ Click the Devices link, and then click the Add Device button. Enter a name you want to give the device, and then paste the UDID into the Device ID box. Click Submit to add your device.

Para iOS, Creando un app ID:

➤ Go to the Program Portal section of the iPhone Developer Program website. Click the App IDs link to display the Create App ID page

➤ In the Description box, enter a descriptive name for the App ID.

➤ In the Bundle Seed ID combo box, select Generate New ➤ In the Bundle Identifier box, enter an * if you are creating a

Wildcard App ID or

Para iOS, Creando un provisioning profile:

➤ three types of provisioning profiles: a development provisioning profile is used for testing on your own iPhone; an ad-hoc provisioning profile is used for more general beta testing on multiple devices outside of the App Store; and a distribution provisioning file is used for submitting tothe App Store.

➤ Go to the Program Portal section of the iPhone Developer Program website. Click the Provisioning link. Click the New Profile button to display the page shown.

Para iOS, Creando un provisioning profile:

➤ Enter the name of the profile. The name of your developer certificate appears next to the Certificates label. Click the checkbox to assign your developer certificate to this profile.

➤ Select the App ID you created in the App ID combo box. Click the check box next to the device you previously registered.

➤ Click the Submit button to create the provisioning profile. ➤ Click the Download button beside the provisioning profile you

just created to download the .mobileprovision file to your desktop computer.

Para iOS, Instalando un provisioning profile:

➤ To install using iTunes, you can drag the .mobileprovision file on top of your iTunes window. iTunes adds the provisioningprofile to your library.

➤ When you synch your iPhone to iTunes, the development provisioning profile is added onto your iPhone. You can check to make sure it is on your iPhone by going to the Settings app on your iPhone and choosing General Profiles.➪

Para iOS, (MÉTODO PC):

➤ Entrar en el developer program de apple http://developer.apple.com/iphone/program y una vez aprobado ingresar al provisioning portal

http://developer.apple.com/iphone/program


➤ Se puede optar por usar el wizard, o bien seguir de la forma tradicional (recomendado)

➤ Dar click en Devices en el panel izquierdo para agregar un nuevo dispositivo, obtener el UDID del dispositivo a agregar mediante iTunes teniéndolo conectado.

➤ Descargar OpenSSL de http://slproweb.com/products/Win32OpenSSL.html, descargar primeramente visual c++ redistributable para poder correr instalación posteriormente de la versión más reciente de openssl

http://slproweb.com/products/Win32OpenSSL.html



➤ Ejecutar ventana de command line e ir al directorio bin de openssl (c:\OpenSSL-Win32\bin\)

➤ Ejecutar el comando set RANDFILE=.rnd ➤ Crearemos primero una llave privada mediante el

comando openssl genrsa -out mykey.key 2048 ➤ ***En Windows 7 y a veces en Vista aparece el error: "

WARNING: can't open config file: /usr/local/ssl/openssl.cnf“, esto se soluciona tecleando set OPENSSL_CONF=C:\OpenSSL-Win32\bin\openssl.cfg


➤ Ejecutar para obtener el CSR el comando openssl req -new -key mykey.key -out CertificateSigningRequest.certSigningRequest -subj openssl req -new -key mykey.key -out CertificateSigningRequest.certSigningRequest -subj "/[email protected], CN=John Doe, C=US"

➤ Abrir un browser distinto a chrome, e ir al apartado de certificates para agregar el CSR creado y así obtener el developer certificate



➤ Ahora podemos descargar nuestro certificado.cer una vez generado para guardarlo en la misma carpeta bin de openssl.

➤ Necesitamos convertir ese .cer descargado a .p12. pasando primeramente por .pem. Debemos abrir una nueva ventana de command line para teclear openssl x509 -in developer_identity.cer -inform DER -out developer_identity.pem -outform PEM

➤ Ahora hemos generado el .pem, necesitamos teclear ahora set RANDFILE=.rnd para crear el .p12


➤ Finalmente para obtener el .p12 que es el certificado que nos interesa ocupar teclearemos openssl pkcs12 -export -inkey mykey.key -in developer_identity.pem -out iphone_dev.p12

➤ Ahora debemos generar un App ID, desde el panel izquierdo de tu cuenta de developer en la opción con dicho nombre



➤ Crearemos ahora un provisioning profile en el panel de izquierda de dicho nombre, usando el app ID que acabamos de crear y seleccionando el device asignado para tal.


➤ Descargaremos el provisioning profile, mismo que usaremos junto con nuestro certificado .p12 en nuestras opciones de configuración en el desarrollo en Flash AIR for iOS, para finalmente dar salida y obtener nuestro .ipa que podremos sincronizar con nuestro dispositivo asignado desde iTunes.

LET’S CODE….

Best Practices AIR para móvil…

➤ Reuse Objects ➤ Always use the most efficient data type possible when working

with variables. A Number is less efficient than uint or int, and a Vector is preferred over an Array.

➤ Be careful with any kind of timer activity you want to perform, timers do consume more CPU

➤ Use removeEventListener() to free event handlers ➤ Developers often choose between a MovieClip and a Sprite

object. Sprite takes less memory, so if you don’t need to animate or work with the timeline, use it.

➤ If you are drawing something that doesn’t require interaction, use a Shape object,


➤ Avoid filters, blends, and other effects. ➤ If you don’t need touch interaction with a display object,

consider disabling its mouse input ➤ cache wheneveryou can. ➤ When you are finished with a BitmapData instance, call its

dispose() method. That method instantly clears memory➤ Rendering vector graphics requires less memory than using bitmaps does

➤ If you have an app with no animation in it, aim to go between 4 and 12 fps. Don’t go more than 30 fps.



➤ Compress everything you can in your app. See if you can reduce the size of your JPGs, audio or video compression, and so on.

➤ For benchmarking your code in terms of the memory being used, use the getSize() function.For example:var feed:Feed = new Feed();// Return size of Feed instancetrace(getSize(feed));// Return total memory availabletrace(getSize(System.totalMemory/1024));

MULTITOUCH EVENTS…

Touch Events…

MULTITOUCH EVENTS…

Gesture Events…

Accelerometer and AccelerometerEvent…

➤ AccelerateInfo, which lists raw data from the motion sensor

➤ SphereAcceleration, which uses the Accelerometer to guide a sphere around theViewport

➤ Shakey, which captures a shake event


➤ The data you receive is in Gs. One G is the gravitational constant equal to 9.8m/sec2.

➤ Its primary method is setRequestedUpdateInterval(), which sets up time intervals (in milliseconds) for updates from the motion sensor


➤ accelerationX — Acceleration along the x axis (in Gs) ➤ acceleration — Acceleration along the y axis (in Gs) ➤ accelerationZ — Acceleration along the z axis (in Gs) ➤ timestamp — Time since motion detection began (in

milliseconds)

AUTO ORIENTATION…

➤ Settings Edit button in the Properties panel. Check the Auto Orientation check box and click OK.

➤ Don’t be misled by the “auto” in auto orientation ➤ listen for StageOrientationEvent events ➤ StageOrientationEvent.ORIENTATION_CHANGE,

StageOrientationEvent.ORIENTATION_CHANGING, StageOrientation.ROTATED_»DIRECTION»)

AUTO ORIENTATION…

➤ event.beforeOrientation - indicates previous orientation

➤ event.afterOrientaion - indicates current orientation

AUTO ORIENTATION…

➤ Android does not currently support the following ScreenOrientation constants:

➤➤ ScreenOrientation.ROTATED_LEFT ➤➤ ScreenOrientation.UPSIDE_DOWN ➤➤ ScreenOrientation.UNKNOWN

GEOLOCATION…

➤ You can use a combination of the Geolocation and GeolocationEvent

GEOLOCATION…

GEOLOCATION…

URL PROTOCOLS…

Entre algunas de las capacidades soportadas de las cuales podemos beneficiarnos con AIR por medio de URL protocols están:

➤ Make phone calls and send SMS messages ➤ Send e-mails

➤Use GoogleMaps in your apps

Sends it as a URL request using navigateToUrl()

URL PROTOCOLS…

Por ejemplo, es soportado mediante URLRequest

➤ tel: 978-555-1212 ➤ sms: 978-545-1211

➤mailto: [email protected]

Remember sends it as a URL request using navigateToUrl()

URL PROTOCOLS…

Parámetros en uso de mailto

URL PROTOCOLS…

En uso de Google Maps, por ejemplo tenemos

➤ http://maps.google.com/maps?q=Boston,+MA ➤ http://maps.google.com/maps?q=52.123N,2.456W

Manipularemos los parámetros enviados

URL PROTOCOLS…

CAMERA…

At the time, Adobe Flash’s iPhone support does not include support for the CAMERA features

➤ You can use this class CAMERAUI to launch the built-in camera, enable the user to take a picture, automatically save the file, and return the user to your app.

CAMERA…

CAMERA ROLL…

image media library access with CameraRoll class

MICROPHONE…

➤ To capture audio from a microphone, you’ll use theAIR Microphone class.

➤ isSupported property that you can use totest whether the device has a useable

➤ setSilenceLevel() method determines silence levels ➤ SampleDataEvent event handler that receives all

soundsata it receives from the SampleDataEvent and writes it to the soundBytes ByteArray

➤ Remember RECORD_AUDIO permission

FILE…

➤ Limitations iOS ➤ Can usepublic directories that are not specific to any

application. These include the following: ➤➤ /sdcard/Music/ for music files ➤➤ /sdcard/Podcasts/ for podcasts ➤➤ /sdcard/Ringtones/ for ringtones ➤➤ /sdcard/Alarms/ for alarm clock sounds ➤➤ /sdcard/Notifications/ for notification sounds ➤➤ /sdcard/Pictures/ for photos ➤➤ /sdcard/Movies/ for videos for photos ➤➤ /sdcard/Download/ for downloads

FILE (Directories, Files, and File Streams)…

➤ Two classes: File and FileStream. File ➤ Can usepublic directories that are not specific to any application. These include the following:



➤ example, if you wanted to get the application storage directory, you’d use this:private var storeDir:File = File.applicationStorageDirectory;

➤ resolvePath() method to access a subdirectory or file inside of it. So,for example, to point to a preferences.xml file, you’d enter this:private var storeDir:File = File.applicationStorageDirectory;private var prefXML:File = storeDir.resolvePath(“preferences.xml”);


➤ You can also point to directories and files using the File.url property : private var sdpath:File = new File();sdpath.url = “file:///sdcard/mypath”;

➤ You can use the File.createDirectory() method to create a new directory

➤ Supports copy and move operations. Perform these operations either synchronously or asynchronously.


➤ The FileStream class is used for read and write operations with files.

➤ These methods take two parameters: File and FileMode.

DATABASE…

➤ You need to establish a connection to the database file using the SQLConnection object

DATABASE…

➤ When you run a SELECT query on your database, you execute a SQLStatement

➤ When you want to insert new records in a database, execute an INSERT INTO statement

➤ You can also use the UPDATE command to update a recordI f the record may or may not already exist use ➤REPLACE INTO

REMOTE DEBUG ANDROID…

➤ Contar con WIFi ➤ Tener la IP de la PC en que se está desarrollando

(ipconfig) ➤ Android device, enable debugging by going to

Settings Applications Development➪ ➪and enabling USB debugging

➤ The Android device will need to connect to TCP port 7935.

➤ En Flash Select Debug for the Android deployment type. Select the INTERNET Permissions check box

REMOTE DEBUG iOS…

➤ Contar con WIFi ➤ Tener la IP de la PC en que se está desarrollando

(ipconfig) ➤ En Flash Select QuikDebug for the Android

deployment type. Publish ➤ Select the Debug Begin Remote Debug➪

Session ActionScript 3 from the menu.➪

Keep practice…

Desarrollo AIR Mobile

Technology

para android

para ios

android device

android sdk ios sdk

certificate revocationlist

device id box

device button

flash adobe air android