Flex4之Tree开发二.docx

Flex4之Tree开发二.docx

《Flex4之Tree开发二.docx》由会员分享，可在线阅读，更多相关《Flex4之Tree开发二.docx（60页珍藏版）》请在冰豆网上搜索。

Flex4之Tree开发二

Flex4之Tree开发【二】

文章分类:

Flash编程

这次要说的是Flex的树组件的拖动效果，从树组件拖动到其他组件如List,DataGrid或者从其他组件拖动到Tree组件中,其实主要就是处理drag相关事件

第一：

从Tree到List

  示例一

Xml代码

1.

 medium">

xml version="1.0" encoding="utf-8"?

>  

2.

Application xmlns:

fx="   

3.               xmlns:

s="library:

//   

4.               xmlns:

mx="library:

// minWidth="955" minHeight="600">  

5.    

Declarations>  

6.        

-- 将非可视元素（例如服务、值对象）放在此处 -->  

7.        

XML id="myData">  

8.              

9.                  

10.                      

11.                      

12.                  

13.                  

14.                  

15.                  

16.              

17.        

XML>  

18.        

XML id="copyData">  

19.              

20.                  

21.              

22.        

XML>  

23.    

Declarations>  

24.      

25.    

Script>  

26.        

[CDATA[ 

27.            import mx.controls.Button; 

28.            import mx.core.IUIComponent; 

29.            import mx.core.DragSource; 

30.            import mx.managers.DragManager; 

31.            import mx.events.DragEvent; 

32.            import mx.collections.ArrayCollection; 

33.            import mx.controls.Alert; 

34.            //拖动对象进入时 

35.            private function onDragOver（ event:

DragEvent ） :

 void 

36.            { 

37.                var dropTarget:

Tree = Tree（event.currentTarget）; 

38.                var r:

int = dropTarget.calculateDropIndex（event）; 

39.                lbl.text = '当前位置：

'+r.toString（）;//哪一个节点在鼠标下并给出相应信息 

40.                tree2.selectedIndex = r; //显示位置 

41.                var node:

XML = sourceTree.selectedItem as XML; 

42.                lbl2.text = '当前的拖动对象是:

'+node.@label;//拖动对象的名字 

43.                if（ node.@label == "ActionScript" ） { 

44.                    DragManager.showFeedback（DragManager.NONE）; 

45.                    return; 

46.                } 

47.                // 键盘控制  

48.                if （event.ctrlKey） 

49.                    DragManager.showFeedback（DragManager.COPY）;//复制 

50.                else if （event.shiftKey） 

51.                    DragManager.showFeedback（DragManager.LINK）;//剪切 

52.                else { 

53.                    DragManager.showFeedback（DragManager.MOVE）;//移动 

54.                } 

55.            }  

56.             

57.            //拖动对象被抛出后 

58.            private function onDragDrop（ event:

DragEvent ） :

 void 

59.            { 

60.                // var ds:

DragSource = event.dragSource; 

61.                var dropTarget:

Tree = Tree（event.currentTarget）; 

62.                // retrieve the data associated with the "items" format. 

63.                //var items:

Array = ds.dataForFormat（"items"） as Array; 

64.                var r:

int = tree2.calculateDropIndex（event）; 

65.                tree2.selectedIndex = r;//当拖放完成后选定相应的节点 

66.                var node:

XML = tree2.selectedItem as XML; 

67.                var p:

*; 

68.                //tree2.dataDescriptor.hasChildren（node）判断有没有子节点,如果有就返回true 

69.                if（ tree2.dataDescriptor.hasChildren（node） ） { 

70.                    p = node; 

71.                    r = 0; 

72.                    trace（'有子节点'）; 

73.                } else { 

74.                    p = node.parent（）; 

75.                    trace（'没有子节点'）; 

76.                } 

77.                 

78.                // taking all of the items in the DragSouce, insert them into the  

79.                // tree using parent p.  

80.                //       for（var i:

Number=0; i < items.length; i++） { 

81.                //             var insert:

XML = ; 

82.                //             insert.@label = items[i]; 

83.                //             insert.@type = "restaurant"; 

84.                //             tree2.dataDescriptor.addChildAt（p, insert, r+i）; 

85.                //       } 

86.            }  

87.             

88.            private function onDragComplete（event:

DragEvent） :

 void 

89.            { 

90.                trace（'stop'）; 

91.                tree2.selectedIndex = 0; 

92.            } 

93. 

94.        ]]>  

95.    

Script>  

96.  

97.      

98.    

Label text="Label" id="lbl" x="439" y="120"/>  

99.    

Tree dropEnabled="true" dragEnabled="true" allowMultipleSelection="true" id="sourceTree"  

100.             dataProvider="{myData.item}" labelField="@label" x="114" y="146"/>  

101.      

102.    

Tree dropEnabled="true" id="tree2" dataProvider="{copyData.item}" labelField="@label"  

103.             dragOver="onDragOver（event）" dragDrop="onDragDrop（event）" dragComplete="onDragComplete（event）" x="382" y="146"/>  

104.      

105.    

Label x="382" y="94" text="Label" width="274" id="lbl2" height="29"/>  

106.    

Label x="218" y="62" text="Tree与Tree之间的拖动" width="139" height="19"/>  

107.

Application>  

108.  

xmlversion="1.0"encoding="utf-8"?

>

Applicationxmlns:

fx="

xmlns:

s="library:

//

xmlns:

mx="library:

//minWidth="955"minHeight="600">

Declarations>

--将非可视元素（例如服务、值对象）放在此处-->

XMLid="myData">

XML>

XMLid="copyData">

XML>

Declarations>

Script>

[CDATA[

importmx.controls.Button;

importmx.core.IUIComponent;

importmx.core.DragSource;

importmx.managers.DragManager;

importmx.events.DragEvent;

importmx.collections.ArrayCollection;

importmx.controls.Alert;

//拖动对象进入时

privatefunctiononDragOver（event:

DragEvent）:

void

{

vardropTarget:

Tree=Tree（event.currentTarget）;

varr:

int=dropTarget.calculateDropIndex（event）;

lbl.text='当前位置：

'+r.toString（）;//哪一个节点在鼠标下并给出相应信息

tree2.selectedIndex=r;//显示位置

varnode:

XML=sourceTree.selectedItemasXML;

lbl2.text='当前的拖动对象是:

'+node.@label;//拖动对象的名字

if（node.@label=="ActionScript"）{

DragManager.showFeedback（DragManager.NONE）;

return;

}

//键盘控制

if（event.ctrlKey）

DragManager.showFeedback（DragManager.COPY）;//复制

elseif（event.shiftKey）

DragManager.showFeedback（DragManager.LINK）;//剪切

else{

DragManager.showFeedback（DragManager.MOVE）;//移动

}

}

//拖动对象被抛出后

privatefunctiononDragDrop（event:

DragEvent）:

void

{

//vards:

DragSource=event.dragSource;

vardropTarget:

Tree=Tree（event.currentTarget）;

//retrievethedataassociatedwiththe"items"format.

//varitems:

Array=ds.dataForFormat（"items"）asArray;

varr:

int=tree2.calculateDropIndex（event）;

tree2.selectedIndex=r;//当拖放完成后选定相应的节点

varnode:

XML=tree2.selectedItemasXML;

varp:

*;

//tree2.dataDescriptor.hasChildren（node）判断有没有子节点,如果有就返回true

if（tree2.dataDescriptor.hasChildren（node））{

p=node;

r=0;

trace（'有子节点'）;

}else{

p=node.parent（）;

trace（'没有子节点'）;

}

//takingalloftheitemsintheDragSouce,insertthemintothe

//treeusingparentp.

//for（vari:

Number=0;i

//varinsert:

XML=;

//insert.@label=items[i];

//insert.@type="restaurant";

//tree2.dataDescriptor.addChildAt（p,insert,r+i）;

//}

}

privatefunctiononDragComplete（event:

DragEvent）:

void

{

trace（'stop'）;

tree2.selectedIndex=0;

}

]]>

Script>

Labeltext="Label"id="lbl"x="439"y="120"/>

TreedropEnabled="true"dragEnabled="true"allowMultipleSelection="true"id="sourceTree"

dataProvider="{myData.item}"labelField="@label"x="114"y="146"/>

TreedropEnabled="true"id="tree2"dataProvider="{copyData.item}"labelField="@label"

dragOver="onDragOver（event）"dragDrop="onDragDrop（event）"dragComplete="onDragComplete（event）"x="382"y="146"/>

Labelx="382"y="94"text="Label"width="274"id="lbl2"height="29"/>

Labelx="218"y="62"text="Tree与Tree之间的拖动"width="139"height="19"/>

Application>

  示例二

Xml代码

1.

 medium">

xml version="1.0" encoding="utf-8"?

>  

2.

Application xmlns:

fx="   

3.               xmlns:

s="library:

//   

4.               xmlns:

mx="library:

// minWidth="955" minHeight="600">  

5.    

Declarations>  

6.        

-- 将非可视元素（例如服务、值对象）放在此处 -->  

7.        

-- 这里定义班组树的结构和内容 -->  

8.        

XMLList id="treeData">  

9.              

10.                  

11.                      

12.                          

13.                          

14.                      

15.                      

16.                          

17.                          

18.                      

19.                      

20.                          

21.                          

22.                      

23.