Weitere ähnliche Inhalte
Ähnlich wie Jax 2011 keynote (20)
Mehr von Michael Chaize (11)
Kürzlich hochgeladen (20)
Jax 2011 keynote
- 1. Architecting user experiences
Michaël Chaize | Flash Platform Evangelist | www.RIAgora.com | @mchaize
© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential.
Wednesday, May 11, 2011 1
- 2. Adobe Flex
© 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential. 2
Wednesday, May 11, 2011 2
- 3. How Flex Works in the Browser
Flex SDK
MXML ActionScript
Flex Class Library
Debuggers
Flash Builder IDE
© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential.
Wednesday, May 11, 2011 3
- 4. How Flex Works in the Browser
Browser
Flex SDK
MXML ActionScript Flash Player
Flex Class Library
Debuggers SOAP HTTP/S AMF/S RTMP/S
Flash Builder IDE
Web Server
Compile
XML/HTTP
Adobe Data Services
REST
SOAP Web Services J2EE Application Server
Existing Applications & Infrastructure
© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential.
Wednesday, May 11, 2011 3
- 5. Flex & Java
&
Richness / Fast / Open-source / Industrialization
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential.
Wednesday, May 11, 2011 4
- 6. © 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential.
Wednesday, May 11, 2011 5
- 7. e explosion of devices introduces new
challenges for application development
© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential.
Wednesday, May 11, 2011 5
- 8. Native Mobile Application Development Model
A costly, inefficient development model
Native Native Native Native
App App App App
Additional
OS’s
© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential.
Wednesday, May 11, 2011 6
- 9. Introducing a new mobile development paradigm
One Tool, One Language, One Codebase
Flex Application Common codebase
AIR
Additional
OS’s
Any Platform
© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential.
Wednesday, May 11, 2011 7
- 10. Platforms, browsers, and devices
In-browser
Outside the browser
Mobile Platforms
Set-top boxes (Future)
© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential.
Wednesday, May 11, 2011 8
- 11. Adobe AIR
© 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential. 9
Wednesday, May 11, 2011 9
- 12. How Flex Works on Mobile and Desktop
Flex SDK
MXML ActionScript
Flex Class Library
Debuggers
Flash Builder IDE
© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential.
Wednesday, May 11, 2011 10
- 13. How Flex Works on Mobile and Desktop
Mobile or Desktop
Files SQLite Noti cations Clipboard
Flex SDK
MXML ActionScript AIR Client Runtime
Flex Class Library
Debuggers SOAP HTTP/S AMF/S RTMP/S
Flash Builder IDE
Web Server / Market place
Compile & Package
XML/HTTP
LC Data Services
REST
SOAP Web Services J2EE Application Server
Existing Applications & Infrastructure
© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential.
Wednesday, May 11, 2011 10
- 14. Adobe AIR APIs
- Multitouch
- Geolocation
- Cameras
- Microphone
- Accelerometer
- Display a web page
- SQLite local database
- Native extensions
- GPU acceleration
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential.
Wednesday, May 11, 2011 11
- 15. AIR on smartphones and tablets
© 2011 Adobe Systems Incorporated.
Wednesday, May 11, 2011 12
- 17. Adobe Flex 4.5
4.5
© 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential. 14
Wednesday, May 11, 2011 14
- 18. FLEX FRAMEWORK 4
SPARK COMPONENT MODEL
ActionScript MXML
Component Skin
Graphics
Behavior Layout
Animation
Logic Parts
Data CSS properties States
Wednesday, May 11, 2011 15
- 19. Mobile Applications in Flex 4.5
s:Application s:ViewNavigatorApplication s:TabbedViewNavigatorApplication
© 2010 Adobe Systems Incorporated. All Rights Reserved. 16
Wednesday, May 11, 2011 16
- 20. <s:ViewNavigatorApplication> life cycle
views.ListEmployees views.DetailsEmployee views.ListEmployees
view destroyed view created
view destroyed view created
“BACK” bu on
DATA subset DATA
persisted in memory
© 2010 Adobe Systems Incorporated. All Rights Reserved. 17
Wednesday, May 11, 2011 17
- 21. <s:ViewNavigatorApplication> life cycle
views.ListEmployees views.DetailsEmployee views.ListEmployees
view destroyed view created
view destroyed view created
“BACK” bu on
DATA subset DATA
persisted in memory
© 2010 Adobe Systems Incorporated. All Rights Reserved. 17
Wednesday, May 11, 2011 17
- 22. <s:ViewNavigatorApplication> life cycle
views.ListEmployees views.DetailsEmployee views.ListEmployees
view destroyed view created
view destroyed view created
“BACK” bu on
DATA subset DATA
persisted in memory
© 2010 Adobe Systems Incorporated. All Rights Reserved. 17
Wednesday, May 11, 2011 17
- 23. ActionBar
navigationContent titleContent actionContent
<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>
© 2010 Adobe Systems Incorporated. All Rights Reserved. 18 3
Wednesday, May 11, 2011 18
- 24. Components that have Mobile Skins
§ Bu on
§ CheckBox
§ DataGroup
§ Group/HGroup/VGroup/TileGroup
§ Image/BitmapImage
§ Label List
§ RadioBu on/RadioBu onGroup
§ Scroller
§ TextArea
§ TextInput
© 2010 Adobe Systems Incorporated. All Rights Reserved. 19
Wednesday, May 11, 2011 19
- 25. Screens and Flex 4.5
<?xml version="1.0"
encoding="utf-8"?>
<s:MobileApplication
applicationDPI="160">
...
var curDensity:Number =
FlexGlobals.topLevelApplication.runtimeDPI;
<s:Image>
<s:source>
<s:MultiDPIBitmapSource
source160dpi="logo.png"
source240dpi="logo240.png"
source320dpi="logo320.png" />
</s:source>
</s:Image>
© 2010 Adobe Systems Incorporated. All Rights Reserved. 20
Wednesday, May 11, 2011 20
- 26. Flex 4.5 and tablets
Android tablets BlackBerry PlayBook Apple tablets
© 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential. 21
Wednesday, May 11, 2011 21
- 27. Demo
© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential. 22
Wednesday, May 11, 2011 22
- 28. Tablet and Enterprise applications
Camera GPS
3G
Mobility
Bright screen Microphone
© 2011 Adobe Systems Incorporated.
Wednesday, May 11, 2011 23
- 29. Mobile applications + JAVA = REAL-TIME
© 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential. 24
Wednesday, May 11, 2011 24
- 31. LiveCycle Collaboration Service Flex & JAVA API
Multi-user collaboration in real time
§ Engage more effectively through a web presence enhanced
with real-time collaboration tools.
§ Integrate text chat, whiteboard functionality, webcam video,
and audio into any rich Internet application (RIA),
Major Capabilities
Peer-to-peer (P2P) streaming of data, audio and video HTTP server-to-server APIs
Private audio/video streaming Server-side provisioning of services
Large Rooms – via on-demand loading of user Audio/video application multicast
presence
Record and Playback Screen sharing
JavaScript APIs – integration with a customer’s existing websites
© 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential. 26
All external content and images pending approvals.
Wednesday, May 11, 2011 26
- 32. JAVA JAVA + FLEX 4
rockstar rockstar
Wednesday, May 11, 2011 27
- 33. JAVA + FLEX 4.5
HYPER ROCK STAR
JAVA JAVA + FLEX 4
rockstar rockstar
Wednesday, May 11, 2011 27
- 34. Michaël Chaize & resources
RIAgora.com Flex.org
labs.adobe.com
developer.adobe.com
@mchaize Tour de Mobile Flex
© 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential. 30
Wednesday, May 11, 2011 30
- 35. © 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential.
Wednesday, May 11, 2011 31