将图像从容器拖放到另一个容器 - Flex答案

【问题标题】：Drag and drop an image from a container to another - Flex将图像从容器拖放到另一个容器 - Flex
【发布时间】：2011-08-31 09:58:30
【问题描述】：

我需要一种将图像从容器拖放到另一个容器的方法。我尝试了几种不同的方法，但我想拖放的东西仍然让我望而却步。无论如何，这就是我想要做的，一个容器将包含一些位图/矢量图像（最好的方法是什么？平铺组？或者？）然后我希望能够将任何图像拖到另一个更大的面板内的图像。就像在 Photoshop 中拖动形状一样。

这里没有代码，因为我完全不知道如何去做。我在这里和那里找到了一些提示/教程，但没有一个我可以轻松理解或适应我的需要。那么，有什么帮助吗？

编辑 1：到目前为止：

        public function beginDrag( mouseEvent:MouseEvent ):void
        {
          var dragInitiator:IUIComponent = mouseEvent.currentTarget as IUIComponent;

            var dragSource:DragSource = new DragSource();
            dragSource.addData(mouseEvent.currentTarget.source, "items");

            var dragProxy:Image = new Image();
            dragProxy.source = mouseEvent.currentTarget.source;
            dragProxy.setActualSize(mouseEvent.currentTarget.width,mouseEvent.currentTarget.height)
            DragManager.doDrag(dragInitiator, dragSource, mouseEvent, dragProxy);
        }
        public function acceptDrop( dragEvent:DragEvent ):void
        {
            var dropTarget:IUIComponent = dragEvent.currentTarget as IUIComponent;
            var dragSource:DragSource = dragEvent.dragSource;
            if (dragSource.hasFormat("items"))
            {
                DragManager.acceptDragDrop(Image(dragEvent.currentTarget));
            }
        }
        public function handleDrop( dragEvent:DragEvent ):void
        {
            var dragInitiator:IUIComponent = dragEvent.dragInitiator;
            var dropTarget:IUIComponent = dragEvent.currentTarget as IUIComponent;

            var items:String = dragEvent.dragSource.dataForFormat("items") as String;
            var img:Image = new Image();
            img.x=dragEvent.localX;
            img.y=dragEvent.localY;
            img.width = 50;
            img.height=50;
            img.source=items.toString();
            var bitmap:Bitmap= Bitmap(img.content);
            myImage.addChild(img);

        }

【问题讨论】：

标签： apache-flex drag-and-drop bitmap

【解决方案1】：

不确定“容器”是什么意思，但总体而言，您希望在形状上使用 MOUSE_DOWN/MOUSE_UP 事件侦听器，并在侦听器函数中调用 startDrag() 和 stopDrag()。

【讨论】：

好吧，不确定容器是否是正确的术语。但这就是我想要的。我想在 Tile Group 中保留一些图像，然后我想将任何图像拖放到面板内的另一个更大的图像上。对于您提到的事件，您是否有任何链接可以通过？

【解决方案2】：

启用拖放的最简单方法是使用 List 组件（您可以为其提供自定义布局，例如 TileLayout）。请参阅 Flex 文档中的 Using drag-and-drop with list-based controls，了解一些可以帮助您入门的示例代码。

如果由于某种原因 List 不适合您，您将需要直接使用 DragManager。文章Manually adding drag-and-drop support 描述了所有必需的事件并提供了示例代码。

【讨论】：

从我在这里和那里找到的一些代码开始。无论如何，代码在我的问题中已更新，现在我面临的问题是每次拖放图像时，实际上都会创建它的副本并将其放在目标上。现在，一旦它在目标内部（即带有较大图像的图像控件），我需要它仍然可以在图像控件上的不同坐标处拖动/放置，但不复制图像。那就是图像应该完全移动到新位置。我该怎么做？
如果您在拖动启动器上侦听 dragComplete 事件，则可以在放置后处理清理。您可能还想查看 DragManager.showFeedback(DragManager.MOVE) 以指定拖动是移动而不是副本。