Flex中如何通过Tree类的setItemIcon事件给Tree节点设置一个个性化图标
下面是完整代码(或点击这里察看):
Download:
main.mxml
1. <?xml version="1.0" encoding="utf-8"?>
2. <mx:Application xmlns:mx="Http://www.adobe.com/2006/mxml"
3. layout="horizontal"
4. verticalAlign="middle"
5. backgroundColor="white"
6. creationComplete="init();">
7.
8. <mx:Script>
9. <![CDATA[
10. [Embed("assets/folder_table.png")]
11. private var FolderTableIcon:Class;
12.
13. [Embed("assets/folder_user.png")]
14. private var FolderUserIcon:Class;
15.
16. [Embed("assets/folder_wrench.png")]
17. private var FolderWrenchIcon:Class;
18.
19. private function init():void {
20. var nodeOne:XML = xmlListColl.getItemAt(0) as XML;
21. tree.setItemIcon(nodeOne, FolderTableIcon, FolderTableIcon);
22.
23. var nodeTwo:XML = xmlListColl.getItemAt(1) as XML;
24. tree.setItemIcon(nodeTwo, FolderUserIcon, FolderUserIcon);
25.
26. var nodeThree:XML = xmlListColl.getItemAt(2) as XML;
27. tree.setItemIcon(nodeThree, FolderWrenchIcon, FolderWrenchIcon);
28. }
29. ]]>
30. </mx:Script>
31.
32. <mx:XMLListCollection id="xmlListColl">
33. <mx:source>
34. <mx:XMLList>
35. <node label="One">
36. <node label="One.1">
37. <node label="One.1.1">
38. <node label="One.1.1.1">
39. <node label="One.1.1.1.1" />
40. </node>
41. </node>
42. </node>
43. <node label="One.2" />
44. <node label="One.3" />
45. </node>
46. <node label="Two">
47. <node label="Two.1" />
48. <node label="Two.2" />
49. <node label="Two.3" />
50. </node>
51. <node label="Three" />
52. </mx:XMLList>
53. </mx:source>
54. </mx:XMLListCollection>
55.
56. <mx:Tree id="tree"
57. dataProvider="{xmlListColl}"
58. labelField="@label"
59. width="250"
60. rowCount="6"
61. showScrollTips="true" />
62.
63. </mx:Application>
相关文章