Having fun with Flex 4 Layouts
Enrique Duvos
Xavi Beumala
Thursday, 4 November 2010
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
Speaker and session intro
Enrique Duvos
@eduvos...
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
Agenda
■
Speaker and Session intro
■
Reviewing ...
Flex 3 Layouts
Thursday, 4 November 2010
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
Flex 3
Thursday, 4 November 2010
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
Flex 3
‣ UIComponent lifecycle remains intact a...
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
Flex 3
‣ UIComponent lifecycle remains intact a...
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
Flex 3
Construction
Addition
Initialization
Inv...
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
Invalidation - Validation Cycle
InvalidationVal...
Spark Layouts
Thursday, 4 November 2010
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
Important concepts
Thursday, 4 November 2010
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
Important concepts
‣ UIComponent lifecycle rema...
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
Important concepts
‣ UIComponent lifecycle rema...
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
Important concepts
‣ UIComponent lifecycle rema...
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
Important concepts
‣ UIComponent lifecycle rema...
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
Important concepts
‣ UIComponent lifecycle rema...
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
Spark layouts: Assignable Layouts
Thursday, 4 N...
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
Spark layouts: Assignable Layouts
‣ Layouts are...
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
Spark layouts: Assignable Layouts
‣ Layouts are...
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
Spark layouts: Assignable Layouts
‣ Layouts are...
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
Spark layouts: Assignable Layouts
Flex 3 Flex4
...
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
Spark layouts: Assignable Layouts
Flex 3 Flex4
...
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
Spark layouts: Assignable Layouts
Flex 3 Flex4F...
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
Spark layouts: Assignable Layouts
Flex 3 Flex4F...
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
Spark layouts: Virtualization
‣ Virtualization ...
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
Spark layouts: Virtualization
‣ Virtualization ...
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
Spark layouts: Virtualization
Flex3
Thursday, 4...
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
Spark layouts: Virtualization
Flex4
Thursday, 4...
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
Spark layouts: Transformations
‣ 2D & 3D Transf...
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
Spark layouts: Transformations
‣ Post-layout tr...
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
Spark layouts: Transformations
‣ Post-layout tr...
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
Spark layouts: Depth Order
‣ IVisualElement.dep...
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
Spark layouts: Custom Layouts
‣ Quick and estab...
Demos
Thursday, 4 November 2010
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
Demo I
Thursday, 4 November 2010
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
Demo I
‣ Changing the layout at runtime
Thursda...
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
Demo I
‣ Changing the layout at runtime
‣ Addin...
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
Demo I
‣ Changing the layout at runtime
‣ Addin...
Building a
Custom Layout
Thursday, 4 November 2010
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
Custom layout: The Basics
Thursday, 4 November ...
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
Custom layout: The Basics
‣ Layouts extend Layo...
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
Custom layout: The Basics
Thursday, 4 November ...
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
Custom layout: The Basics
‣ Extending LayoutBas...
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
Custom layout: ILayoutElement
‣ element.setLayo...
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
Custom layout: Scrolling
Thursday, 4 November 2...
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
Custom layout: Scrolling
Thursday, 4 November 2...
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
Custom layout: Scrolling
Thursday, 4 November 2...
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
Custom layout: Sizing
‣ What happens if we don’...
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
Custom layout: 2D Layout transforms
‣ IVisualEl...
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
Custom layout: 2D Layout transforms
Thursday, 4...
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
Custom layout: 3D Layout transforms
‣ IVisualEl...
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
Custom layout: 3D Layout transforms
Thursday, 4...
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
Custom layout: Virtualization
‣ LayoutBase.useV...
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
Spark layouts: Misc
‣ UIComponent.IncludeInLayo...
Demos
More Layouts
Thursday, 4 November 2010
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
WheelLayout
by Evtim Georgiev
http://evtimmy.co...
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
TimeMachine Layout
by Gilles Guillemin
http://w...
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
Fan Layout
by Miti Pricope
http://miti.pricope....
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
Coverflow
by Xavi Beumala
http://www.rialvalue....
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
Accordion3DLayout
by Xavi Beumala
http://
Thurs...
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
Carroflow Layout
by Xavi Beumala
http://www.ria...
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
Summary
■
UIComponent lifecycle remains intact
...
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
Summary
■
More Links:
■
http://opensource.adobe...
Q&A
Thursday, 4 November 2010
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
Thanks
■
Thanks to Evtim Georgiev Flex SDK Engi...
©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
Thursday, 4 November 2010
Upcoming SlideShare
Loading in...5
×

Max 2010: Having Fun Flex4 Layouts

6,960

Published on

Presentation from Xavi Beumala (http://www.rialvalue.com) and Enrique Duvos (http://www.duvos.com) at MAX 2010 around Flex4 Layouts

0 Comments
4 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
6,960
On Slideshare
0
From Embeds
0
Number of Embeds
2
Actions
Shares
0
Downloads
89
Comments
0
Likes
4
Embeds 0
No embeds

No notes for slide

Max 2010: Having Fun Flex4 Layouts

  1. 1. Having fun with Flex 4 Layouts Enrique Duvos Xavi Beumala Thursday, 4 November 2010
  2. 2. ©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Speaker and session intro Enrique Duvos @eduvos Group Manager, EMEA Flash Platform Evangelism http://www.duvos.com Xavi Beumala @xbeumala Technical Architect, TXI http://www.rialvalue.com Thursday, 4 November 2010
  3. 3. ©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Agenda ■ Speaker and Session intro ■ Reviewing Flex 3 Layouts ■ UIComponent lifecycle and the role of the LayoutManager class ■ Spark (Flex 4) layouts ■ What’s new ■ Assignable layouts ■ Virtualization ■ Pixel based scrolling ■ Transformations ■ Custom layouts ■ “Demotime” ■ Runtime layout control, scrolling, sizing, pre & post-layout transforms, virtualization arbitrary 2D/3D transformations (Coverflow, Accordion3D, Carrowflow, Flip effect, etc) ■ Summary ■ Q&A 3 Thursday, 4 November 2010
  4. 4. Flex 3 Layouts Thursday, 4 November 2010
  5. 5. ©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Flex 3 Thursday, 4 November 2010
  6. 6. ©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Flex 3 ‣ UIComponent lifecycle remains intact as in Flex3 Thursday, 4 November 2010
  7. 7. ©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Flex 3 ‣ UIComponent lifecycle remains intact as in Flex3 ‣ UIComponent lifecycle has been extended to support pluggable layouts Thursday, 4 November 2010
  8. 8. ©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Flex 3 Construction Addition Initialization Invalidation Validation Update Removal BirthGrowth& maturity Death Thursday, 4 November 2010
  9. 9. ©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Invalidation - Validation Cycle InvalidationValidation invalidate properties invalidate size invalidate display list commit properties measure layout chrome Update Layout Manager Render or EnterFrame event Thursday, 4 November 2010
  10. 10. Spark Layouts Thursday, 4 November 2010
  11. 11. ©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Important concepts Thursday, 4 November 2010
  12. 12. ©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Important concepts ‣ UIComponent lifecycle remains intact as in Flex3 Thursday, 4 November 2010
  13. 13. ©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Important concepts ‣ UIComponent lifecycle remains intact as in Flex3 ‣ s:Group is the basis of the containment model in Spark Thursday, 4 November 2010
  14. 14. ©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Important concepts ‣ UIComponent lifecycle remains intact as in Flex3 ‣ s:Group is the basis of the containment model in Spark ‣ s:Group can be seen as an mx:Container but with all the rarely used functionality stripped away Thursday, 4 November 2010
  15. 15. ©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Important concepts ‣ UIComponent lifecycle remains intact as in Flex3 ‣ s:Group is the basis of the containment model in Spark ‣ s:Group can be seen as an mx:Container but with all the rarely used functionality stripped away ‣ Container components compute Layout through delegation Thursday, 4 November 2010
  16. 16. ©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Important concepts ‣ UIComponent lifecycle remains intact as in Flex3 ‣ s:Group is the basis of the containment model in Spark ‣ s:Group can be seen as an mx:Container but with all the rarely used functionality stripped away ‣ Container components compute Layout through delegation ‣ s:DataGroup is a data-driven Group with ItemRenderers. mx:Repeater done right Thursday, 4 November 2010
  17. 17. ©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Spark layouts: Assignable Layouts Thursday, 4 November 2010
  18. 18. ©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Spark layouts: Assignable Layouts ‣ Layouts are assigned by composition and not inheritance Thursday, 4 November 2010
  19. 19. ©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Spark layouts: Assignable Layouts ‣ Layouts are assigned by composition and not inheritance vs. Thursday, 4 November 2010
  20. 20. ©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Spark layouts: Assignable Layouts ‣ Layouts are assigned by composition and not inheritance vs. Benefits ‣ Number of container components is reduced ‣ Layout logic is decoupled from container components promoting modularity and code reuse ‣ Interchangeable at runtime Thursday, 4 November 2010
  21. 21. ©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Spark layouts: Assignable Layouts Flex 3 Flex4 Thursday, 4 November 2010
  22. 22. ©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Spark layouts: Assignable Layouts Flex 3 Flex4 Thursday, 4 November 2010
  23. 23. ©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Spark layouts: Assignable Layouts Flex 3 Flex4Flex4 Thursday, 4 November 2010
  24. 24. ©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Spark layouts: Assignable Layouts Flex 3 Flex4Flex4 ‣ The most used combinations have been packaged as components by themselves for commodity Thursday, 4 November 2010
  25. 25. ©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Spark layouts: Virtualization ‣ Virtualization improves runtime performance by creating and recycling item renderers only as they come into the visible content area of a container (a.k.a Viewport). ‣ Built-in support on DataGroup or SkinnableDataContainer containers with VerticalLayout, HorizontalLayout and TileLayout. ‣ Spark Lists are virtualised out-of-the-box Thursday, 4 November 2010
  26. 26. ©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Spark layouts: Virtualization ‣ Virtualization improves runtime performance by creating and recycling item renderers only as they come into the visible content area of a container (a.k.a Viewport). ‣ Built-in support on DataGroup or SkinnableDataContainer containers with VerticalLayout, HorizontalLayout and TileLayout. ‣ Spark Lists are virtualised out-of-the-box Benefits ‣ Improved performance ‣ Number of itemRenderers instances reduced to the minimum Thursday, 4 November 2010
  27. 27. ©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Spark layouts: Virtualization Flex3 Thursday, 4 November 2010
  28. 28. ©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Spark layouts: Virtualization Flex4 Thursday, 4 November 2010
  29. 29. ©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Spark layouts: Transformations ‣ 2D & 3D Transformations The LayoutBase and ILayoutElement interfaces are designed with 3D support in mind Thursday, 4 November 2010
  30. 30. ©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Spark layouts: Transformations ‣ Post-layout transforms Properties like x, y, rotate or scale on individual renderers can be modified without affecting the layout Layout reflows when changing the size Layout is not affected by the size transformation Thursday, 4 November 2010
  31. 31. ©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Spark layouts: Transformations ‣ Post-layout transforms Properties like x, y, rotate or scale on individual renderers can be modified without affecting the layout 1. spark.effects.AnimateTransform.applyChangesPostLayout (value : Boolean ) 2. mx.core.UIComponent.postLayoutTransformOffsets( value : TransformOffsets) 3. mx.core.UIComponent.transformAround(...) Thursday, 4 November 2010
  32. 32. ©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Spark layouts: Depth Order ‣ IVisualElement.depth ‣ Controls the order in which items inside containers are rendered ‣ Depth can be changed dynamically to overlap elements as needed Thursday, 4 November 2010
  33. 33. ©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Spark layouts: Custom Layouts ‣ Quick and established way to create custom layouts extending LayoutBase and implementing ILayoutElement ‣ Knowledge reuse to instantiate and use the layouts. No new component APIs Thursday, 4 November 2010
  34. 34. Demos Thursday, 4 November 2010
  35. 35. ©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Demo I Thursday, 4 November 2010
  36. 36. ©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Demo I ‣ Changing the layout at runtime Thursday, 4 November 2010
  37. 37. ©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Demo I ‣ Changing the layout at runtime ‣ Adding animations when changing the layout Thursday, 4 November 2010
  38. 38. ©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Demo I ‣ Changing the layout at runtime ‣ Adding animations when changing the layout ‣ http://evtimmy.com/2010/04/two-examples-of-layout-animations/ Thursday, 4 November 2010
  39. 39. Building a Custom Layout Thursday, 4 November 2010
  40. 40. ©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Custom layout: The Basics Thursday, 4 November 2010
  41. 41. ©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Custom layout: The Basics ‣ Layouts extend LayoutBase ‣ LayoutBase is not a UIComponent but it has some familiar methods ‣ measure () ‣ updateDisplayList() ‣ The invalidation - validation pattern is driven by the host component. To invalidate the layout we have to invalidate the target component ‣ The host component invokes these methods by delegation during its validation - invalidation cycle Thursday, 4 November 2010
  42. 42. ©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Custom layout: The Basics Thursday, 4 November 2010
  43. 43. ©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Custom layout: The Basics ‣ Extending LayoutBase ‣ Using ILayoutElement interface Thursday, 4 November 2010
  44. 44. ©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Custom layout: ILayoutElement ‣ element.setLayoutBounds( width : Number, height : Number, postLayout : Boolean ) ‣ element.getLayoutBoundsHeight() ‣ element.getLayoutBoundsWidth() ‣ element.transformAround() Thursday, 4 November 2010
  45. 45. ©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Custom layout: Scrolling Thursday, 4 November 2010
  46. 46. ©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Custom layout: Scrolling Thursday, 4 November 2010
  47. 47. ©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Custom layout: Scrolling Thursday, 4 November 2010
  48. 48. ©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Custom layout: Sizing ‣ What happens if we don’t specify the width or height of the container ‣ Nothing will be displayed Thursday, 4 November 2010
  49. 49. ©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Custom layout: 2D Layout transforms ‣ IVisualElement.setLayoutMatrix( ) ‣ IVisualElement.transformAround( ) Thursday, 4 November 2010
  50. 50. ©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Custom layout: 2D Layout transforms Thursday, 4 November 2010
  51. 51. ©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Custom layout: 3D Layout transforms ‣ IVisualElement.setLayoutMatrix3D( ) ‣ IVisualElement.transformAround( ) Thursday, 4 November 2010
  52. 52. ©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Custom layout: 3D Layout transforms Thursday, 4 November 2010
  53. 53. ©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Custom layout: Virtualization ‣ LayoutBase.useVirtualLayout ‣ Instead of using target.getElementAt use target.getVirtualElementAt ‣ Using the scroll position IViewPort.horizontalScrollPosition and IViewPort.verticalScrollPosition find out the visual items within the ViewPort Thursday, 4 November 2010
  54. 54. ©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Spark layouts: Misc ‣ UIComponent.IncludeInLayout ‣ Elements with includeInLayout=false are not sized or positioned ‣ Useful to reduce the amount of nested containers and thus the performance under some situations ‣ GroupBase.autoLayout ‣ When true, measurement and layout are done when the position or size of a child is changed ‣ The new layout mechanism allows smooth pixel-perfect scrolling Thursday, 4 November 2010
  55. 55. Demos More Layouts Thursday, 4 November 2010
  56. 56. ©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. WheelLayout by Evtim Georgiev http://evtimmy.com/2009/06/wheellayout-source-and-quick-mashup/ Thursday, 4 November 2010
  57. 57. ©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. TimeMachine Layout by Gilles Guillemin http://www.flexstuff.co.uk/2009/11/06/flex-4-animated-timemachine-layout/ Thursday, 4 November 2010
  58. 58. ©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Fan Layout by Miti Pricope http://miti.pricope.com/2009/05/29/playing-with-custom-layout-in-flex-4/ Thursday, 4 November 2010
  59. 59. ©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Coverflow by Xavi Beumala http://www.rialvalue.com/blog/2010/03/30/flex4-coverflow-layout/ Thursday, 4 November 2010
  60. 60. ©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Accordion3DLayout by Xavi Beumala http:// Thursday, 4 November 2010
  61. 61. ©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Carroflow Layout by Xavi Beumala http://www.rialvalue.com/blog/2010/04/14/carroflow-another-3d-layout-for-flex4/ Thursday, 4 November 2010
  62. 62. ©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Summary ■ UIComponent lifecycle remains intact ■ Spark based layouts are decoupled from containers and assigned by composition ■ New containers and APIs enables richer and more creative layouts ( 2D/ 3D, Pixel based scrolling, Virtualization, pre and post-transforms ■ Links: ■ www.rialvalue.com ■ www.duvos.com ■ http://www.evtimmy.com/ ■ www.adobe.com/devnet/flex/articles/spark_layouts.html ■ www.oreilly.com/flex/excerpts/flex-4-cookbook/layout.html ■ http://www.ryancampbell.com/ ■ http://www.flexstuff.co.uk/ 45 Thursday, 4 November 2010
  63. 63. ©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Summary ■ More Links: ■ http://opensource.adobe.com/wiki/display/flexsdk/Spark+Virtualization ■ Item Renderers: http://help.adobe.com/en_US/flex/using/ WS03d33b8076db57b9-23c04461124bbeca597-8000.html#WS5ED0A932- BA59-4a77-9A9D-3745FE21D1E9 46 Thursday, 4 November 2010
  64. 64. Q&A Thursday, 4 November 2010
  65. 65. ©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Thanks ■ Thanks to Evtim Georgiev Flex SDK Engineer for reviewing the presentation 48 Thursday, 4 November 2010
  66. 66. ©2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Thursday, 4 November 2010
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×