Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Desarrollo AIR Mobile


Published on

Presentación usada para el curso de desarrollo móvil sobre plataforma Adobe AIR que impartí en KMMX.

Published in: Technology
  • Be the first to comment

  • Be the first to like this

Desarrollo AIR Mobile

  1. 1. Desarrollo Móvil con Flash –Adobe AIR (Android & iPhone) @cosmoduende Saúl Buentello Sánchez
  2. 2. Android SDK iOS SDK
  3. 3. ANDROID
  4. 4. IPHONE
  5. 5. As you can see, some core mobile servicesare unsupported:➤➤ Native UI controls➤➤ Music player and library➤➤ Bluetooth➤➤ Contacts➤➤ Calendar➤➤ Preferences
  6. 6. Showcase…
  7. 7. PREPARANDO….
  8. 8. Para Android, configurar AIR SDK:➤Close Flash➤Download the AIR SDK➤Update Flash to the latest if available➤ Rename folder C:Program FilesAdobeAIRn.v andreplace with new version➤Copy the airglobal.swc file within the Adobe FlashCS5/AIRn.v/frameworks/libs/air folder into the Adobe FlashCS5/Common/Configuration/ActionScript 3.0/ AIRn.v/
  9. 9. 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 someinputs.➤ Select output path to this certificate
  10. 10. Para Android, instalar SDK Android:➤Download SDK Tools from➤Install and open when finish.➤To connect your Android device to a Windows machine,download the USB Driver in manager extras and put onenable 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
  11. 11. Para iOS, entrar en programa developers:➤Go to point for registering and purchasing $99/year➤After you purchase the Developer Program, Apple has toapprove you before awarding your developer certificate.The usual turnaround time is within a couple of hours➤Confirm the e-mail you recive and activate followinginstructions
  12. 12. Para iOS, obtener Certificate Signing Request (CSR):➤With Apple’s approval in hand, you’ve joined the club andare ready to log in to the Program Portal and downloadyour developer certificate.➤Generating a CSRUsing Mac os X Launch the KeychainAccess utility from Applications/Utilities.➤Choose Keychain Access➪Preferences➤In the Certificates pane, set the Online Certificate StatusProtocol and Certificate RevocationList to Off.➤ Close the Preferences dialog box. Choose KeychainAccess➪Certificate Assistant➪Request a Certificate from aCertifi cateAuthority. The Certificate Assistant is displayed
  13. 13. Para iOS, obtener Certificate Signing Request (CSR) :➤Select the Saved to Disk radio option. Check the Let MeSpecify Key Pair Information check box. Click Continue.➤Save your .certSigningRequest fi le on your desktop or inanother appropriate location. In the Key Pair Informationpanel, select 2048 bits in the Key Size combo box.➤ Select RSA for the Algorithm. Continue to generate thecertificate request.
  14. 14. Para iOS, enviar certificado para aprobación:➤Go to the Program Portal section of the iPhoneDeveloper Program website. The Program is the main areayou’ll work with in the iPhone Developer Program for testingyour apps before submittal to the App Store. You canmanage team members, certificates, devices, andprovisioning profiles.➤Click the Certificates link. Click the Request Certificatebutton.➤ Click the Choose File button on the Create iPhoneDevelopment Certificate page, and choose the certificatefile from your computer. Click the Submit button.
  15. 15. Para iOS, enviar certificado para aprobación:➤ After your certificate request is submitted, you receivethe approval (or disapproval) via e‑mail. If the request isapproved in the e‑mail, you can download your certificate.
  16. 16. Para iOS, convirtiendo el .cer. en .p12:➤ Double-click the developer_identity.cer file to launch theKeychain Access utility Select the Keys category from theleft 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 InformationExchange (p.12) format.➤Your developer certificate is now ready to go. You’ll needthis when you publish your iPhone apps in Flash
  17. 17. Para iOS, Agregando un device:➤ Connect your iPhone or iPod touch to your desktop computerand open iTunes.➤ Display the Summary page for your iPhone.➤ Click the serial number displayed at the top to display theUDID (unique device identifier)
  18. 18. Para iOS, Agregando un device:➤ Copy the UDID number to the Clipboard. Go to the ProgramPortal 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 theUDID into the Device ID box. Click Submit to add your device.
  19. 19. Para iOS, Creando un app ID:➤ Go to the Program Portal section of the iPhone DeveloperProgram website. Click the App IDs link to display the CreateApp ID page➤ In the Description box, enter a descriptive name for the AppID.➤ In the Bundle Seed ID combo box, select Generate New➤ In the Bundle Identifier box, enter an * if you are creating aWildcard App ID or
  20. 20. Para iOS, Creando un provisioning profile:➤ three types of provisioning profiles: a developmentprovisioning profile is used for testing on your own iPhone; anad-hoc provisioning profile is used for more general beta testingon multiple devices outside of the App Store; and a distributionprovisioning file is used for submitting tothe App Store.➤ Go to the Program Portal section of the iPhone DeveloperProgram website. Click the Provisioning link. Click the NewProfile button to display the page shown.
  21. 21. Para iOS, Creando un provisioning profile:➤ Enter the name of the profile. The name of your developercertificate 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. Clickthe 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 youjust created to download the .mobileprovision file to your desktopcomputer.
  22. 22. Para iOS, Instalando un provisioning profile:➤ To install using iTunes, you can drag the .mobileprovision fileon top of your iTunes window. iTunes adds the provisioningprofile to your library.➤ When you synch your iPhone to iTunes, the developmentprovisioning profile is added onto your iPhone. You can check tomake sure it is on your iPhone by going to the Settings app onyour iPhone and choosing General ➪ Profiles.
  23. 23. Para iOS, (MÉTODO PC):➤ Entrar en el developer program de apple y una vez aprobadoingresar al provisioning portal
  24. 24. Para iOS, (MÉTODO PC):➤ Se puede optar por usar el wizard, o bien seguir de la formatradicional (recomendado)➤ Dar click en Devices en el panel izquierdo para agregar unnuevo dispositivo, obtener el UDID del dispositivo a agregarmediante iTunes teniéndolo conectado.➤ Descargar OpenSSL de, descargarprimeramente visual c++ redistributable para poder correrinstalación posteriormente de la versión más reciente de openssl
  25. 25. Para iOS, (MÉTODO PC):
  26. 26. Para iOS, (MÉTODO PC):➤ Ejecutar ventana de command line e ir al directorio binde openssl (c:OpenSSL-Win32bin)➤ Ejecutar el comando set RANDFILE=.rnd➤ Crearemos primero una llave privada mediante elcomando openssl genrsa -out mykey.key 2048➤ ***En Windows 7 y a veces en Vista aparece el error: "WARNING: cant open config file: /usr/local/ssl/openssl.cnf“,esto se soluciona tecleando setOPENSSL_CONF=C:OpenSSL-Win32binopenssl.cfg
  27. 27. Para iOS, (MÉTODO PC):➤ Ejecutar para obtener el CSR el comando openssl req-new -key mykey.key -outCertificateSigningRequest.certSigningRequest -subj openssl req-new -key mykey.key -outCertificateSigningRequest.certSigningRequest -subj"/, CN=John Doe,C=US"➤ Abrir un browser distinto a chrome, e ir al apartado decertificates para agregar el CSR creado y así obtener eldeveloper certificate
  28. 28. Para iOS, (MÉTODO PC):
  29. 29. Para iOS, (MÉTODO PC):➤ Ahora podemos descargar nuestro certificado.cer una vezgenerado para guardarlo en la misma carpeta bin deopenssl.➤ Necesitamos convertir ese .cer descargado a .p12.pasando primeramente por .pem. Debemos abrir unanueva ventana de command line para teclear openssl x509-in developer_identity.cer -inform DER -outdeveloper_identity.pem -outform PEM➤ Ahora hemos generado el .pem, necesitamos teclearahora set RANDFILE=.rnd para crear el .p12
  30. 30. Para iOS, (MÉTODO PC):➤ Finalmente para obtener el .p12 que es el certificadoque nos interesa ocupar teclearemos openssl pkcs12-export -inkey mykey.key -in developer_identity.pem -outiphone_dev.p12➤ Ahora debemos generar un App ID, desde el panelizquierdo de tu cuenta de developer en la opción con dichonombre
  31. 31. Para iOS, (MÉTODO PC):
  32. 32. Para iOS, (MÉTODO PC):➤ Crearemos ahora un provisioning profile en el panel deizquierda de dicho nombre, usando el app ID queacabamos de crear y seleccionando el device asignadopara tal.
  33. 33. Para iOS, (MÉTODO PC):➤ Descargaremos el provisioning profile, mismo queusaremos junto con nuestro certificado .p12 en nuestrasopciones de configuración en el desarrollo en Flash AIR foriOS, para finalmente dar salida y obtener nuestro .ipaque podremos sincronizar con nuestro dispositivo asignadodesde iTunes.
  34. 34. LET’S CODE….
  35. 35. Best Practices AIR para móvil…➤ Reuse Objects➤ Always use the most efficient data type possible when workingwith variables. A Number is less efficient than uint or int, and aVector 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 Spriteobject. Sprite takes less memory, so if you don’t need to animateor work with the timeline, use it.➤ If you are drawing something that doesn’t require interaction,use a Shape object,
  36. 36. Best Practices AIR para móvil…➤ 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 itsdispose() method. That method instantly clears memory➤ Rendering vector graphics requires less memory than usingbitmaps does➤ If you have an app with no animation in it, aim to go between4 and 12 fps. Don’t go more than 30 fps.
  37. 37. Best Practices AIR para móvil…
  38. 38. Best Practices AIR para móvil…➤ Compress everything you can in your app. See if you canreduce the size of your JPGs, audio or video compression, and soon.➤ For benchmarking your code in terms of the memory beingused, 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));
  39. 39. MULTITOUCH EVENTS…Touch Events…
  40. 40. MULTITOUCH EVENTS…Gesture Events…
  41. 41. Accelerometer and AccelerometerEvent…➤ AccelerateInfo, which lists raw data from the motionsensor➤ SphereAcceleration, which uses the Accelerometer toguide a sphere around theViewport➤ Shakey, which captures a shake event
  42. 42. Accelerometer and AccelerometerEvent…➤ The data you receive is in Gs. One G is thegravitational constant equal to 9.8m/sec2.➤ Its primary method is setRequestedUpdateInterval(),which sets up time intervals (in milliseconds) for updatesfrom the motion sensor
  43. 43. Accelerometer and AccelerometerEvent…➤ 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 (inmilliseconds)
  44. 44. AUTO ORIENTATION…➤ Settings Edit button in the Properties panel. Check theAuto 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»)
  45. 45. AUTO ORIENTATION…➤ event.beforeOrientation - indicates previous orientation➤ event.afterOrientaion - indicates current orientation
  46. 46. AUTO ORIENTATION…➤ Android does not currently support the followingScreenOrientation constants:➤➤ ScreenOrientation.ROTATED_LEFT➤➤ ScreenOrientation.UPSIDE_DOWN➤➤ ScreenOrientation.UNKNOWN
  47. 47. GEOLOCATION…➤ You can use a combination of the Geolocation andGeolocationEvent
  48. 48. GEOLOCATION…
  49. 49. GEOLOCATION…
  50. 50. URL PROTOCOLS…Entre algunas de las capacidades soportadas delas cuales podemos beneficiarnos con AIR pormedio de URL protocols están:➤ Make phone calls and send SMS messages➤ Send e-mails➤Use GoogleMaps in your appsSends it as a URL request using navigateToUrl()
  51. 51. URL PROTOCOLS…Por ejemplo, es soportado mediante URLRequest➤ tel: 978-555-1212➤ sms: 978-545-1211➤mailto: kmmx@mycompany.comRemember sends it as a URL request usingnavigateToUrl()
  52. 52. URL PROTOCOLS…Parámetros en uso de mailto
  53. 53. URL PROTOCOLS…En uso de Google Maps, por ejemplo tenemos➤,+MA➤,2.456WManipularemos los parámetros enviados
  54. 54. URL PROTOCOLS…
  55. 55. CAMERA…At the time, Adobe Flash’s iPhone support does notinclude support for the CAMERA features➤ You can use this class CAMERAUI to launch the built-in camera, enable the user to take a picture, automaticallysave the file, and return the user to your app.
  56. 56. CAMERA…
  57. 57. CAMERA ROLL…image media library access with CameraRoll class
  58. 58. 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 allsoundsata it receives from the SampleDataEvent andwrites it to the soundBytes ByteArray➤ Remember RECORD_AUDIO permission
  59. 59. FILE…➤ Limitations iOS➤ Can usepublic directories that are not specific to anyapplication. 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
  60. 60. FILE (Directories, Files, and File Streams)…➤ Two classes: File and FileStream. File ➤ Can usepublic directories that are not specific to anyapplication. These include the following:
  61. 61. FILE (Directories, Files, and File Streams)…
  62. 62. FILE (Directories, Files, and File Streams)…➤ example, if you wanted to get the application storagedirectory, you’d use this:private var storeDir:File = File.applicationStorageDirectory;➤ resolvePath() method to access a subdirectory or file insideof it. So,for example, to point to a preferences.xml file, you’denter this:private var storeDir:File = File.applicationStorageDirectory;private var prefXML:File =storeDir.resolvePath(“preferences.xml”);
  63. 63. FILE (Directories, Files, and File Streams)…➤ You can also point to directories and files using theFile.url property :private var sdpath:File = new File();sdpath.url = “file:///sdcard/mypath”;➤ You can use the File.createDirectory() method tocreate a new directory➤ Supports copy and move operations. Perform theseoperations either synchronously or asynchronously.
  64. 64. FILE (Directories, Files, and File Streams)…➤ The FileStream class is used for read and writeoperations with files.➤ These methods take two parameters: File andFileMode.
  65. 65. DATABASE…➤ You need to establish a connection to the database fileusing the SQLConnection object
  66. 66. DATABASE…➤ When you run a SELECT query on your database, youexecute 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 arecordI ➤ f the record may or may not already exist useREPLACE INTO
  67. 67. REMOTE DEBUG ANDROID…➤ Contar con WIFi➤ Tener la IP de la PC en que se está desarrollando(ipconfig)➤ Android device, enable debugging by going toSettings ➪ Applications ➪ Developmentand enabling USB debugging➤ The Android device will need to connect to TCP port7935.➤ En Flash Select Debug for the Android deploymenttype. Select the INTERNET Permissions check box
  68. 68. REMOTE DEBUG iOS…➤ Contar con WIFi➤ Tener la IP de la PC en que se está desarrollando(ipconfig)➤ En Flash Select QuikDebug for the Androiddeployment type. Publish➤ Select the Debug ➪ Begin Remote DebugSession ➪ ActionScript 3 from the menu.
  69. 69. Keep practice…