Flex Tree 组件数据源 图表等 修改

Xml代码  

1. <?xml version="1.0" encoding="utf-8"?>  
2. <!-- Tree control example. -->  
3. <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">  
4. <!--下面是样式-->  
5. <mx:Style >  
6. Tree  
7. {  
8. verticalScrollBarStyleName: treeVerticalScrollBar;  
9. selectionColor: #417597;  
10. /*为默认、打开、关闭、有子项等几个状态添加不同的ico*/  
11. defaultLeafIcon: Embed(source="longstep/icon/sharp_grey/gif/base.gif");  
12. folderOpenIcon: Embed(source="longstep/icon/sharp_grey/gif/vote_yes.gif");  
13. folderClosedIcon: Embed(source="longstep/icon/sharp_grey/gif/options.gif");  
14. disclosureOpenIcon: Embed(source="longstep/icon/sharp_grey/gif/pause.gif");  
15. }  
16. .treeVerticalScrollBar  
17. {  
18. borderColor: #f00;  
19. }  
20. </mx:Style>  
21. <mx:Script>  
22. <![CDATA[ 
23. //绑定数据，定义xml类型变量用于存放选中节点 
24. [Bindable] 
25. public var selectedNode:XML; 
26. //当tree发生change事件时的事件 
27. public function treeChanged(event:Event):void { 
28. //将选中的节点转换成xml，赋予selectedNode，as为转换类型 
29. selectedNode=Tree(event.target).selectedItem as XML; 
30. } 
31. //tree有3个事件使用较多，change、itemClick、itemOpen、itemClose 
32. //change:选中列改变时被触发 
33. //itemClick:点击某一列时触发 
34. //itemOpen:节点展开时触发 
35. //itemClose:节点关闭时触发 
36. ]]>  
37. </mx:Script>  
38. <!--XMLList作为数据源是最适合于tree组件的-->  
39. <mx:XMLList id="treeData">  
40. <node label="Mail Box">  
41. <node label="Inbox">  
42. <node label="Marketing"/>  
43. <node label="Product Management"/>  
44. <node label="Personal"/>  
45. </node>  
46. <node label="Outbox">  
47. <node label="Professional"/>  
48. <node label="Personal"/>  
49. </node>  
50. <node label="Spam"/>  
51. <node label="Sent"/>  
52. </node>  
53. </mx:XMLList>  
54. <mx:Panel title="Tree Control Example" height="75%" width="75%"  
55. paddingTop="10" paddingLeft="10" paddingRight="10" paddingBottom="10">  
56. <mx:Label width="100%" color="blue"  
57. text="Select a node in the Tree control."/>  
58. <mx:HDividedBox width="100%" height="100%">  
59. <!--@表示xml中间点的属性，如：@label表示label属性的值-->  
60. <!--dataProvider="{treeData}"表示绑定数据，数据源可以是XML也可以是XMLList-->  
61. <mx:Tree id="myTree" width="50%" height="100%" labelField="@label"  
62. showRoot="false" dataProvider="{treeData}" change="treeChanged(event)"/>  
63. <mx:TextArea height="100%" width="50%"  
64. text="Selected Item: {selectedNode.@label}"/>  
65. </mx:HDividedBox>  
66. </mx:Panel>  
67. </mx:Application>