Question

我正在为我的Web应用程序使用GWT和GWT Query插件。我有一个可拖动的图像和一个包装在Droppable中的GWT Canvas。我的代码如下所示：

final Canvas canvas = Canvas.createIfSupported();
    canvas.setHeight("340px");
    DroppableWidget<Canvas> test = new DroppableWidget<Canvas>(canvas);

    test.addDropHandler(new DropEventHandler() {
        @Override
        public void onDrop(DropEvent event) {
            Context2d context = canvas.getContext2d();
            Image img = new Image("image");
            ImageElement i = ImageElement.as(img.getElement());
            //get x and y coordinates out of the drop event
            context.drawImage(i, x, y);
        }

    });

问题是......如何从掉落事件中获取这些x和y坐标，以便我可以在放置位置的画布上绘制图像？

Answer 1

首先，你应该通过DropEvent

检索你的图像元素

ImageElement i = ImageElement.as(event.getDraggable());

之后如果你想知道可拖动的位置（与droppable相关），你可以像这样计算坐标：

Offest droppableOffset = $(event.getDroppable()).offset();
Offset draggableOffset = $(event.getDraggable()).offset();

int x = draggableOffset.left - droppableOffset.left;
int y = draggableOffset.top - droppableOffset.top;

GWT Query DropEvent：我可以得到丢弃坐标吗？

1 个答案: