The following example shows how you can expand/collapse branches in a Flex Tree control by clicking on the row instead of having to click on the disclosure/arrow icon.
Full code after the jump.
Continue reading ‘Opening branches by clicking rows in a Tree control in Flex’
The following example shows how you can create a simple image gallery in Flex using a Tree control and a SWFLoader control.
Full code after the jump.
Continue reading ‘Creating a simple image gallery with the Flex Tree control’
The following example shows how you can use a Tree control as a PopUpButton control’s pop up in Flex.
Full code after the jump.
Continue reading ‘Displaying a Tree control as a pop up for a Flex PopUpButton control’
In a previous example, “Removing folder icons from the Flex Tree control”, we saw how to remove the folder icons from a Tree control in Flex so only the disclosure (arrow) icons were visible. In the following example we look at a similar technique for removing the default leaf icons from the Tree control in Flex.
The short answer, set the defaultLeafIcon style to null using CSS, as shown in the following snippet:
<mx:Style>
Tree {
defaultLeafIcon: ClassReference(null);
}
</mx:Style>
The long answer? Keep reading!
Full code after the jump.
Continue reading ‘Removing leaf icons from the Flex Tree control’
The following example shows how you can remove the folder icons from the Tree control in Flex so that only the disclosure (arrow) icons and leaf icons are visible.
The short answer, set the folderClosedIcon and folderOpenIcon styles to null using CSS, as shown in the following snippet:
<mx:Style>
Tree {
folderClosedIcon: ClassReference(null);
folderOpenIcon: ClassReference(null);
}
</mx:Style>
The long answer?
Full code after the jump.
Continue reading ‘Removing folder icons from the Flex Tree control’
In a previous example, “Preventing branches from being selected in a Flex Tree control”, we saw how we could prevent users from selecting branches (folders) in a Tree container in Flex by using the itemClick event and the Tree class’s dataDescriptor.isBranch() method.
The following example shows you how you can prevent any item from being selected by adding an attribute (named “clickable”, but you could name it anything you wanted) and using E4X expressions to determine if the currently clicked item should be selectable or not.
Full code after the jump.
Continue reading ‘Preventing specific items from being selected in a Flex Tree control’
The following example shows you how you can prevent users from selecting the branch (folder) items in a Tree control in Flex by listening for the itemClick event and using the Tree class’s dataDescriptor.isBranch() method to determine whether the currently selected item is a branch, and if so, deselect the item.
Full code after the jump.
Continue reading ‘Preventing branches from being selected in a Flex Tree control’
The following example shows how you can open nodes in a Tree control in Flex by setting the openItems property to an XMLList or Array object.
Full code after the jump.
Continue reading ‘Expanding nodes in a Flex Tree control using the openItems property’
The following example shows how you can toggle item roll over highlighting in the Tree control in Flex by setting the useRollOver style.
Full code after the jump.
Continue reading ‘Toggling item roll over highlighting in the Flex Tree control’
The following example shows how you can display the number of children in each branch of a Tree control in Flex by using the dataDescriptor property, labelFunction property, hasChildren() method and getChildren() method.
Full code after the jump.
Continue reading ‘Displaying the number of children in each branch of a Flex Tree control’
The following code shows you how you can use an Array as a data provider for a Tree control in Flex.
Full code after the jump.
Continue reading ‘Using an Array as a data provider in a Flex Tree control’
The following example shows you how you can expand and contract individual Tree nodes, or nodes and all child-nodes recursively using the expandItem() and expandChildrenOf() methods in Flex.
Full code after the jump
The following examples show how you can use the firstVisibleItem property to get or set the first visible node in a Flex Tree control.
Full code after the jump.
Continue reading ‘Determining the first visible item in a Flex Tree control’
The following example shows how you can use the openItems property to determine which branches are currently open in a Flex Tree control.
Full code after the jump.
Continue reading ‘Determining which Tree branches are open using the openItems property’
The following example shows how you can use the isBranch() method to determine if a specific node in a Tree control is a branch (folder) or leaf (item).
Full code after the jump.
Continue reading ‘Using the isBranch() method to determine if a Tree item is a branch or leaf’
