I have the follow code – as TreeItemRenderer
<?xml version="1.0" encoding="utf-8"?>
<mx:TreeItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx"
xmlns:solar="*">
<fx:Script>
<![CDATA[
import mx.containers.Canvas;
import mx.containers.VBox;
import mx.controls.Alert;
import mx.controls.Button;
import mx.controls.CheckBox;
import mx.controls.Tree;
import mx.controls.listClasses.BaseListData;
import mx.controls.treeClasses.TreeListData;
import mx.core.mx_internal;
use namespace mx_internal;
protected var buttonBox : VBox;
override protected function createChildren() : void
{
super.createChildren();
setStyle( "verticalAlign", "top" );
this.addEventListener( MouseEvent.CLICK, mouseHandler );
}
protected function mouseHandler( event : MouseEvent ) : void
{
if( data.@buttonsVisible == "true" )
data.@buttonsVisible = "false"
else
data.@buttonsVisible = "true";
showButtons();
}
private function showButtons() : void
{
if( true )
{
if( buttonBox == null )
{
buttonBox = new VBox();
buttonBox.setStyle( "verticalGap", 0 );
addChild( buttonBox );
var b1 : Button = new Button();
b1.percentWidth = 100;
b1.label = "block";
buttonBox.addChild( b1 );
var b2 : Button = new Button();
b2.percentWidth = 100;
b2.label = "block1";
buttonBox.addChild( b2 );
var b3 : Button = new Button();
b3.percentWidth = 100;
b3.label = "block";
buttonBox.addChild( b3 );
}
}
else
if( buttonBox != null )
{
removeChild( buttonBox );
buttonBox = null;
}
invalidateSize();
invalidateDisplayList();
}
override public function set listData( value : BaseListData ) : void
{
super.listData = value;
if( listData )
{
showButtons();
}
}
override protected function measure() : void
{
super.measure();
if( buttonBox != null )
{
//buttonBox.visible = buttonBox.includeInLayout =( !isOpening && isOpen ) ;
var b : Boolean = false;
if( data.@buttonsVisible != null )
b = data.@buttonsVisible == "true";
buttonBox.visible = buttonBox.includeInLayout = b;
if( buttonBox.visible )
{
buttonBox.y = measuredHeight;
measuredHeight += buttonBox.measuredHeight;
}
}
}
override protected function updateDisplayList( unscaledWidth : Number, unscaledHeight : Number ) : void
{
super.updateDisplayList( unscaledWidth, unscaledHeight );
if( buttonBox != null )
{
buttonBox.x = 40;
buttonBox.setActualSize( unscaledWidth - buttonBox.x, unscaledHeight );
}
}
]]>
</fx:Script>
</mx:TreeItemRenderer>
The application code is as follow :
<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600">
<fx:Declarations>
<!-- Place non-visual elements (e.g., services, value objects) here -->
</fx:Declarations>
<mx:Tree x="289" y="0" width="377" height="599" labelField="@label" itemRenderer="iRR" variableRowHeight="true">
<mx:dataProvider>
<fx:XMLList xmlns="">
<folder state="unchecked" label="Marketing Collateral" isBranch="true" >
<folder state="unchecked" isBranch="true" label="Media, PR, and Communications" >
<folder state="unchecked" isBranch="false" label="Article Reprint Disclaimers" />
<folder state="unchecked" isBranch="false" label="Articles Reprints" />
<folder state="unchecked" isBranch="false" label="Interviews and Transcripts" />
<folder state="unchecked" isBranch="false" label="Press Kits" />
<folder state="unchecked" isBranch="false" label="Press Releases" />
<folder state="unchecked" isBranch="false" label="Quick Hits" />
<folder state="unchecked" isBranch="false" label="Rep Talking Points" />
<folder state="unchecked" isBranch="false" label="Special Updates" />
<folder state="unchecked" isBranch="false" label="White Papers" />
<folder state="unchecked" isBranch="false" label="Article Reprint Disclaimers" />
<folder state="unchecked" isBranch="false" label="Articles Reprints" />
<folder state="unchecked" isBranch="false" label="Interviews and Transcripts" />
<folder state="unchecked" isBranch="false" label="Press Kits" />
<folder state="unchecked" isBranch="false" label="Press Releases" />
<folder state="unchecked" isBranch="false" label="Quick Hits" />
<folder state="unchecked" isBranch="false" label="Rep Talking Points" />
<folder state="unchecked" isBranch="false" label="Special Updates" />
<folder state="unchecked" isBranch="false" label="White Papers" />
<folder state="unchecked" isBranch="false" label="Article Reprint Disclaimers" />
<folder state="unchecked" isBranch="false" label="Articles Reprints" />
<folder state="unchecked" isBranch="false" label="Interviews and Transcripts" />
<folder state="unchecked" isBranch="false" label="Press Kits" />
<folder state="unchecked" isBranch="false" label="Press Releases" />
<folder state="unchecked" isBranch="false" label="Quick Hits" />
<folder state="unchecked" isBranch="false" label="Rep Talking Points" />
<folder state="unchecked" isBranch="false" label="Special Updates" />
<folder state="unchecked" isBranch="false" label="White Papers" />
<folder state="unchecked" isBranch="false" label="Article Reprint Disclaimers" />
<folder state="unchecked" isBranch="false" label="Articles Reprints" />
<folder state="unchecked" isBranch="false" label="Interviews and Transcripts" />
<folder state="unchecked" isBranch="false" label="Press Kits" />
<folder state="unchecked" isBranch="false" label="Press Releases" />
<folder state="unchecked" isBranch="false" label="Quick Hits" />
<folder state="unchecked" isBranch="false" label="Rep Talking Points" />
<folder state="unchecked" isBranch="false" label="Special Updates" />
<folder state="unchecked" isBranch="false" label="White Papers" />
</folder>
<folder state="unchecked" isBranch="true" label="Forms and Applications" >
<folder state="unchecked" isBranch="false" label="Applications" />
<folder state="unchecked" isBranch="false" label="Forms" />
</folder>
<folder state="unchecked" isBranch="true" label="Forms and Applications" >
<folder state="unchecked" isBranch="false" label="Applications" />
<folder state="unchecked" isBranch="false" label="Forms" />
</folder>
<folder state="unchecked" isBranch="true" label="Forms and Applications" >
<folder state="unchecked" isBranch="false" label="Applications" />
<folder state="unchecked" isBranch="false" label="Forms" />
<folder state="unchecked" isBranch="false" label="Applications" />
<folder state="unchecked" isBranch="false" label="Forms" />
<folder state="unchecked" isBranch="false" label="Applications" />
<folder state="unchecked" isBranch="false" label="Forms" />
<folder state="unchecked" isBranch="false" label="Applications" />
<folder state="unchecked" isBranch="false" label="Forms" />
<folder state="unchecked" isBranch="false" label="Applications" />
<folder state="unchecked" isBranch="false" label="Forms" />
<folder state="unchecked" isBranch="false" label="Applications" />
<folder state="unchecked" isBranch="false" label="Forms" />
<folder state="unchecked" isBranch="false" label="Applications" />
<folder state="unchecked" isBranch="false" label="Forms" />
<folder state="unchecked" isBranch="false" label="Applications" />
<folder state="unchecked" isBranch="false" label="Forms" />
<folder state="unchecked" isBranch="false" label="Applications" />
<folder state="unchecked" isBranch="false" label="Forms" />
<folder state="unchecked" isBranch="false" label="Applications" />
<folder state="unchecked" isBranch="false" label="Forms" />
</folder>
</folder>
</fx:XMLList>
</mx:dataProvider>
</mx:Tree>
</s:Application>
- The code basically works for a bit but after a few items been opened – it fail, and scrolling becaming buggy.
Please help.
Try Spark Tree, it’s based on Spark List and is free of all the MX Tree bugs.