Flex Tree Drag Drop

Question

我正在研究flex树的拖放功能，我有几个问题。

我已经将数组集合作为数据提供者。每个分支（文件夹）和叶子（项目）都有唯一的ID。

树结构是这样的。

folder1.
      folder2.
            item1.
            item2.
            item3.
      folder3.
            item4.
            item5.
            item6.
folder4.
      item7.
      item8.
      folder5.
            item9.
            item10.
folder6.
      folder7.
      folder8.

我需要允许用户拖放文件夹中的项目，但不能拖放到文件夹外。 但他可以将文件夹拖放到任何地方。

因此用户无法拖放项目folder1或folder4或folder6级别。

我在谷歌上发现了几个例子...但没有任何对我有利的事情。

Answer 1

以下是xml数据的示例：我使用mx_internal :: _ dropData属性来查找真正的父级。

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
           xmlns:s="library://ns.adobe.com/flex/spark" 
           xmlns:mx="library://ns.adobe.com/flex/mx" 
           minWidth="955" minHeight="600" 
           >


<fx:Script>
    <![CDATA[
        import mx.controls.Alert;
        import mx.core.mx_internal;
        import mx.events.DragEvent;


        protected function myTree_dragDropHandler(event:DragEvent):void
        {
            /*
            Pay attention at mx_internal namespace :
            Behaviour could change in the next flex version.
            Drop data structure.
            _dropData = { 
                parent: parent, 
                index: index, 
                localX: event.localX, 
                localY: event.localY, 
                emptyFolder: emptyFolder, 
                rowHeight: rowHeight, 
                rowIndex: rowNum };
            */

            var parent:XML = myTree.mx_internal::_dropData.parent;
            var draggedElement:XML = 
              (event.dragSource.dataForFormat("treeItems") as Array)[0];
            if (draggedElement.name() == "item" 
                                  && draggedElement.parent() != parent) {
                // element is an item and parent is different => can not drop                                        
                event.preventDefault();
                myTree.hideDropFeedback(event);
                Alert.show("can not drop");
            }

            // you can also play with
            // var dropIndex:int = myTree.calculateDropIndex(event);
            // myTree.getItemIndex(dropIndex)
            // but it is a little more complicated to find 
            // the real parent because we haven't drop indicator 
            // information (child or parent position).

            // I did not use xml element id but it is also possible
            // parent.id != draggedElement.parent().id

        }

    ]]>
</fx:Script>


<fx:Declarations>
    <fx:XMLList id="treeData">
        <folder id="folder1" label="Folder 1">
            <folder id="folder2" label="Folder 2">
                <item id="item1" label="Item 1"/>
                <item id="item2" label="Item 2"/>
                <item id="item3" label="Item 3"/>
            </folder>
            <folder id="folder3" label="Folder 3">
                <item id="item4" label="Item 4"/>
                <item id="item5" label="Item 5"/>
            </folder>
            <item id="item6" label="Item 6"/>
            <item id="item7" label="Item 7"/>
        </folder>
    </fx:XMLList>
</fx:Declarations>

<mx:Tree id="myTree" 
         width="50%" height="100%" 
         labelField="@label"
         dragEnabled="true"
         dropEnabled="true"
         dragMoveEnabled="true"
         showRoot="true" 
         dataProvider="{treeData}" 
         dragDrop="myTree_dragDropHandler(event)"/>


</s:Application>