Presentation Transcript
Flex Component Development: Flex Component Development
Basic Lifecycle: Basic Lifecycle Constructor
parent.addChild()
createChildren()
Invalidation and Validation
commitProperties()
measure()
updateDisplayList()
parent.removeChild()
Garbage Collection
Constructor: Constructor Add event listeners.
Override properties.
Nothing else.
createChildren(): createChildren() Called only once.
Instantiate children that never change.
May override children from superclasses.
createChildren() Example: createChildren() Example override protected function createChildren():void
{
if(!this.subComponent)
{
this.subComponent = new MyCustomComponent();
this.addChild(this.subComponent);
}
super.createChildren();
if(!this.textField)
{
this.textField = new TextField();
this.addChild(this.textField);
}
}
Invalidation and Validation: Invalidation and Validation Properties
invalidateProperties()
commitProperties()
Dimensions
invalidateSize()
measure()
Display
invalidateDisplayList()
updateDisplayList()
Invalidation Example: Invalidation Example private var _someParam:Number = 0;
private var _someParamChanged:Boolean = false;
public function get someParam():Number
{
return this._someParam;
}
public function set someParam(value:Number):void
{
this._someParam = value;
this._someParamChanged = true;
this.invalidateProperties();
}
Validation Example: Validation Example override protected function commitProperties():void
{
super.commitProperties();
if(this._someParamChanged)
{
// do something
this._someParamChanged = false;
}
}
Component Measurement: Component Measurement measure()
measuredWidth
setActualSize()
getExplicitOrMeasuredWidth()
updateDisplayList()
unscaledWidth
Metadata: Metadata Events
[Event(name=“itemRollOver”, type=“com.yahoo.astra.fl.events.TabBarEvent”)]
Styles
[Style(name=“contentPadding”, type=“Number”)]
Please note: Both types are required for use in MXML.
Default Styles (Required CSS File): Default Styles (Required CSS File) customlist.css:
MyCustomList
{
paddingLeft: 10
paddingRight: 10;
paddingTop: 5;
paddingBottom: 5;
}
MyCustomListItemRenderer
{
backgroundColor: #ffffff;
}
Default Styles (Static Initializer): Default Styles (Static Initializer) private static function initializeStyles():void
{
var selector:CSSStyleDeclaration = StyleManager.getStyleDeclaration(“MyCustomList");
if(!selector)
{
selector = new CSSStyleDeclaration();
}
selector.defaultFactory = function():void
{
this.paddingLeft = 10;
}
StyleManager.setStyleDeclaration("TreeMap", selector, false);
}
initializeStyles(); //call immediately
Yahoo! Flash Platform: Yahoo! Flash Platform Yahoo! Flash Developer Network:
http://developer.yahoo.com/flash/
Mailing List:
http://tech.groups.yahoo.com/groups/ydn-flash/
Blog:
http://www.yswfblog.com/