Your SlideShare is downloading. ×
Creating Custom Spark Components in Flex 4
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

Creating Custom Spark Components in Flex 4

17,600
views

Published on

Presentation from Dan Orlando on building scalable custom components using Spark architecture in Flex 4 at Flash Camp Phoenix on 1/29/10.

Presentation from Dan Orlando on building scalable custom components using Spark architecture in Flex 4 at Flash Camp Phoenix on 1/29/10.


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

No Downloads
Views
Total Views
17,600
On Slideshare
0
From Embeds
0
Number of Embeds
3
Actions
Shares
0
Downloads
220
Comments
0
Likes
6
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
  • Response A
  • Response A
  • Transcript

    • 1. Creating ScalableCustom Components in Flex 4 using Spark
      Dan Orlando
    • 2. Who is Dan Orlando?
      Universal Mind Consultant
      Adobe Community Professional
      Preacher of best practices with Flex
      Author (latest: Flex 4 in Action)
      Blog-banger (danorlando.com)
      Master DJ
      Entrepreneur
      Flex Jedi
    • 3. Flex 4 is coming!
    • 4. Welcome to Spark!
      Not a death sentence for Flex 3 apps
      Builds on Flex 3 component architecture (UIComponent)
      More Stable & Scalable
      Structurally and organizationally superior
      Design patterns
      Separation of concerns
      Code reusability (for real this time!)
    • 5. Will the real MVC please stand up?
      Tight Coupling + dependecies
      = “domino effect”
    • 6. design patterns
      micro-architectures
      best practices
      Controversy in the Community
    • 7. Anatomy of a Flex 4 Application
    • 8. Spark Component Anatomy
      "The general rule is any code that is used by multiple skins belongs in the component class, and any code that is specific to a particular skin implementation lives in the skin."
    • 9. Spark Architecture
    • 10. Ely’s Reveal (MAX ’09)
      Dan’s Reveal
      (Ely’s Reveal, simplified for Flex 4 in Action, ‘10)
    • 11. “Drop down and reveal”
    • 12. “Slide out and reveal”
    • 13. “Pop a wheelie and reveal”
    • 14. Reveal Structure
    • 15. COMPONENT
      Skin States and Skin Parts
    • 16. States and Parts
      States: defined in the component, controlled by the skin
      Parts: defined in the skin, controlled by the component
    • 17. SKIN
      Skin States
    • 18. SKIN
      Skin Parts
    • 19. Declaring the [HostComponent]
      This tells the skin what component to apply itself to.
    • 20. Hammer Time
      STOP
      STOP
      This is a composite component!
    • 21. Simple vs. Composite
      Composite: derived from composition; composed of more than one simple component
      Simple: Basic control or container; example: Canvas, Label, Button, ComboBox
    • 22. SKIN
      Simple Component Skinning
    • 23. Declaring the [HostComponent]
      Example: the “openButton” skin:
    • 24. APPLICATION
      Binding skins with CSS
    • 25. COMPONENT
      Properties
    • 26. COMPONENT
      Method Overrides
    • 27. SKIN
      Animation & Effects
    • 28. Summing it up…
      The component class must:
      Define the skin(s) that correspond to it
      Identify skin parts with the [SkinPart] metadata tag
      Identify view states that are supported by the component using the [SkinState] tag
      The skin class must:
      Use the [HostComponent] metadata tag to specify the corresponding component
      Declare view states and define their appearance
      Define display information of skin parts
    • 29. Custom Flex 4 Component Resources
      Ryan Stewart:http://blog.digitalbackcountry.com/2009/07/building-custom-components-in-flex-4-skinparts/
      Dan Orlando:http://danorlando.com/?p=379
      Pete DeHaan:http://blog.flexexamples.com/
      Chet Haase:http://graphics-geek.blogspot.com/
      Flex 4 in Action (ch. 17)Orlando, Ahmed, Bland, Hooks(coming soon)
    • 30. Flex 4 is not as scary as Ozzytrying to be scary after all, so have fun Flexing!!!

    ×