The collection of data displayed by the tree. Changing this property to a new value is considered a drastic change to the tree's data, so the horizontal and vertical scroll positions will be reset, and the tree's selection will be cleared.

The following example passes in a data provider and tells the item renderer how to interpret the data:

 
tree.dataProvider = new ArrayHierarchicalCollection(
[
    {
        text: "Node 1",
        children:
        [
            {
                text: "Node 1A",
                children:
                [
                    { text: "Node 1A-I" },
                    { text: "Node 1A-II" },
                ]
            },
            { text: "Node 1B" },
        ]
    },
    { text: "Node 2" },
    {
        text: "Node 3",
        children:
        [
            { text: "Node 3A" },
            { text: "Node 3B" },
            { text: "Node 3C" },
        ]
    }
]);

tree.itemRendererFactory = function():ITreeItemRenderer
{
    var itemRenderer:DefaultTreeItemRenderer = new DefaultTreeItemRenderer();
    itemRenderer.labelField = "text";
    return itemRenderer;
};

Warning: A tree's data provider cannot contain duplicate items. To display the same item in multiple item renderers, you must create separate objects with the same properties. This restriction exists because it significantly improves performance.

Warning: If the data provider contains display objects, concrete textures, or anything that needs to be disposed, those objects will not be automatically disposed when the list is disposed. Similar to how starling.display.Image cannot automatically dispose its texture because the texture may be used by other display objects, a list cannot dispose its data provider because the data provider may be used by other lists. See the dispose() function on IHierarchicalCollection to see how the data provider can be disposed properly.

The default value is null.

See also

When a tree requires multiple item renderer types, this function is used to determine which type of item renderer is required for a specific item (or index). Returns the ID of the item renderer type to use for the item, or null if the default itemRendererFactory should be used.

The function is expected to have one of the following signatures:

function(item:Object):String

function(item:Object, location:Vector.<int>):String

The following example provides a factoryIDFunction:

function regularItemFactory():ITreeItemRenderer
{
    return new DefaultTreeItemRenderer();
}
function firstItemFactory():ITreeItemRenderer
{
    return new CustomItemRenderer();
}
tree.setItemRendererFactoryWithID( "regular-item", regularItemFactory );
tree.setItemRendererFactoryWithID( "first-item", firstItemFactory );
tree.factoryIDFunction = function( item:Object, location:Vector.<int> ):String
{
    if(location.length == 1 && location[0] == 0)
    {
        return "first-item";
    }
    return "regular-item";
};

The default value is null.

See also

The default IStyleProvider for all Tree components.

The default value is null.

See also

Determines if an item in the tree may be selected.

The following example disables selection:

tree.isSelectable = false;

The default value is true.

See also

A function called that is expected to return a new item renderer. Has a higher priority than itemRendererType. Typically, you would use an itemRendererFactory instead of an itemRendererType if you wanted to initialize some properties on each separate item renderer, such as skins.

The function is expected to have the following signature:

function():ITreeItemRenderer

The following example provides a factory for the item renderer:

tree.itemRendererFactory = function():ITreeItemRenderer
{
    var renderer:CustomItemRendererClass = new CustomItemRendererClass();
    renderer.backgroundSkin = new Quad( 10, 10, 0xff0000 );
    return renderer;
};

The default value is null.

See also

The class used to instantiate item renderers. Must implement the ITreeItemRenderer interface.

To customize properties on the item renderer, use itemRendererFactory instead.

The following example changes the item renderer type:

tree.itemRendererType = CustomItemRendererClass;

The default value is feathers.controls.renderers.DefaultTreeItemRenderer.

See also

The currently selected item. Returns null if no item is selected.

The following example listens for when selection changes and requests the selected item:

function tree_changeHandler( event:Event ):void
{
    var tree:Tree = Tree( event.currentTarget );
    var item:Object = tree.selectedItem;
}
tree.addEventListener( Event.CHANGE, tree_changeHandler );

The default value is null.

The currently selected location. Returns an empty Vector.<int> if no item is selected.

The following example listens for when selection changes and requests the selected location:

function tree_changeHandler( event:Event ):void
{
    var tree:Tree = Tree( event.currentTarget );
    var location:Vector.<int> = tree.selectedLocation;
}
tree.addEventListener( Event.CHANGE, tree_changeHandler );

Alternatively, you may use the getSelectedLocation() method to get the selected location without creating a new Vector.<int> instance, to avoid garbage collection of temporary objects.

See also

Used to auto-size the tree when a virtualized layout is used. If the tree's width or height is unknown, the tree will try to automatically pick an ideal size. This item is used to create a sample item renderer to measure item renderers that are virtual and not visible in the viewport.

The following example provides a typical item:

tree.typicalItem = { text: "A typical item", thumbnail: texture };

The default value is null.

Constructor

Returns the item renderer factory associated with a specific ID. Returns null if no factory is associated with the ID.

Parameters

See also

Returns the currently selected location, or an empty Vector.<int>, if no item is currently selected.

The following example listens for when selection changes and requests the selected location:

function tree_changeHandler( event:Event ):void
{
    var tree:Tree = Tree( event.currentTarget );
    var result:Vector.<int> = new <int>[];
    var location:Vector.<int> = tree.getSelectedLocation(result);
}
tree.addEventListener( Event.CHANGE, tree_changeHandler );

Parameters

See also

Indicates if a branch from the data provider is open or closed.

Parameters

See also

Returns the current item renderer used to render a specific item. May return null if an item doesn't currently have an item renderer. Most trees use virtual layouts where only the visible items will have an item renderer, so the result will usually be null for most items in the data provider.

Parameters

See also

After the next validation, scrolls the list so that the specified item is visible. If animationDuration is greater than zero, the scroll will animate. The duration is in seconds.

In the following example, the list is scrolled to display the third item in the second branch:

tree.scrollToDisplayLocation( new <int>[1, 2] );

Parameters

Associates an item renderer factory with an ID to allow multiple types of item renderers may be displayed in the tree. A custom factoryIDFunction may be specified to return the ID of the factory to use for a specific item in the data provider.

Parameters

See also

Opens or closes a branch.

Parameters

See also

Dispatched when the selected item changes.

The properties of the event object have the following values:

See also

Dispatched when a branch is closed.

The properties of the event object have the following values:

See also

Dispatched when a branch is opened.

The properties of the event object have the following values:

See also

Dispatched when an item renderer is added to the tree. When the layout is virtualized, item renderers may not exist for every item in the data provider. This event can be used to track which items currently have renderers.

The properties of the event object have the following values:

Dispatched when an item renderer is removed from the tree. When the layout is virtualized, item renderers may not exist for every item in the data provider. This event can be used to track which items currently have renderers.

The properties of the event object have the following values:

Dispatched when the the user taps or clicks an item renderer in the tree. The touch must remain within the bounds of the item renderer on release, and the tree must not have scrolled, to register as a tap or a click.

The properties of the event object have the following values:

The layout algorithm used to position and, optionally, size the tree's items.

By default, if no layout is provided by the time that the tree initializes, a vertical layout with options targeted at touch screens is created.

The following example tells the tree to use a horizontal layout:

var layout:HorizontalLayout = new HorizontalLayout();
layout.gap = 20;
layout.padding = 20;
tree.layout = layout;

The duration, in seconds, of the animation when the selected item is changed by keyboard navigation and the item scrolls into view.

In the following example, the duration of the animation that scrolls the tree to a new selected item is set to 500 milliseconds:

tree.keyScrollDuration = 0.5;

The default value is 0.25.

A style name to add to all item renderers in this tree. Typically used by a theme to provide different styles to different trees.

The following example sets the item renderer style name:

tree.customItemRendererStyleName = "my-custom-item-renderer";

In your theme, you can target this sub-component style name to provide different skins than the default:

getStyleProviderForClass( DefaultTreeItemRenderer ).setFunctionForStyleName( "my-custom-item-renderer", setCustomItemRendererStyles );

The default value is null.

See also