• Share
  • Email
  • Embed
  • Like
  • Save
  • Private Content
Custom Components In Flex 4
 

Custom Components In Flex 4

on

  • 17,136 views

Adobe Devsummit Presentation on Custom Components in Flex 4 by Mrinal Wadhwa

Adobe Devsummit Presentation on Custom Components in Flex 4 by Mrinal Wadhwa

Statistics

Views

Total Views
17,136
Views on SlideShare
10,336
Embed Views
6,800

Actions

Likes
25
Downloads
493
Comments
3

20 Embeds 6,800

http://weblog.mrinalwadhwa.com 5120
http://vapes.na.by 1532
http://www.slideshare.net 67
http://feeds.feedburner.com 17
http://translate.googleusercontent.com 11
http://www.vapes.na.by 11
http://paper.li 9
http://www.linkedin.com 8
https://www-wave-opensocial.googleusercontent.com 8
http://webcache.googleusercontent.com 4
http://gatecrasher14.knotyapi.com 2
http://reader.googleusercontent.com 2
http://static.slidesharecdn.com 2
https://1166842352-wave-opensocial.googleusercontent.com 1
http://hghltd.yandex.net 1
https://21283913-wave-opensocial.googleusercontent.com 1
http://us-w1.rockmelt.com 1
http://alef.fiit.stuba.sk 1
http://74.125.93.132 1
http://twittertim.es 1
More...

Accessibility

Categories

Upload Details

Uploaded via as Adobe PDF

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel

13 of 3 previous next Post a comment

  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
  • Excellent work. learned alot. Thankyou
    Are you sure you want to
    Your message goes here
    Processing…
  • Hi PG,

    Thanks, glad you like the presentation.
    There are no speaker notes but you may want to check out various posts I have written on the subject http://weblog.mrinalwadhwa.com/tag/components/
    _
    Mrinal
    Are you sure you want to
    Your message goes here
    Processing…
  • Mrinal,

    Excellent presentation! The slides are simple, professional and elegant. I congratulate you. Keep up such good work.

    I would like to get the speaker's notes if available, which will help me study further. You could also provide some references for further reading.

    Regards,
    PG Bhat
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

    Custom Components In Flex 4 Custom Components In Flex 4 Presentation Transcript

    • Custom Components in Flex 4 Mrinal Wadhwa http://www.mrinalwadhwa.com
    • What is a component ?
    • Composition
    • a squad ...
    • Squad.mxml
    • a legion ...
    • Legion.mxml
    • the architecture ...
    • in flex ...
    • Halo the architecture of components in Flex 3 and before
    • Spark the architecture of components in Flex 4
    • all components inherit from ... mx.core.UIComponent
    • in Spark its more common to use ... spark.components.supportClasses.SkinnableComponent
    • the lifecycle of a component ...
    • BIRTH
    • BIRTH LIFE
    • BIRTH LIFE DEATH
    • Why does a component need a life cycle?
    • Flex applications run in the Flash Player
    • What Flex can do is a subset of what the Flash Player can do, not a superset.
    • so to understand flex components better, lets take a deeper look at how the flash player works ...
    • Frames
    • Frames everything is done in frames ...
    • Frame Rate the number of frames processed per second (fps)
    • Frame Rate you can suggest the player a frame rate you would like your swf to have ...
    • Frame Rate [SWF(width=”800”,height=”600”,frameRate=”60”)] OR stage.frameRate = 60; OR <s:Application frameRate=”60” ... >
    • Frame Rate the player tries its best to maintain the suggested frame rate, but there are no guarantees ...
    • Frame Rate the actual framerate achieved may be lower or higher than what we suggested ...
    • Frame Rate browsers can force a lower framerate on the flash player ...
    • Frame Rate In Firefox and Safari, frame rate falls to about 10 if the Tab running the swf is out of focus ...
    • Frame Rate In Safari if window is minimized, framerate falls to zero ..
    • now lets take a deeper look at what happens inside each frame ..
    • code execution rendering 1 frame the length of the track represents the time taken by this frame
    • code execution rendering heavy code execution 1 frame 1 frame the length of the track represents the time taken by this frame
    • code execution rendering heavy code execution heavy rendering 1 frame 1 frame 1 frame the length of the track represents the time taken by this frame
    • Ted Patrick called this ... code execution rendering heavy code execution heavy rendering 1 frame 1 frame 1 frame the length of the track represents the time taken by this frame
    • The Elastic Racetrack code execution rendering heavy code execution heavy rendering 1 frame 1 frame 1 frame the length of the track represents the time taken by this frame
    • Sean Christmann did some more research on this ...
    • The Marshal He proposed AVM2 is controlled by something he called the Marshal ..
    • The Marshal the marshal is responsible for carving out time slices ...
    • The Marshal the duration of a slice can vary based on your OS,browser etc. just for our discussion lets assume a slice is 20ms long ..
    • A Marshaled Slice
    • A Marshaled Slice but all these actions may not happen on each slice ...
    • A Marshaled Slice Flash Player’s Event.RENDER event is fired at this point
    • A Marshaled Slice invalidate action and render action only happen in the last slice of a frame ..
    • with 20ms slices ...
    • with 20ms slices ... code execution
    • with 20ms slices ... render
    • with 20ms slices ...
    • with 20ms slices ... code execution
    • with 20ms slices ... render
    • with 20ms slices ...
    • Code can be executed more often than the times stuff is rendered on the screen ...
    • ... this is the main reason a component needs a lifecycle performance
    • BIRTH LIFE DEATH
    • Construction Addition BIRTH Initialization LIFE DEATH
    • Construction Addition BIRTH Initialization Invalidation LIFE Validation Update DEATH
    • Construction Addition BIRTH Initialization Invalidation LIFE Validation Update Removal DEATH
    • StormTrooper.as
    • StormTrooperSkin.mxml
    • Constructor
    • Constructor
    • Construction Addition BIRTH Initialization Invalidation LIFE Validation Update Removal DEATH
    • Construction Addition BIRTH Initialization Invalidation LIFE Validation Update Removal DEATH
    • Invalidation invalidateProperties invalidateSize invalidateDisplayList Event.RENDER LIFE Validation commitProperties measure layoutChrome(optional) updateDisplayList Update
    • the lifecycle methods ...
    • Invalidation/Validation cycle (Life) invalidateProperties commitProperties invalidateSize measure invalidateDisplayList updateDisplayList
    • defining states ...
    • defining skin parts ...
    • static ... when the number of instances needed is known and small
    • dynamic ...
    • required ...
    • optional ...
    • partAdded and partRemoved
    • defining properties ...
    • Bindable properties
    • throwing events ...
    • .......
    • defining styles ...
    • ?
    • Mrinal Wadhwa http://www.mrinalwadhwa.com http://twitter.com/mrinal