Here's a first cut at adding lines to the Flex tree.
The lines looks quite good and are well positioned in the tree. I am
happy with this. However, the problem that I am having is if a parent
folder is opened, closed and then reopened again, extra lines are
drawn in the child's folder. I don't know why this is happening.
Perhaps this is a bug in the Tree component or I am missing something.
If someone sees the solution, please enlighten me with your changes.
Below is the entire code.
Cheers,
Tim
----- Begin: test.mxml --------------------------
<?xml version="1.0"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" xmlns="*">
<mx:Script>
<![CDATA[
import mx.collections.*;
[Bindable]
public var xmlBalanced:XML =
<root label="main">
<node label="Containers">
<node label="DividedBoxClasses">
<node label="BoxDivider"
data=""> </node>
<node label="GridClasses">
<node label="GridRow" data=""> <node label="GridItem" data=""> <node label="Other File" data=""> </node>
</node>
<node label="Data">
<node label="Messages">
<node label="DataMessage"
data=""> <node label="SequenceMessage"
data=""> <node label="Data1">
<node label="Messages1">
<node label="DataMessage"
data=""> <node label="SequenceMessage"
data=""> </node>
<node label="Events">
<node label="ConflictEvents"
data=""> <node label="CommitFaultEvent"
data=""> </node>
</node>
</node>
<node label="Events">
<node label="ConflictEvents"
data=""> <node label="CommitFaultEvent"
data=""> </node>
</node>
</root>;
]]>
</mx:Script>
<mx:Tree id="compBalanced" dataProvider="{xmlBalanced}"
itemEditor="TreeEditor"
labelField="@label" width="400" height="500"
itemRenderer="MyTreeItemRenderer"/>
</mx:Application>
-------- End: test.xml --------------------------
-------- Begin: MyTreeItemRenderer.as -----------
package {
import mx.controls.treeClasses.*;
import mx.collections.*
import flash.display.Sprite;
public class MyTreeItemRenderer extends TreeItemRenderer {
private var isLast:Boolean;
private var lineArr:Array =new Array();
// Define the constructor.
public function MyTreeItemRenderer() {
super();
}
// Override the set method for the data property
// to set the font color and style of each node.
override public function set data(value:Object):void {
super.data = ""> if(TreeListData(super.listData).hasChildren) {
setStyle("color", 0xff0000);
setStyle("fontWeight", 'bold');
}
else {
setStyle("color", 0x000000);
setStyle("fontWeight", 'normal');
}
}
public function makeLastChildArr(node:Object,
requestedLevel:Number, startLevel:Number):Boolean {
trace("isLastChild = " + node.toXMLString() + "
requestedLevel = " + requestedLevel + " startLevel = " + startLevel);
var isLastFlag:Boolean = false;
var parentNode:XML = node.parent();
var grandParNode:XML = parentNode.parent();
var children:XMLList = grandParNode.children();
var noOfChildren:Number = children.length();
trace("parentNode = " + parentNode.toXMLString() + "
grandParNode = " + grandParNode.toXMLString() + " noOfChildren = " +
noOfChildren);
//trace("foundNode = " + children[noOfChildren -1] + ", Node = " +
node.toXMLString() );
if ( parentNode == children[noOfChildren -1]){
trace("foundNode = " + children[noOfChildren -1] + ", Node = " +
node.toXMLString );
isLastFlag = true;
}
lineArr.push(isLastFlag);
if (requestedLevel != startLevel){
makeLastChildArr(node.parent(), requestedLevel, startLevel - 1);
}
return isLastFlag;
}
// Override the updateDisplayList() method
// to set the text for each tree node.
override protected function
updateDisplayList(unscaledWidth:Number,unscaledHeight:Number):void {
super.updateDisplayList(unscaledWidth, unscaledHeight);
if(super.data) {
var node:Object = TreeListData(super.listData).item;
var depth:Number = TreeListData(super.listData).depth;
var indent:Number = TreeListData(super.listData).indent ;
lineArr =new Array();
if(TreeListData(super.listData).hasChildren) {
var tmp:XMLList = new
XMLList(TreeListData(super.listData).item);
var myStr:int = tmp[0].children().length();
super.label.text =
TreeListData(super.listData).text + "(" + myStr + ")";
graphics.lineStyle(.7, 0x999999,.3,false,"NONE");
trace("depth = " + TreeListData(super.listData).depth + ", open =
" + TreeListData(super.listData).open + ", rowIndex = " +
TreeListData(super.listData).rowIndex);
//trace("icon = " + TreeListData(super.listData).icon );
if ( depth > 2){
makeLastChildArr(node,depth,depth);
if (depth >3){
makeLastChildArr(node,3,depth);
}
//trace("isLastChild = " + isLast + " i=" + i);
trace("lineArrLen = " + lineArr.length );
lineArr = lineArr.reverse();
for (var i:Number=0;i< lineArr.length;i++){
trace("lineArr = " + lineArr[i] + " i=" + i);
}
for(var i:Number=1;i<=depth;i++){
var parentDropLine:Boolean = false;
TreeListData(super.listData);
if(i == depth ){
graphics.lineStyle(.7, 0x999999,.3,false,"NONE");
var offset:Number = indent + 6.5;
trace("Indent = " + indent);
trace("depthLeaf = " + depth + ", i = " + i + " offset=" +
offset);
graphics.moveTo(offset,-8);
graphics.lineTo(offset,2);
}
else { // Preceding lines
if (i != 1 ){ // don't draw first line
isLast = lineArr[i-2]; // pull out from correct index of
lineArray
if (!isLast){ // draw line if corresponding parent is not
lastchild
graphics.lineStyle(.7, 0x999999,.3,false,"NONE");
var offset:Number = i*13.5;
if (i == 2){offset = 23}
trace("depth = " + depth + ", i = " + i + ", offset = " +
offset );
graphics.moveTo(offset,-8);
graphics.lineTo(offset,14);
}//if
}//if
}//else
}//for
}// > 2
else if ( depth == 2){
offset = 23;
graphics.moveTo(offset,-8);
graphics.lineTo(offset,2);
}
}
else{
makeLastChildArr(node,3,depth);
//trace("isLastChild = " + isLast + " i=" + i);
trace("lineArrLen = " + lineArr.length );
lineArr = lineArr.reverse();
for (var i:Number=0;i< lineArr.length;i++){
trace("lineArr = " + lineArr[i] + " i=" + i);
}
for(var i:Number=1;i<=depth;i++){
var parentDropLine:Boolean = false;
TreeListData(super.listData);
if(i == depth ){
graphics.lineStyle(.7, 0x999999,.3,false,"NONE");
var offset:Number = indent + 6.5;
trace("Indent = " + indent);
trace("depthLeaf = " + depth + ", i = " + i + " offset=" + offset);
graphics.moveTo(offset,-8);
graphics.lineTo(offset,10);
graphics.moveTo(offset,10);
graphics.lineTo(offset + 10,10);
}
else { // Preceding lines
if (i != 1 ){ // don't draw first line
isLast = lineArr[i-2]; // pull out from correct index of lineArray
if (!isLast){ // draw line if corresponding parent is not
lastchild
graphics.lineStyle(.7, 0x999999,.3,false,"NONE");
var offset:Number = i*17 - 11;
if (i == 2){offset = 23}
trace("depth = " + depth + ", i = " + i + ", offset = " +
offset );
//var sp:Sprite = new Sprite();
graphics.moveTo(offset,-8);
graphics.lineTo(offset,14);
//this.addChild(sp);
}//if
}//if
}//else
}//for
}
}// super data
}
}
}
-------- End: MyTreeItemRenderer.as -----------
--
Flexcoders Mailing List
FAQ: http://groups.yahoo.com/group/flexcoders/files/flexcodersFAQ.txt
Search Archives: http://www.mail-archive.com/flexcoders%40yahoogroups.com
SPONSORED LINKS
| Web site design development | Computer software development | Software design and development |
| Macromedia flex | Software development best practice |
YAHOO! GROUPS LINKS
- Visit your group "flexcoders" on the web.
- To unsubscribe from this group, send an email to:
[EMAIL PROTECTED]
- Your use of Yahoo! Groups is subject to the Yahoo! Terms of Service.

