A Tree's icons must be embedded images. It doesn't have code to load external images. You can customize a renderer to do so.
________________________________ From: [email protected] [mailto:[EMAIL PROTECTED] On Behalf Of sk_acura Sent: Friday, July 18, 2008 6:33 AM To: [email protected] Subject: [flexcoders] Re: How to create dynamically Icon for a Tree Hi, Is there a way we can use the iconFunction on tree and specify the Icon at runtime.. Here is the Code i am trying to use.. [CODE] private function getNodeIcon(nodeObject:Object):Class{ var nodeIcon:Class = null; var node:Node = null; var iconURL = "http://localhost/myapp/icons/folder_yellow.png <http://localhost/myapp/icons/folder_yellow.png> "; trace("IconURL (1) =["+iconURL+"]"); if(nodeObject!=null){ node =Node (nodeObject); trace("Node ="+node); nodeIcon = IconUtility.getClass(collectionTree, iconURL, 12, 12); if(node.iconURL!=null && node.iconURL!="null"){ trace("Icon for Node ="+node.iconURL); iconURL ="http://localhost/myapp/icons/ <http://localhost/myapp/icons/> "+node.iconURL; trace("IconURL (2)=["+iconURL+"]"); nodeIcon = IconUtility.getClass(collectionTree, iconURL, 12, 12); } } trace("Returning the Class ="+nodeIcon); return nodeIcon; } [/CODE] And in the MXML i have the following.. [CODE] <mx:Tree id="collectionTree" labelFunction="treeLabel" dataProvider="{domainArrayCollection}" showRoot="false" width="100%" height="100%" change="getNodeInfo(event)" iconFunction="getNodeIcon"> </mx:Tree> [/CODE] I am not sure what went wrong i am setting the icon propery in the Node Object and i can get these icons when i type the URL in the browser but in the tree i don't see any icons.. I am using the Utility Class that Ben Stucki wrote ( http://blog.benstucki.net/?p=42 <http://blog.benstucki.net/?p=42> ) Thanks Mars --- In [email protected] <mailto:flexcoders%40yahoogroups.com> , "bodie0293" <[EMAIL PROTECTED]> wrote: > > > This may not be the most efficient method, but this is how I > populate a dynamic tree and assign icons. > > Preliminaries: > > The Tree has 3 levels: User, Project, and Hours. The tree > entries are represented as ActionScript classes (not shown). > These classes have a superclass of BaseTreeEntry that contains > two fields: label, and children. Each tree level has a different > icon. Icons are embedded. > > In a real application the data model would have been obtained > from the server. I have represented these here as 3 <mx:Model> > components for simplicity. > > Here is the example. > > <?xml version="1.0" encoding="utf-8"?> > <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml <http://www.adobe.com/2006/mxml> " > layout="absolute" > creationComplete="init()" > > > <mx:Script> > <![CDATA[ > import tree.BaseTreeEntry; > import tree.UserTreeEntry; > import tree.ProjectTreeEntry; > import tree.HoursTreeEntry; > > import mx.collections.ArrayCollection; > > [Bindable] > public var selectedNode : BaseTreeEntry; > > [Bindable] > [Embed(source="/images/person.jpg")] > public var iconPerson:Class; > [Bindable] > [Embed(source="/images/project.jpg")] > public var iconProject:Class; > [Bindable] > [Embed(source="/images/hours.jpg")] > public var iconHours:Class; > > [Bindable] > public var treeNodes : ArrayCollection = new > ArrayCollection(); > > // Event handler for the Tree control change event. > public function treeChanged(event:Event):void { > selectedNode=Tree(event.target).selectedItem as > BaseTreeEntry; > } > > public function init() : void { > for (var i : int = 0; i < userDataModel.User.length; > i++) { > var userVO : Object = userDataModel.User[i]; > var userTreeEntry : UserTreeEntry = new > UserTreeEntry(); > userTreeEntry.label = userVO.LastName + ", " + > userVO.FirstName; > userTreeID.setItemIcon(userTreeEntry, iconPerson, > null); > treeNodes.addItem(userTreeEntry); > for (var j : int = 0; j < > projectDataModel.Project.length; j++) { > var projectVO : Object = > projectDataModel.Project[j]; > var projectTreeEntry : ProjectTreeEntry = new > ProjectTreeEntry(); > projectTreeEntry.label = projectVO.Name; > userTreeID.setItemIcon(projectTreeEntry, > iconProject, null); > > userTreeEntry.children.addItem(projectTreeEntry); > for (var k : int = 0; k < > hoursDataModel.Hours.length; k++) { > var hoursVO : Object = > hoursDataModel.Hours[k]; > if (hoursVO.UserID == userVO.UserID && > hoursVO.ProjectID == > projectVO.ProjectID) { > var hoursTreeEntry : HoursTreeEntry = > new HoursTreeEntry(); > hoursTreeEntry.label = "Week: " + > hoursVO.WeekID; > userTreeID.setItemIcon(hoursTreeEntry, > iconHours, null); > > projectTreeEntry.children.addItem(hoursTreeEntry); > } > } > } > } > } > > ]]> > </mx:Script> > > <mx:Model id="userDataModel" > > <root> > <User> > <UserID>1</UserID> > <UserName>caradmin</UserName> > <LastName>Vanderlay</LastName> > <FirstName>Art</FirstName> > <MiddleInit>J</MiddleInit> > <Title>CAR Administrator</Title> > <HireDate>10/12/2004</HireDate> > <TermDate></TermDate> > </User> > <User> > <UserID>2</UserID> > <UserName>joe</UserName> > <LastName>Estudiente</LastName> > <FirstName>Joe</FirstName> > <MiddleInit>L</MiddleInit> > <Title>CAR User</Title> > <HireDate>01/13/1992</HireDate> > <TermDate>04/20/2007</TermDate> > </User> > </root> > </mx:Model> > > <mx:Model id="projectDataModel" > > <root> > <Project> > <ProjectID>1001</ProjectID> > <Name>Project Number 1</Name> > <Description>Desc. for Project 1</Description> > </Project> > <Project> > <ProjectID>1002</ProjectID> > <Name>Project Number 2</Name> > <Description>Desc. for Project 2</Description> > </Project> > </root> > </mx:Model> > > <mx:Model id="hoursDataModel" > > <root> > <Hours> > > <ProjectPersonWeekHoursID>5001</ProjectPersonWeekHoursID> > <ProjectID>1001</ProjectID> > <UserID>1</UserID> > <WeekID>87</WeekID> > <Description>blah blah</Description> > <Mon>8</Mon> > <Tue>8</Tue> > <Wed>8</Wed> > <Thu>8</Thu> > <Fri>8</Fri> > <Sat>0</Sat> > <Sun>0</Sun> > </Hours> > <Hours> > > <ProjectPersonWeekHoursID>5002</ProjectPersonWeekHoursID> > <ProjectID>1002</ProjectID> > <UserID>1</UserID> > <WeekID>88</WeekID> > <Mon>8</Mon> > <Tue>8</Tue> > <Wed>8</Wed> > <Thu>8</Thu> > <Fri>8</Fri> > <Sat>0</Sat> > <Sun>0</Sun> > </Hours> > </root> > </mx:Model> > > <mx:HDividedBox width="100%" height="100%"> > > <mx:Tree id="userTreeID" > dataProvider="{treeNodes}" > width="30%" height="100%" > change="treeChanged(event)" > > > </mx:Tree> > > <mx:TextArea height="100%" width="70%" > text="Selected Item: {selectedNode.label}"/> > </mx:HDividedBox> > > </mx:Application> > > Paul Ranauro > [EMAIL PROTECTED] >
