4
所以我有一个flex数据提供者,它带有一个xmllistcollection。我希望能够通过拖放来重新排列树中的树叶和树枝。我想将拖放区域限制为被拖动项目的当前级别。像 如何限制树节点从flex 3中的当前节点拖出?
branch branch 0 leaf 1 leaf 2 branch x leaf a leaf b所以,分支x不能被下分支0和叶一移动不能在分支0中
所以我有一个flex数据提供者,它带有一个xmllistcollection。我希望能够通过拖放来重新排列树中的树叶和树枝。我想将拖放区域限制为被拖动项目的当前级别。像 如何限制树节点从flex 3中的当前节点拖出?
branch branch 0 leaf 1 leaf 2 branch x leaf a leaf b所以,分支x不能被下分支0和叶一移动不能在分支0中
好吧移动,这里是一个非常简单的方法来做到这一点的基础上,this Flex Quick Starts article最后一个例子。这应该可以通过使用“正确的”放置指示符(项目之间的线)来改进,而不是在拖动时选择鼠标下的项目。
最相关的部分是onDragOver()
方法,其中我们限制可放置项目的位置。
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">
<mx:Script>
<![CDATA[
import mx.events.DragEvent;
import mx.managers.DragManager;
import mx.core.DragSource;
import mx.core.UIComponent;
import mx.controls.Tree;
private var _draggedItem:XML = null;
private function onDragEnter(event:DragEvent) : void
{
event.preventDefault();
event.currentTarget.hideDropFeedback(event);
var ds:DragSource = event.dragSource;
var items:Array = ds.dataForFormat("treeItems") as Array;
if (items != null && items.length > 0 && (items[0] is XML))
_draggedItem = items[0];
DragManager.acceptDragDrop(UIComponent(event.currentTarget));
}
private function onDragOver(event:DragEvent) : void
{
event.preventDefault();
event.currentTarget.hideDropFeedback(event);
tree.selectedIndex = tree.calculateDropIndex(event);
var node:XML = tree.selectedItem as XML;
// restrict drag & drop to nodes within same parent
if (_draggedItem.parent() != node.parent())
{
DragManager.showFeedback(DragManager.NONE);
return;
}
DragManager.showFeedback(DragManager.MOVE);
}
private function onDragDrop(event:DragEvent) : void
{
event.preventDefault();
event.currentTarget.hideDropFeedback(event);
tree.selectedIndex = tree.calculateDropIndex(event);
var node:XML = tree.selectedItem as XML;
var addToIndex:int = node.childIndex();
if ((_draggedItem.parent() == node.parent()) && (addToIndex != _draggedItem.childIndex()))
{
tree.dataDescriptor.removeChildAt(node.parent(), _draggedItem, _draggedItem.childIndex());
tree.dataDescriptor.addChildAt(node.parent(), _draggedItem, addToIndex);
}
}
private function onDragComplete(event:DragEvent) : void
{
tree.selectedIndex = -1;
}
]]>
</mx:Script>
<mx:XML id="treeData" xmlns="">
<root>
<node label="Massachusetts" type="state" data="MA">
<node label="Boston" type="city" >
<node label="Smoke House Grill" type="restaurant" />
<node label="Equator" type="restaurant" />
<node label="Aquataine" type="restaurant" />
<node label="Grill 23" type="restaurant" />
</node>
<node label="Provincetown" type="city" >
<node label="Lobster Pot" type="restaurant" />
<node label="The Mews" type="restaurant" />
</node>
</node>
<node label="California" type="state" data="CA">
<node label="San Francisco" type="city" >
<node label="Frog Lane" type="restaurant" />
</node>
</node>
</root>
</mx:XML>
<mx:Tree width="100%" height="100%" id="tree"
labelField="@label"
dataProvider="{treeData.node}"
allowMultipleSelection="false"
dragEnabled="true"
dropEnabled="true"
dragMoveEnabled="false"
dragEnter="onDragEnter(event)"
dragOver="onDragOver(event)"
dragDrop="onDragDrop(event)"
dragComplete="onDragComplete(event)">
</mx:Tree>
</mx:Application>
非常感谢。它效果很好。 – smartdirt 2008-11-14 03:17:51