Your SlideShare is downloading. ×
Developing AIR for Android with Flash Professional CS5
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

Developing AIR for Android with Flash Professional CS5


Published on

A presentation I gave to the Bay Area Mobile Meetup on Developing AIR for Android with Flash Professional CS5.

A presentation I gave to the Bay Area Mobile Meetup on Developing AIR for Android with Flash Professional CS5.

Published in: Technology

1 Like
  • Be the first to comment

No Downloads
Total Views
On Slideshare
From Embeds
Number of Embeds
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

No notes for slide
  • Foundation of development for mobileAIR for Android Technical tips and tricks
  • ComputerBig ScreenPower SupplyConsistent NetworkKeyboardMouseChairDeskMobileSmall ScreenBatteryInconsistent NetworkFingersSensors
  • Transcript

    • 1. Developing AIR for Android using Flash CS5
      Chris Griffith
    • 2. Disclaimer
      These opinions and thoughts are my own, and may or may not reflect the opinions of the company that I work for.
    • 3. Who has built for mobile?
    • 4. Who uses what?
    • 5.
    • 6. My Mobile App Portfolio
    • 7. Mobile is Everywhere
    • 8. Designing for Mobile
    • 9. Context
    • 10. mobile vs. desktop
    • 11. Orientation
    • 12. Touch
    • 13. Touch
      The average fingertip is 3x larger than the hand cursor
      Make your buttons 3x larger
      Then make them even larger
    • 14. With fingers, come hands…
    • 15. Ergonomics
      How will they touch it?
      One Thumb?
      Two Thumbs?
      Pointer Finger?
    • 16.
    • 17. Data based on respective products published technical specifications
      Pixels Per Inch (PPI)
    • 18. The Adobe® AIR® 2.6 runtime enables developers to use HTML, JavaScript, and ActionScript® to build web applications that run as standalone client applications without the constraints of a browser. Adobe AIR allows designers and developers by providing a consistent and flexible development environment for the delivery of applications across devices and platforms. Support for Android™, BlackBerry Tablet OS,* and iOS mobile operating systems and televisions is now available.
    • 19. AIR for Android Overview
      Multitouch / Gesture Support
      Screen Orientation
      GPU Acceleration
      SQLite DB
      No Native Widgets
      No Multiple Camera Support
      No Access to Contacts
      Limited SMS Support
    • 20. Creating an Android App: Setup
      • Get the Android SDK:
      Allows you to create and install apps on your device
      • Android - SDK Manager to install packages etc.
      • 21. ADB – Android Device Debugger installs apps on your device
      • 22. DDMS - Dalvik Debug Monitor for desktop simulation.
      • 23. Download AIR 2.6
      • 24. Get AIR for Android runtime .apk installed
    • Development Environments
    • 25. Accelerometer
      varaccel:Accelerometer = new Accelerometer();
      accel.addEventListener(AccelerometerEvent.UPDATE, update);
      function update(e:AccelerometerEvent):void
    • 26. Gestures
      cell.addEventListener(TransformGestureEvent.GESTURE_ZOOM, onZoom);
      function onZoom(e:TransformGestureEvent):void
      cell.scaleX *= e.scaleX;
      cell.scaleY = cell.scaleX;
      cell.addEventListener(TransformGestureEvent.GESTURE_ROTATE, onRotate);
      function onRotate(e:TransformGestureEvent):void
      cell.rotation += e.rotation;
    • 27. Geolocation
      var geo: Geolocation;
      if (Geolocation.isSupported) {            geo = new Geolocation();            geo.addEventListener(GeolocationEvent.UPDATE, updateHandler);            geo.setRequestedUpdateInterval(10000);} else {            log.text = "Geolocation feature not supported"; }
    • 28. Hardware Keys
      stage.addEventListener(KeyboardEvent.KEY_DOWN, onKeyDown, false, 0, true);function onKeyDown(event:KeyboardEvent):void {
      //Back Key  if (event.keyCode ==Keyboard.BACK) {      event.preventDefault(); // to kill event from running default behavior       //do your own back stuff  }
      //Menu Key
        if (event.keyCode ==Keyboard.MENU) {      event.preventDefault(); // to kill event from running default behavior       //do your own back stuff  }}
    • 29. Orientation
      stage.scaleMode = StageScaleMode.NO_SCALE;
      stage.align = StageAlign.TOP_LEFT;
      function setPosition():void
      vidHolder.x = stageWidth/2 - vidHolder.width/2;
      vidHolder.y = stageHeight/2 - vidHolder.height/2;
      //If the layout is vertical
      if (stage.stageWidth < stage.stageHeight)
      //Adjust graphics
      stage.addEventListener(Event.RESIZE, resizeLayout);
      function resizeLayout(e:Event):void
    • 30. SQLite Support
    • 31. StageWebView
      You get a browser in your Flash app!
      Good solution for
      Facebook Connect
      Remote Content
    • 32. Limitations
    • 33. No Native Controls
    • 34. No Access to Contacts
    • 35. Building Applications
    • 36. Don’t Fear the Timeline
    • 37. Publishing
    • 38. Publishing
    • 39. To the Market…
    • 40. .air
      AIR Packaging & Distribution Workflow
    • 41. Development Guidelines
    • 42. Graphics
      Consider bitmaps over vectors
      Keep bitmaps as small as possible
      Minimize number of vectors
      Test your animations with different qualities of Stage
      Avoid, if possible:
      Blend modes
      Perspective distortion
    • 43. GPU Acceleration
      Set rendering mode to GPU
      Make sure cacheAsBitmap is set to true on your DisplayObject like
      this:square.cacheAsBitmap = true;
    • 44. GPU Acceleration
      cacheAsBitmapMatrix property
      Make sure to assign a Matrix to the cacheAsBitmapMatrix property
      on your DisplayObject like this:
      square.cacheAsBitmapMatrix = new Matrix();
    • 45. GPU Acceleration
    • 46. Text
      • Use opaque background over transparency
      • 47. Avoid TLF
      • 48. Test different anti-aliasing techniques (animation, bitmap text...)
      • 49. Avoid frequently-updated text
      • 50. Use appendText vs. text +=
    • Horizontal? Vertical? Both?
      Content should dictate orientation, but don’t forget about the keyboard.
      Consider adjusting content based on layout:
    • 51. Display Objects
      Use the appropriate type of display object
      Objects that aren’t interactive, use Shape();
      trace(getSize(new Shape()));
      // output: 216
      Interactive but no timeline? Use Sprite();
      trace(getSize(newSprite())); // output: 396
      Need animation? Use Movieclip();
      trace(getSize(newMovieClip())); // output: 416
    • 52. Freeing Movieclips
      Alpha? RemoveChild? Visible?
      Even when removed from the display list, the movie clip still dispatches the Event.ENTER_FRAME event.
      runningBoy.addEventListener(Event.REMOVED_FROM_STAGE, deactivate);
      function deactivate(e:Event):void
      e.currentTarget.removeEventListener(Event.ENTER_FRAME, handleMovement);
    • 53. Flex for Mobile - HERO
    • 54. Hero in a Nutshell: Mobile Application Development
      Allow developers to create a single mobile project that will run on multiple mobile environments
      UI components supporting touchscreen interaction
      Application framework fitted with common mobile UI patterns
      Interactive performance tuned for mobile devices
    • 55. Resources
      Tour de Flex is a desktop application for exploring Flex capabilities and resources, including the core Flex components, Adobe AIR, data integration, and a variety of third-party components, effects, skins, and more.
    • 56. Resources
    • 57.
    • 58. Thanks!
      Twitter: @chrisgriffith