Package | km.components |
Class | public class Tree |
Inheritance | Tree ![]() ![]() |
import km.components.*; import km.skins.*; var treeData:XML = <data> <account name='Mail account 1' id='1'> <folder label='Inbox'/> <folder label='Personal Folder' id='1.1'> <folder label='KoolMoves' /> <folder label='KoolExchange' /> <folder label='AS3 related' /> </folder> <folder label='Sent Items' /> <folder label='Trash' /> </account> <account name='Mail account 2' id='2'> <folder label='Inbox'/> <folder label='Personal Folder' id='2.1'> <folder label='Saved Mail' /> </folder> <folder label='Sent Items' /> <folder label='Trash' /> </account> </data>; function treeLabel(item:Object):String { // item._name contains the node name // item._parent contains a reference to the parent if there is one // item._subnodes contains an array of sub nodes if there are var result:String = item._name == 'account' ? '<b>' + item.name + '</b>' : item.label; if (item._parent && item._parent.id == '1.1') result = '<font color="#ff0000">' + result + '</font>'; return result; } var tree:Tree = new Tree(); ScriptedSkin.applyTo(tree); tree.htmlLabels = true; tree.setSize(320, 280); tree.move(10,10); addChild(tree); tree.setDataXML(treeData, false, 0, treeLabel); tree.expand('id', '1', true); tree.selectedItem = tree.search('id', '1.1')[0];
Property | Defined by | ||
---|---|---|---|
altColorTransform : ColorTransform Gets or sets a color transform for odd numbered rows.
| Tree | ||
background : Image
[read-only] >> Reference to the background image.
| Tree | ||
![]() | duotone : Array The duotone property can be used to convert the colors of the component into duotone.
| UIComponent | |
![]() | enabled : Boolean Specifies if the component is enabled.
If a component is disabled, it will be turned into grayscale and become partly transparent. | UIComponent | |
![]() | height : Number | UIComponent | |
htmlLabels : Boolean Gets or sets a Boolean value indicating if item labels should be displayed as html text or plain text.
| Tree | ||
listItem : ListItem [read-only] >> Reference to the default tree item.
| Tree | ||
margin : int The margin between the bounding box of the background and the sub components inside.
| Tree | ||
onChange : Function onChange handler.
| Tree | ||
selectedItem : Object Gets or sets the selected item.
| Tree | ||
![]() | toolTip : String Text to use as toolTip when ToolTip is enabled.
| UIComponent | |
vScrollBar : ScrollBar
[read-only] >> Reference to the vertical scrollBar.
| Tree | ||
![]() | width : Number | UIComponent | |
![]() | x : Number | UIComponent | |
![]() | y : Number | UIComponent |
Method | Defined by | ||
---|---|---|---|
Tree()
| Tree | ||
![]() |
clone():*
Returns a clone of the component.
The skin of the component is cloned but other things like the text of a label or the items of a list aren't. | UIComponent | |
collapse(field:String = null, value:Boolean = null, collapseChildren:* = false):void
Collapses items where the specified field matches the specified value.
If no parameters are specified, all items are collapsed. | Tree | ||
expand(field:String = null, value:Boolean = null, expandChildren:* = false):void
Expands items where the specified field matches the specified value.
If no parameters are specified, all items are expanded. | Tree | ||
![]() |
move(x:int, y:int, animationMode:int = 0, animationFrames:int = 12, easeInOut:Boolean = false):void
Moves the component to the specified coordinates.
| UIComponent | |
search(field:String, value:*):Array
Returns an array of items that are found.
| Tree | ||
setDataXML(data:*, showRoot:Boolean = false, sort:int = 0, labelFunction:Function = null):void
Set the tree data.
Attributes starting with an underscore are reserved and should not be used in the XML data. There are two exceptions to this. | Tree | ||
setIcons(icons:BitmapData = null, item:Object = null):void
Sets the tree icons.
If you specify an item, the icons will override the global ones. The image has to contain the 'folder closed', 'folder open', 'folder empty' and 'item' icons below eachother in one single file. | Tree | ||
![]() |
setProperties(o:Object):void
Sets a number of properties at once.
| UIComponent | |
![]() |
setSize(w:int, h:int):void
Sets the size width and height.
| UIComponent |
Event | Summary | Defined by | ||
---|---|---|---|---|
![]() | The animationComplete event is broadcasted when an animated move is completed. | UIComponent | ||
The change event is broadcasted when a different item is selected. It's also possible to use the onChange handler. | Tree | |||
The noChange event is broadcasted when an already selected item is clicked again. | Tree | |||
The setDataComplete event is broadcasted when the setDataXML function has completed. | Tree | |||
The setDataError event is broadcasted when the setDataXML function has failed. | Tree |
altColorTransform | property |
altColorTransform:ColorTransform
[read-write]Gets or sets a color transform for odd numbered rows.
Implementation public function get altColorTransform():ColorTransform
public function set altColorTransform(value:ColorTransform):void
background | property |
background:Image
[read-only]>> Reference to the background image.
Implementation public function get background():Image
htmlLabels | property |
htmlLabels:Boolean
[read-write]Gets or sets a Boolean value indicating if item labels should be displayed as html text or plain text.
Implementation public function get htmlLabels():Boolean
public function set htmlLabels(value:Boolean):void
listItem | property |
listItem:ListItem
[read-only]>> Reference to the default tree item.
Implementation public function get listItem():ListItem
See also
margin | property |
margin:int
[read-write]The margin between the bounding box of the background and the sub components inside.
Implementation public function get margin():int
public function set margin(value:int):void
onChange | property |
public var onChange:Function
onChange handler.
selectedItem | property |
selectedItem:Object
[read-write]Gets or sets the selected item.
Implementation public function get selectedItem():Object
public function set selectedItem(value:Object):void
vScrollBar | property |
vScrollBar:ScrollBar
[read-only]>> Reference to the vertical scrollBar.
Implementation public function get vScrollBar():ScrollBar
Tree | () | constructor |
public function Tree()
collapse | () | method |
public function collapse(field:String = null, value:Boolean = null, collapseChildren:* = false):void
Collapses items where the specified field matches the specified value.
If no parameters are specified, all items are collapsed.
field:String (default = null )
|
|
value:Boolean (default = null )
|
|
collapseChildren:* (default = false )
|
expand | () | method |
public function expand(field:String = null, value:Boolean = null, expandChildren:* = false):void
Expands items where the specified field matches the specified value.
If no parameters are specified, all items are expanded.
field:String (default = null )
|
|
value:Boolean (default = null )
|
|
expandChildren:* (default = false )
|
search | () | method |
public function search(field:String, value:*):Array
Returns an array of items that are found.
Parametersfield:String |
|
value:* |
Array |
setDataXML | () | method |
public function setDataXML(data:*, showRoot:Boolean = false, sort:int = 0, labelFunction:Function = null):void
Set the tree data.
Attributes starting with an underscore are reserved and should not be used in the XML data.
There are two exceptions to this. If you want to inform the component that an item should be
displayed as an empy folder, you can add _empty = "true" and if you want to specify already that
a folder should be expanded by default, you can add _expanded = "true" .
data can be of the type XML or URLRequest.
sort can be 0 (no sort), 1 (ascending), 2 (descending).
labelFunction if provided should be a function that accepts one parameter for the item object and returns the label string.
data:* |
|
showRoot:Boolean (default = false )
|
|
sort:int (default = 0 )
|
|
labelFunction:Function (default = null )
|
var tree:Tree = new Tree(); ScriptedSkin.applyTo(tree); tree.setSize(320, 280); tree.move(10,10); addChild(tree); function treeLabel(item:Object):String { return item.name; } tree.setDataXML(new URLRequest('treeData.xml'), false, 0, treeLabel);
setIcons | () | method |
public function setIcons(icons:BitmapData = null, item:Object = null):void
Sets the tree icons.
If you specify an item, the icons will override the global ones.
The image has to contain the 'folder closed', 'folder open', 'folder empty' and 'item' icons below eachother in one single file.
icons:BitmapData (default = null )
|
|
item:Object (default = null )
|
change | event |
flash.events.Event
The change event is broadcasted when a different item is selected.
It's also possible to use the onChange handler.
noChange | event |
flash.events.Event
The noChange event is broadcasted when an already selected item is clicked again.
setDataComplete | event |
flash.events.Event
The setDataComplete event is broadcasted when the setDataXML function has completed.
setDataError | event |
flash.events.Event
The setDataError event is broadcasted when the setDataXML function has failed.