Download as PDF, PPTX
Uploaded byMichael Chaize
Devoxx 2010: Develop mobile applications with Flex
This document discusses using Adobe AIR 2.5 to develop mobile applications for multiple screens. Key points include: - AIR 2.5 allows developing native mobile apps using ActionScript that can access device capabilities like geolocation and data storage. - Apps are compiled to Android APK or iOS IPK files and distributed through mobile app stores. - The document demonstrates mobile app navigation patterns, components optimized for mobile, and encourages attendees to try building a sample mobile Flex app.
More Related Content
Similar to Devoxx 2010: Develop mobile applications with Flex
Devoxx 2010: Develop mobile applications with Flex
- 1. ©2010 Adobe SystemsIncorporated. All Rights Reserved. Adobe Confidential. Develop mobile applications with AIR 2.5 James Ward & Michaël Chaize | Platform Evangelists
- 2. ©2010 Adobe SystemsIncorporated. All Rights Reserved. Adobe Confidential. James Ward & Michaël Chaize 2 @mchaize RIAgora.comjamesward.com @riacowboy
- 3.
- 4. © 2010 AdobeSystems Incorporated. All Rights Reserved. Native Applications iOS Native App Native App Native App Native App Native App Native App
- 5. © 2010 AdobeSystems Incorporated. All Rights Reserved. AIR Flash Player Abstraction Layer iOS Flex Application
- 6. © 2010 AdobeSystems Incorporated. All Rights Reserved. Adobe Confidential. Technologic partners Open Screen Project Content providers
- 7. © 2010 AdobeSystems Incorporated. All Rights Reserved. Adobe Confidential. Flash Player 10.1 Flash Player 10.1 Google TV
- 8. © 2010 AdobeSystems Incorporated. All Rights Reserved. Adobe Confidential. Adobe AIR 2.5 = native applications = multiple screens
- 9. © 2010 AdobeSystems Incorporated. All Rights Reserved. AIR extends the benefits of Flash Player Geo-Location SQLite Application Update Framework Application Lifecycle .AIR File format for multi-screen applications Enhanced Application Security model Marketplace Distribution Mobile Hardware Softkey Support File-System Access (if allowed) MediaLibrary API Native Extensibility ! Richer and more engaging user experiences out of the browser ! Empower Flash developers to deploy applications in app catalogs ! Leverage desktop AIR app ecosystem ! Shared codebase and porting with Flash Player ActionScript3 Support Memory, battery & CPU optimizations Audio/Video hardware decoding Optimized SWF management Multi-touch and Gestures Hardware Acceleration Mobile Text input
- 10. © 2010 AdobeSystems Incorporated. All Rights Reserved. Deploying AIR Android Applications Chroma Circuit.apkChroma Circuit.air ! AIR Applications are packaged up as .APK files ! Will be distributed through Android Market and other catalogs ! AIR Application upgrade mechanism through Android Market ! AIR Runtime will be distributed in Android Market as Shared Library ! Users will have to download the Runtime once for all AIR applications ! Upgrade through the Android Market Android Market Android Device
- 11. © 2010 AdobeSystems Incorporated. All Rights Reserved. AIR for iOS ! Export SWF to IPK ! Cross-Compiles AIR Runtime and App to native Objective-C Bytecode ! Uses LLVM ! Many AIR APIs are implemented ! Some APIs not possible (Loader.loadBytes)
- 12. © 2010 AdobeSystems Incorporated. All Rights Reserved. AIR for BlackBerry PlayBook http://us.blackberry.com/developers/tablet/devresources.jsp WIN A PLAYBOOK !!!
- 13. © 2010 AdobeSystems Incorporated. All Rights Reserved. Adobe Confidential. TOUR DE MOBILE FLEX
- 14. © 2010 AdobeSystems Incorporated. All Rights Reserved. Mobile Applications in "Hero" 14 s:TabbedMobileApplications:MobileApplications:Application
- 15. © 2010 AdobeSystems Incorporated. All Rights Reserved. 1 MobileApplication and TabbedMobileApplication ! View stack metaphor ! View ! ViewNavigator / TabbedViewNavigator ! Built-in mobile navigation experience ! Action bar ! Back button ! Transitions ! APIs 15
- 16. © 2010 AdobeSystems Incorporated. All Rights Reserved. ViewNavigator API ! navigator.pushView(); ! navigator.popView(); ! navigator.popToFirstView() ! navigator.activeView; 16 2
- 17. © 2010 AdobeSystems Incorporated. All Rights Reserved. ActionBar <s:View xmlns:fx=http://ns.adobe.com/mxml/2009 … title=”Expenses"> <s:navigationContent> <s:Button icon="@Embed('assets/home.png')"/> </s:navigationContent> <s:actionContent> <s:Button label=”+"/> </s:actionContent> </s:View> 17 3 navigationContent titleContent actionContent
- 18. © 2010 AdobeSystems Incorporated. All Rights Reserved. Components that have Mobile Skins ! Button ! CheckBox ! DataGroup ! Group/HGroup/VGroup/TileGroup ! Image/BitmapImage ! Label List ! RadioButton/RadioButtonGroup ! Scroller ! TextArea ! TextInput 18
- 19. © 2010 AdobeSystems Incorporated. All Rights Reserved. View Lifecycle ! Alternative option: destructionPolicy=“none” 19 View becomes active View Created Another view becomes active View Destroyed User navigates back to view View Recreated data 3B
- 20. © 2010 AdobeSystems Incorporated. All Rights Reserved. Mobile ItemRenderers ! MobileItemRenderer ! MobileIconItemRenderer <s:MobileIconItemRenderer labelField="lastName" messageField="title" iconField="picture" decoratorClass=”phoneIcon"> 20 4
- 21. © 2010 AdobeSystems Incorporated. All Rights Reserved. Adobe Confidential. LET’S CODE A FLEX MOBILE APP
- 22. labs.adobe.com Download Flash Builder“Burrito” and Flex “Hero” Get the source code of Tour de Mobile Flex Check the Flex “Hero” tutorials on developer.adobe.com Free Flex 4 trainings in Belgium and seminars http://bit.ly/ria_update
- 23. ©2010 Adobe SystemsIncorporated. All Rights Reserved. Adobe Confidential. Feel free to contact us 23 @mchaize RIAgora.comjamesward.com @riacowboy