无语了，Flex 中控件没有设置backgroundColor 就不能检测到拖拽进入事件

最新推荐文章于 2021-11-30 19:36:16 发布

txiejun

最新推荐文章于 2021-11-30 19:36:16 发布

阅读量1.5k

点赞数

文章标签： flex function import application button user

本文链接：https://blog.csdn.net/txiejun/article/details/4366369

版权

今天遇到个很诡异的问题，我在用flex 实现拖拽功能时，因为没有设置拖拽目标控件的backgroundColor 值，结果我怎么拖也看不到目标控件接收的标志：

修改前的代码，（只是一个Demo）：

<?xml version="1.0"?>

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
backgroundColor="white" creationComplete="init()">

<mx:Script>
<![CDATA[

        import mx.core.DragSource;
        import mx.managers.DragManager;
        import mx.events.*;
        import mx.containers.Canvas;

  private function init():void
  {
   myCanvas.addEventListener(DragEvent.DRAG_ENTER,dragEnterHandler);
   myCanvas.addEventListener(DragEvent.DRAG_DROP,dragDropHandler);

  }
        // Initializes the drag and drop operation.
        private function mouseMoveHandler(event:MouseEvent):void {

            // Get the drag initiator component from the event object.
            var dragInitiator:Canvas=Canvas(event.currentTarget);

            // Get the color of the drag initiator component.
            var dragColor:int = dragInitiator.getStyle('backgroundColor');

// Create a DragSource object.
var ds:DragSource = new DragSource();

// Add the data to the object.
ds.addData(dragColor, 'color');

            // Call the DragManager doDrag() method to start the drag.
            DragManager.doDrag(dragInitiator, ds, event);
        }

// Called when the user moves the drag proxy onto the drop target.
private function dragEnterHandler(event:DragEvent):void {

            // Accept the drag only if the user is dragging data
            // identified by the 'color' format value.
            if (event.dragSource.hasFormat('color')) {

                // Get the drop target component from the event object.
                var dropTarget:Canvas=Canvas(event.currentTarget);
                // Accept the drop.
                DragManager.acceptDragDrop(dropTarget);
            }
        }

        // Called if the target accepts the dragged object and the user
        // releases the mouse button while over the Canvas container.
        private function dragDropHandler(event:DragEvent):void {

            // Get the data identified by the color format
            // from the drag source.
            var data:Object = event.dragSource.dataForFormat('color');
            // Set the canvas color.
            myCanvas.setStyle("backgroundColor", data);
        }
        ]]>
    </mx:Script>

<mx:HBox>
        <mx:Canvas
            width="30" height="30"
            backgroundColor="red"
            borderStyle="solid"
            mouseMove="mouseMoveHandler(event);"/>
        <mx:Canvas
            width="30" height="30"
            backgroundColor="green"
            borderStyle="solid"
            mouseMove="mouseMoveHandler(event);"/>
    </mx:HBox>

<mx:Label text="Drag a color onto the Canvas container."/>

<mx:Canvas id="myCanvas"
        width="100" height="100"

        borderStyle="solid"/>

    <mx:Button id="b1"
        label="Clear Canvas"
        click="myCanvas.setStyle('backgroundColor', '0xFFFFFF');"
    />
</mx:Application>

修改以后的代码：

<?xml version="1.0"?>

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
backgroundColor="white" creationComplete="init()">

<mx:Script>
<![CDATA[

        import mx.core.DragSource;
        import mx.managers.DragManager;
        import mx.events.*;
        import mx.containers.Canvas;

// Create a DragSource object.
var ds:DragSource = new DragSource();

// Add the data to the object.
ds.addData(dragColor, 'color');

            // Call the DragManager doDrag() method to start the drag.
            DragManager.doDrag(dragInitiator, ds, event);
        }

// Called when the user moves the drag proxy onto the drop target.
private function dragEnterHandler(event:DragEvent):void {

            // Accept the drag only if the user is dragging data
            // identified by the 'color' format value.
            if (event.dragSource.hasFormat('color')) {

<mx:Label text="Drag a color onto the Canvas container."/>

<mx:Canvas id="myCanvas"
        width="100" height="100"
        backgroundColor="#FFFFFF"
        borderStyle="solid"/>

    <mx:Button id="b1"
        label="Clear Canvas"
        click="myCanvas.setStyle('backgroundColor', '0xFFFFFF');"
    />
</mx:Application>

就在<mx:Canvas id="myCanvas"
        width="100" height="100"
        backgroundColor="#FFFFFF"
        borderStyle="solid"/>

少了句 backgroundColor="#FFFFFF" 结果有这么大的差别，很是郁闷，浪费了我两个多小时。

我就在想，Adobe 是用控件的颜色（或者是像素值来判断一个物体是否存在的吗？为什么不用他的逻辑值比如知道了一个Canvas的x ，y坐标和width,height，就完全可以知道这个Canvas在哪儿呀，非得用到颜色吗？