Your SlideShare is downloading. ×
Hello Gumbo
Hello Gumbo
Hello Gumbo
Hello Gumbo
Hello Gumbo
Hello Gumbo
Hello Gumbo
Hello Gumbo
Hello Gumbo
Hello Gumbo
Hello Gumbo
Hello Gumbo
Hello Gumbo
Hello Gumbo
Hello Gumbo
Hello Gumbo
Hello Gumbo
Hello Gumbo
Hello Gumbo
Hello Gumbo
Hello Gumbo
Hello Gumbo
Hello Gumbo
Hello Gumbo
Hello Gumbo
Hello Gumbo
Hello Gumbo
Hello Gumbo
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

Hello Gumbo

688

Published on

Presentation on gumbo

Presentation on gumbo

Published in: Technology
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
688
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
0
Comments
0
Likes
1
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. Hello Gumbo Xavi Beumala xbeumala@adobe.com http://www.rialvalue.com ® Copyright 2008 Adobe Systems Incorporated. All rights reserved.
  • 2. Agenda  What’s Flex 4 about ?  What is it not about ?  Skinning examples  How to migrate a Flex 3 project to Flex 4 ® Copyright 2008 Adobe Systems Incorporated. All rights reserved.
  • 3. Gumbo  Design in Mind  Developer Productivity  Framework Evolution ® Copyright 2008 Adobe Systems Incorporated. All rights reserved.
  • 4. Design in Mind  Adjust the MXML language to support more toolability and make it easier to describe experience-oriented features such as states and transitions (MXML 2009)  Create a format that promotes the features available in the Flash Player and is usable by tools to describe various graphic assets, including skins (FXG)  Provide a component and skinning architecture that invites easy tool participation (code name Gumbo)  Improve existing experience-oriented features such as states, effects, and layout ® Copyright 2008 Adobe Systems Incorporated. All rights reserved.
  • 5. Design in Mind Approach  Integrate new functionality (Gumbo) into existing component model (Halo)  Create new design-friendly components  Size of resulting applications within same order of magnitude as Flex 3  Low-hanging size and performance improvements  Wrap new FlashPlayer features like TextPrimitives or 3D ® Copyright 2008 Adobe Systems Incorporated. All rights reserved.
  • 6. Developer Productivity  Compiler Performance  2-way binding  CSS Improvements  New state syntax  Tool maturity  Refactors  Inline help ® Copyright 2008 Adobe Systems Incorporated. All rights reserved.
  • 7. Gumbo walkthrough ® 7 Copyright 2008 Adobe Systems Incorporated. All rights reserved.
  • 8. Hello Gumbo!!!!!!  Tag s:Application  New namespaces ® Copyright 2008 Adobe Systems Incorporated. All rights reserved.
  • 9. namespaces hell or heaven? ® 9 Copyright 2008 Adobe Systems Incorporated. All rights reserved.
  • 10. Namespaces  Language namespace:  xmlns:fx=”http://ns.adobe.com/mxml/2009”  Spark namespace:  xmlns:s=”library://ns.adobe.com/flex/spark”  Halo namespace:  xmlns:mx=”library://ns.adobe.com/flex/halo” ® Copyright 2008 Adobe Systems Incorporated. All rights reserved.
  • 11. Mixing Halo and Spark ® Copyright 2008 Adobe Systems Incorporated. All rights reserved.
  • 12. Layout  Layouts now are external implementations  Composition vs Inheritance  They’re exchangeable  You can implement custom layouts extending LayoutBase ® Copyright 2008 Adobe Systems Incorporated. All rights reserved.
  • 13. Where are my scrolls?!?! ® 13 Copyright 2008 Adobe Systems Incorporated. All rights reserved.
  • 14. Where are my scrolls ?!?!  Container skins don’t have scrolls by default anymore  Flex 4 architecture is set up to provide developers with building blocks to pick and choose what functionality they need  We have to add them ® Copyright 2008 Adobe Systems Incorporated. All rights reserved.
  • 15. FXG  Graphics interchange format based in XML  Enables and encourages toolability  Key feature to define skins  http://opensource.adobe.com/wiki/display/flexsdk/FXG+1.0+Specification ® Copyright 2008 Adobe Systems Incorporated. All rights reserved.
  • 16. Skinning a Button ® 16 Copyright 2008 Adobe Systems Incorporated. All rights reserved.
  • 17. Skinning && Styling I  In Flex 3 we couldn’t do basic things like:  Transitions between states  Play effects and transition  Add more than one icon / image to a button  Each state had to be pretty much the same  Basic things in Flash were completely impossible to accomplish up over ® Copyright 2008 Adobe Systems Incorporated. All rights reserved.
  • 18. More sophisticated skins ® 18 Copyright 2008 Adobe Systems Incorporated. All rights reserved.
  • 19. Skinning && Styling II  Let’s try to skin a more sophisticated component: a List  Data Model  Now the List Component itseltf ® Copyright 2008 Adobe Systems Incorporated. All rights reserved.
  • 20. Skinning && Styling III  This was a boring a list!!  Let’s add some skinning Skinning ® Copyright 2008 Adobe Systems Incorporated. All rights reserved.
  • 21. Skinning && Styling VII  This was a boring list. Let’s add some art to it  With states ® Copyright 2008 Adobe Systems Incorporated. All rights reserved.
  • 22. Migration guide ® Copyright 2008 Adobe Systems Incorporated. All rights reserved.
  • 23. Migration I  CSS. Type selectors require a namespace  Theme. Default Halo theme has changed to visually match default Spark theme  Preloader  Namespaces  Declarations tag  Changes in states syntax  Embed fonts on both namespaces if needed  -compatibility-version=3.0.0. ® Copyright 2008 Adobe Systems Incorporated. All rights reserved.
  • 24. What gumbo is NOT ® 24 Copyright 2008 Adobe Systems Incorporated. All rights reserved.
  • 25. Mind the gap  Gumbo is not going to be a lighter framework  There’s no a 1:1 relationship between Halo and Spark components  Spark accessibility  Spark automation  Complexity and needed effort to migrating to Flex4 will depend on the practices followed in your application ® Copyright 2008 Adobe Systems Incorporated. All rights reserved.
  • 26. Questions and maybe Answers ® 26 Copyright 2008 Adobe Systems Incorporated. All rights reserved.
  • 27. Links ® 27 Copyright 2008 Adobe Systems Incorporated. All rights reserved.
  • 28. Further information  hquot;p://www.adobe.com/devnet/flex/ar5cles/flex4sdk_whatsnew.html  hquot;p://opensource.adobe.com/wiki/display/flexsdk/Gumbo+Component+Architecture  hquot;p://www.adobe.com/devnet/flex/ar5cles/flex3and4_differences_01.html  hquot;p://labs.adobe.com/wiki/index.php/Flex_4:Backward_Compa5bility  hquot;p://opensource.adobe.com/wiki/display/flexsdk/Spark+Basic+Layout  hquot;p://opensource.adobe.com/wiki/display/flexsdk/Spark+Horizontal+and+Ver5cal+Layout  hquot;p://opensource.adobe.com/wiki/display/flexsdk/CSS+Advanced+Selectors  hquot;p://opensource.adobe.com/wiki/display/flexsdk/Gumbo+Skinning  hquot;p://www.adobe.com/devnet/flex/tourdeflex/  hquot;p://mi5.pricope.com/2009/05/29/playing‐with‐custom‐layout‐in‐flex‐4/ ® Copyright 2008 Adobe Systems Incorporated. All rights reserved.

×