GWT 原生拖放事件处理（两个来源，一个目标）

Question

我正在尝试在我的项目中实现本机拖放功能。

我创建了两个 Image-Widgets image1 和 image2:

image1.getElement().setDraggable(Element.DRAGGABLE_TRUE);
image2.getElement().setDraggable(Element.DRAGGABLE_TRUE);

然后我为每个创建了处理程序：

image1.addDragStartHandler(new DragStartHandler() {
        @Override
        public void onDragStart(DragStartEvent event) {
            event.setData("text", "images/img1.svg");
            });

image2.addDragStartHandler(new DragStartHandler() {
        @Override
        public void onDragStart(DragStartEvent event) {
            event.setData("text", "images/img2.svg");
            });

这是 DragOverHandler：

boundaryPanel.addDomHandler(new DragOverHandler() {
                    public void onDragOver(DragOverEvent event) {
                        boundaryPanel.getElement().getStyle().setBackgroundColor("#ffa");
                    }
                }, com.google.gwt.event.dom.client.DragOverEvent.getType());

然后我创建了 DropHandler，它应该能够决定拖动哪个图像。拖动时，应在 boundaryPanel 上创建一个新面板（对于每个拖动的图像另一个）。当我运行以下代码并拖动 image1 或 image2 时，它们都会显示 ap1。我认为我的 if-else-conditions 没有正常工作：

boundaryPanel.addDomHandler(new DropHandler() {             
      @Override
       public void onDrop(DropEvent event) {
         event.preventDefault();
         int x = (event.getNativeEvent().getClientX() - boundaryPanel.getAbsoluteLeft());
         int y = (event.getNativeEvent().getClientY() - boundaryPanel.getAbsoluteTop());
         boundaryPanel.getElement().getStyle().clearBackgroundColor();
         if(image1 != null){ <---think this is the problem
             //insert absolutePanel ap1
             ap1.add(ap2);
             ap1.add(ap3);
             ap1.add(ap4);          
             ap1.setWidgetPosition(ap3, 150, 0);
             ap1.setWidgetPosition(ap4, 474, 0);            
             boundaryPanel.add(ap1, x, y); 
          }
          else if (img2 != null) {
             //insert absolutePanel ap5
             ap5.add(ap6);
             ap5.add(ap7);
             ap5.add(ap8);          
             ap5.setWidgetPosition(ap7, 150, 0);
             ap5.setWidgetPosition(ap8, 474, 0);            
             boundaryPanel.add(ap5, x, y);                  
                    }
                }}, DropEvent.getType());

我做错了什么？

感谢您的帮助。

Answer 1

来自您的 post 的代码片段：

  ........
  boundaryPanel.getElement().getStyle().clearBackgroundColor();
     if(image1 != null){ <---think this is the problem
         //insert absolutePanel ap1
  ......

原因：

是的，问题出在 if 条件上，image1 是一个小部件，您已经对其进行了初始化，它将始终具有一个值。

更多信息：

当我们拖动 image1 或 image2 时，事件被正确触发，并且在 onDrop 中我们检查 image1 小部件的值不为空，并且此条件始终为真，因此您一直在打印 ap1。

解法：

更正您的 if 条件，使条件检查对于 onDrop 方法中的 image1 和 image2 是唯一的。

方法一：

添加布尔变量isImage1Dragged 和isImage2Dragged，默认值为false。在Image1的拖动部分，设置变量isImage1Dragged为true，在onDrop方法中修改条件如下

 if(isImage1Dragged) {

     // Do whatever you want when image1 is dragged
     ......
     ......
     isImage1Dragged = false;  

 } else if(isImage2Dragged) {
       // Do whatever you want when image2 is dragged
     ......
     ......
     isImage2Dragged = false;
 }

GWT 原生拖放事件处理（两个来源，一个目标）

GWT native Drag&Drop Event-Handling (two sources, one target)

gwt

drag-and-drop

event-handling

eventhandler