Flex3.0&AS3 2008. 10. 23. 18:01

Tree Component



<?xml version="1.0"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">
<mx:Style>
ToolTip
{
 fontSize:12;
}
</mx:Style>
<mx:XML id="xmlData">
<root> 
            <folder label="Stock" isBranch="true"> 
            </folder>             
            <folder label="Entertainment" isBranch="true">
                  <folder label="지상파 방송" isBranch="true" />
                  <folder label="케이블 방송" isBranch="true">
                          <Pfolder label="인천" />
                          <Pfolder label="수원" />
                  </folder>
            </folder>
           
            <folder label="Sports">
                  <Pfolder label="야구" />
                  <Pfolder label="축구" />
                  <Pfolder label="농구" />
                  <Pfolder label="배구" />
            </folder>
</root> 
</mx:XML>  
     
<mx:Tree id="tree1" itemRenderer="comp.TreeRenderer" dataProvider="{xmlData}" showRoot="false" rowCount="6"  fontSize="12" labelField="@label"  width="294" />
<mx:Label text="{tree1.selectedItem.toXMLString()}" fontSize="12" width="338" height="154"/>
</mx:Application>


TreeRenderer.mxml
<?xml version="1.0"?>
<local:TreeItemRenderer  xmlns:local="mx.controls.treeClasses.*" xmlns:mx="http://www.adobe.com/2006/mxml" >
<mx:Script>
 <![CDATA[ 
        import mx.controls.treeClasses.*;
        import mx.collections.*;
       
        override public function set data(value:Object):void{
            super.data = value;
            if(!TreeListData(super.listData).hasChildren){return;}
           
            setStyle("color", 0xff0000);       // Branch이면 적색으로
            setStyle("fontWeight", 'bold');    // Branch이면 볼드로
        }
         
        override protected function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void {
            super.updateDisplayList(unscaledWidth, unscaledHeight);
            if(!super.data){ return;}
           
            icon.filters=[new  GlowFilter, new BlurFilter];                 // 폴더 아이콘에 Glow 효과
            disclosureIcon.filters=[new BlurFilter];          // 폴더열기닫기 Blue 효과
            super.label.toolTip = label.text;             // 툴팁 설정하기

            if(! TreeListData(super.listData).hasChildren){return;}           

            var tmp:XMLList =  new XMLList(TreeListData(super.listData).item);
            var myStr:int = tmp[0].children().length();
            super.label.text =  TreeListData(super.listData).label + "(" + myStr + ")";  // Branch에 대해서만 갯수를 표시한다.
        }

 ]]>
</mx:Script>
</local:TreeItemRenderer>