Your SlideShare is downloading. ×
0
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Building apps for multiple devices
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

Building apps for multiple devices

8,111

Published on

A session on using Flex and AIR to develop application that can run on IOS, Android,or PlayBook. A primer on getting at least close to the dream of one code base, multiple devices.

A session on using Flex and AIR to develop application that can run on IOS, Android,or PlayBook. A primer on getting at least close to the dream of one code base, multiple devices.

Published in: Technology
0 Comments
2 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
8,111
On Slideshare
0
From Embeds
0
Number of Embeds
5
Actions
Shares
0
Downloads
87
Comments
0
Likes
2
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1. Building Apps for Multiple Devices<br />Terry Ryan<br />Developer Evangelist<br />http://terrenceryan.com<br />@tpryan<br />
  • 2. Let me start a process here<br />
  • 3. Poll<br />How many have done native mobile?<br />How many have done mobile AIR?<br />How many have done mobile AIR with Flex?<br />How many have done it for multiple platforms?<br />
  • 4. You can do cross platform mobile development with Adobe AIR!!!<br />
  • 5. Wooooooh!!!!!!<br />
  • 6. We a wrote very good demo project. Actual mileage may vary.<br />
  • 7. Noooooo!!!!!!<br />
  • 8. Please, I beg you, button, stop appearing off-screen<br />
  • 9. My goal: give you guys an idea of what you need to do to actually produce multi-screen apps<br />
  • 10. Using one code base<br />
  • 11. Should you do this?<br />
  • 12. Content<br />Design<br />Develop<br />Publish<br />Flex with a little ActionScript only<br />
  • 13. Designing for Multiple Devices<br />
  • 14. Resolution and DPI<br />
  • 15.
  • 16.
  • 17.
  • 18.
  • 19. DPI FUBAR<br />
  • 20. So how do we deal with this?<br />
  • 21. Application DPI<br />This is the DPI of the device you are targeting in development<br />Allows for resizing to denser devices<br />
  • 22. Application DPI<br />3 Levels<br />160<br />240<br />320<br />
  • 23. Media Queries<br />CSS media queries allow you to target different DPI screens naturally<br />
  • 24. Media Queries<br />@media all and (application-dpi: 160)<br />{<br />s|Button<br /> {<br />color: red;<br /> }<br />}<br />@mediaalland (application-dpi: 240)<br />{<br />s|Button<br /> {<br />color: green;<br /> }<br />}<br />
  • 25. Media Query Options<br />ApplicationDPI<br />OS<br />
  • 26. Personal Thought on OS Media Queries<br />Don’t do itif you want to keep a unified code base<br />Handle Density and screen size, but not OS<br />
  • 27. Demo<br />Application DPI and Media Queries in Flex<br />
  • 28. Deeper Dive<br />Narciso Jaramillo<br />Deep Dive Into Multi Density & Multi Platform Application Development<br />
  • 29. ActionScript Only<br />Roll your own looking at:<br />stage.fullScreenWidth<br />In development I’ve had issues with stage.stageWidth<br />Capabilities.screenDPI<br />
  • 30. Demo<br />Application Sizing in ActionScript<br />
  • 31. Flash Builder Simulating<br />Flex<br />In Design View<br />At compile<br />ActionScript<br />At compile<br />
  • 32. !=<br />
  • 33.
  • 34.
  • 35. Developing for Multiple Devices<br />
  • 36. Don’t tweak for devices in code.<br />
  • 37. If you can avoid it.<br />
  • 38. But what about differences between UI controls IOS vs Android vsPlayBook<br />
  • 39. It depends<br />
  • 40. Configuring for Multiple Devices<br />
  • 41. Application Descriptor<br />You know that XML file<br />Special settings for<br />Android <br />IOS<br />
  • 42. BlackBerry Descriptor<br />BlackBerry Uses Application Descriptor and another file:<br />blackberry-tablet.xml<br />
  • 43. BlackBerry Descriptor <br />Allows you to make transparent apps and change preview icons.<br />Transparent apps aren’t supported on other platforms<br />
  • 44. Android Settings<br />Permissions<br />Custom URI<br />Compatibility Filtering<br />Install Location<br />
  • 45. Android Permissions<br />ACCESS_COARSE_LOCATION<br />ACCESS_FINE_LOCATION<br />ACCESS_NETWORK_STATE <br />ACCESS_WIFI_STATE <br />CAMERA <br />INTERNET <br />READ_PHONE_STATE<br />RECORD_AUDIO<br />WAKE_LOCK <br />WRITE_EXTERNAL_STORAGE <br />
  • 46. Android Custom URI<br />Allow web pages or other android apps to launch your app from a url when the application is installed. <br />
  • 47. Android Custom URI<br /><activity> <br /> <intent-filter> <br /> <action android:name="android.intent.action.MAIN"/> <br /> <category android:name="android.intent.category.LAUNCHER"/> <br /> </intent-filter> <br /> <intent-filter> <br /> <action android:name="android.intent.action.VIEW"/> <br /> <category android:name="android.intent.category.BROWSABLE"/> <br /> <category android:name="android.intent.category.DEFAULT"/> <br /> <data android:scheme="myURI"/> <br /> </intent-filter> <br /></activity> <br />URL would be:<br />myURI://com.myApp.uniquename<br />Where com.myApp.uniquename is the app id from your descriptor <br />
  • 48. Android compatibility filtering<br />Permissions assume all or nothing<br />So if a feature is optional, you have to set it such or it won’t show up in store<br />Important for Camera, Audio<br />
  • 49. Camera Filtering<br /><uses-permission android:name="android.permission.CAMERA" /> <br /><uses-feature android:name="android.hardware.camera" android:required="false"/> <br /><uses-feature android:name="android.hardware.camera.autofocus" android:required="false"/> <br /><uses-feature android:name="android.hardware.camera.flash" android:required="false"/> <br />
  • 50. Android Instal Location <br /><android> <br /> <manifestAdditions> <br /> <![CDATA[ <br /> <manifest android:installLocation="preferExternal"/> <br /> ]]> <br /> </manifestAdditions> <br /></android><br />
  • 51. IOS Settings<br />Models<br />Resolution<br />Custom URI<br />Compatibility Filtering<br />Exit or Pause<br />
  • 52. Models<br /><key>UIDeviceFamily</key><br /><array><br /><string>1</string><!-- iPod/iPhone --><br /><string>2</string><!-- iPad --><br /></array><br />
  • 53. Resolution<br /><requestedDisplayResolution>high</requestedDisplayResolution><br />High will allow you to draw single pixels on a high resolution screen, otherwise 1 pixel = 4 pixels<br />
  • 54. Custom URI<br /><key>CFBundleURLTypes</key><br /><array><br /><dict><br /><key>CFBundleURLSchemes</key><br /><array><br /><string>myURI</string><br /></array><br /><key>CFBundleURLName</key><br /><string>com.myApp.uniquename</string><br /></dict><br /></array><br />URL would be:<br />myURI://com.myApp.uniquename<br />If you set this to be the same as your application id you get compatibility with Android apps.<br />
  • 55. IOS compatibility filtering<br />Like Android it’s about discoverability and installation, not usage.<br />
  • 56. Compatibility Filtering<br /><key>UIRequiredDeviceCapabilities</key><br /><array><br /><string>microphone</string><br /><string>still-camera</string><br /></array><br />
  • 57. Exit or Pause<br /><key>UIApplicationExitsOnSuspend</key><br /><string>YES</string><br />
  • 58. Icon sizes<br />
  • 59. AIR Versions<br />There are some issues with AIR version and target<br />BlackBerry - 2.5<br />Android - 2.6<br />IOS -2.6, or 2.0 or 2.7<br />
  • 60. But that’s hard set<br /><applicationxmlns="http://ns.adobe.com/air/application/2.6"><br />
  • 61. Multiple Descriptors<br />Solution:<br />
  • 62. Publishing for Multiple Devices<br />
  • 63. Flash Builder<br />Publish to all platforms at the same time<br />
  • 64. Compiling and Packaging<br />Flash Builder uses features that are accessible through command line tools <br />Often using those tools<br />Therefore before it can be a feature in Flash Builder, has to be available in command line<br />
  • 65. Flash Builder vs Command line<br />Flash Builder will often lack ui that the command line exposes<br />So it behooves you to learn command line<br />
  • 66. Case in point<br />Publishing AIR files compatible with Amazon Store<br />
  • 67. Command line Compiling<br />OS Scripts<br />ANT (what I use)<br />Maven<br />
  • 68. Tools<br />ANT<br />MXMLC<br />AIR Packagers<br />ADT<br />blackberry-airpackager<br />pfi (no longer needed)<br />
  • 69. Process<br />Compile SWF<br />Gather External Resources<br />Package for target device<br />
  • 70. Compiling<br />Requires MXMLC<br />In ANT requires MXMLC Task<br />Despite the name, works for non MXML apps. <br />Doesn’t add the Flex Framework or anything either.<br />
  • 71. Compiling via ANT<br /><mxmlcfile="${projectFile}"output="${device.swf}"><br /> <load-configfilename="${FLEX_HOME}/frameworks/airmobile-config.xml"/><br /> <source-pathpath-element="${FLEX_HOME}/frameworks"/><br /> <static-link-runtime-shared-libraries/><br /> <compiler.library-pathdir="${FLEX_HOME}/frameworks"append="true"><br /><includename="libs/*"/><br /></compiler.library-path><br /></mxmlc><br />
  • 72. Compiling via ANT<br /><load-configfilename="${FLEX_HOME}/frameworks/airmobile-config.xml"/><br />On Desktops<br /><load-configfilename="${FLEX_HOME}/frameworks/air-config.xml"/><br />
  • 73. Demo<br />Command Line Compiling <br />with ANT<br />
  • 74. Gathering Files<br />SWF<br />Any assets used in application<br />Application descriptor file<br />
  • 75. Application Descriptor<br />Most have a line: <br /><content>[This value will be overwritten by Flash Builder in the output app.xml]</content><br />It won’t so you have to. <br />
  • 76. Packaging for Android<br /><execexecutable="${ADT}"dir="${android.collect}"><br /><argvalue="-package"/><br /><argline="-target apk"/><br /><argline="-storetype pkcs12"/><br /><argline="-keystore ${cert}"/><br /><argline="-storepass ${cert.password}"/><br /><argvalue="${app.name}"/><br /><argvalue="${app.name}-app.xml"/><br /><argvalue="${app.name}.swf"/><br /><argvalue="assets"/><br /></exec><br />
  • 77. Packaging for Android<br /><argline="-target apk"/><br />Options include <br /><ul><li>apk
  • 78. apk-debug
  • 79. apk-emulator</li></li></ul><li>Packaging for IOS<br /><execexecutable="${ADT}"dir="${ios.collect}"><br /><argvalue="-package"/><br /><argline="-target ipa-ad-hoc "/><br /><argline="-storetype pkcs12 "/><br /><argline="-keystore ${ios.cert} "/><br /><argline="-storepass ${ios.certpass} "/><br /><argline="-provisioning-profile ${ios.provision} "/><br /><argvalue="${app.name}.ipa"/><br /><argvalue="${app.name}-app.xml"/><br /><argvalue="${app.name}.swf"/><br /><argvalue="assets"/><br /></exec><br />
  • 80. Packaging for IOS<br /><argline="-target ipa-ad-hoc "/><br />Options include <br /><ul><li>ipa-test
  • 81. ipa-debug
  • 82. ipa-app-store
  • 83. ipa-ad-hoc</li></li></ul><li>Packaging for BlackBerry<br /><execexecutable="${bb.packager}"dir="${bb.collect}"><br /><argvalue="-package"/><br /><argvalue="${app.name}.bar"/><br /><argvalue="${app.name}-app.bb.xml"/><br /><argvalue="${app.name}.swf"/><br /></exec><br />
  • 84. Tons of options<br />
  • 85. Packaging for BlackBerry<br />-package - command to package<br /> -target (bar|bar-debug) - target format bar or bar-debug<br /> -connect <host> - host ip address for debugging<br /> -no-validation - turn off air and bar validation<br /> -list-files - list all files in the resulting package<br /> -env <var>=<value> - set an extra environment variable for the runtime<br /> -barVersion <version> - run in compatibility mode (set older version to be compatible with)<br /> -publisher - set the publisher (author) name<br /> -buildId - set the build id (4th segment of the version)<br /> -devMode - package in development mode<br /><signing options> (part of packaging options):<br /> -signDev - command to sign with developer's certificate<br /> -keystore <store> - keystore file<br /> -storepass <pass> - store password for certificate store<br /> -signRim - command to sign by rim (requires internet connection)<br /> -cskpass <pass> - password to encrypt long-lived keys<br /><deployment_options>:<br /> -installApp - command to install the package<br /> -launchApp - command to launch the app<br /> -device <deviceId> - set host name or IP address of the target<br /> -password <password> - device password<br />
  • 86. Packaging for BlackBerry<br />Debugging<br />Installation and launching<br />Signing<br />
  • 87. Demo<br />Command Line Packaging<br />with ANT<br />
  • 88. Packaging for Amazon<br /><execexecutable="${ADT}"dir="${android.collect}"><br /><argvalue="-package"/><br /><argline="-target apk"/><br /> <argline="-airDownloadURL ${amazon.url}"/><br /><argline="-storetype pkcs12"/><br /><argline="-keystore ${cert}"/><br /><argline="-storepass ${cert.password}"/><br /><argvalue="${app.name}"/><br /><argvalue="${app.name}-app.xml"/><br /><argvalue="${app.name}.swf"/><br /><argvalue="assets"/><br /></exec><br />
  • 89. So should you do this?<br />
  • 90. My Weasely answer:It Depends<br />
  • 91. Can you wait for the next version of AIR?<br />
  • 92. Is your app your competitive advantage, or a cost center?<br />
  • 93. Is your audience spread out on devices?<br />
  • 94. Studio Cloud<br />
  • 95. Follow up?<br />Feel free to contact me<br />terry.ryan@adobe.com<br />http://terrenceryan.com<br />Twitter: @tpryan<br />

×