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>

Flex Tree Drag Drop

1 个答案: