"Create Unique User Experiences with Custom Flex Components" - Mark Anders

Mark Anders, one of Adobe's Senior Principal Scientists (Adobe knows how to come up with job titles), came on to carry on where Tink left off with the Flex seminar. I felt his main purpose was to challenge the preconception that Flex applications are aesthetically boring. He did this by creating a Flex app which looked like something from Apple (who are of course reknown for their strong design).

You definately got the impression that Flex was an amazing tool which hadn't penetrated enough into the community to produce real showcase sites. I think this will change very quickly in the next 6 months.

• The sample Mark used can be viewed here: http://www.quietlyscheming.com/blog/components/tutorial-displayshelf-component/


• Took through hierarchy of objects
  
  
  
  • DisplayObjects
    
    
    
    • Low level
    
    
    • Shapes - vector
    
    
    • Sprites - group of shapes
    
    
    • Bitmaps
    
    
    • Can't be used in containers
    
    
    • But can be used inside Flex components
    
    
  • UIComponent
    
    
    
    • Does core functionality - "Work horse of Flex"
    
    
    • Can only go inside other UIComponents
    
    
    • Can contain DisplayObjects
    
    
  • Containers
    
    
    
    • Does higher level logic to layout UIComponents (i.e. scrolling)
    
    
    • Canvas Container is not the best place to do drawing (badly named!!) - use it for layout
    
    
    • Containers can only contain UIComponents
    
    
    • UIComponents only inside UI
    
    
    • DisplayObjects only in UIComponents
    
    
    
    
• Flex's components rendering is managed by the LayoutManager
  
  
  
  • Redraw is called in function updateDisplayList()
  
  
  • To call a redraw, call invalidateDisplayList()
  
  
  • All drawing should be done in updateDisplayList()
  
  
  
  
• Flash and Flex have a different idea of size
  
  
  
  • Flex has several
    
    
    
    • Measured size (how big it wants to be)
    
    
    • Explicit size (it must be this size!)
    
    
    • Percentage size
    
    
    • Actual size
    
    
  • Lots of different methods around this
  
  
  • Flex sizing and measurement also managed by LayoutManager
  
  
  • invalidateSize() - informs the parent that the size has changed (so layout can update)
  
  
  
  
• DataProviders
  
  
  
  1. Arrays and XMLLists
     
     
     
     • Fast
     
     
     • No change event support
     
     
     • Best for quick and dirty manipulation of small lists
     
     
  2. IList
     
     
     
     • Support random index based choosing
     
     
     • Dispatches event notification on change
     
     
     • Good middle ground
     
     
  3. ICollection
     
     
     
     • Powerful but heavy
     
     
     • Missed most of what he said on this!
     
     
     
     
• ItemRenderer
  
  
  
  • This is the factory which can generate as many instances as we need
  
  
  • Mx.core.ifactory
  
  
  • invalidateProperties()
    
    
    
    • calls commitProperties()
    
    
    • another generic function to do stuff
    
    
    
    
• Has pre-defined animation primitives
  
  
  
  • Transitions between states
    
    
    
    • Move
    
    
    • Resize
    
    
    • Zoom
    
    
    • Rotation
    
    
  • Higher level animation
    
    
    
    • Parallel
    
    
    • Sequence
    
    
    
    
  • Animate property available for everything else
  
  
  
  
• Animation can also be scripted and MXML or AS


• HistoryManager - I saw this in his code but we didn't touch on it - what is it!!??