在GWT 2.4中设置拖动图像

4

我需要在CellTable中为单元格实现拖放功能。根据MobileWebApp的示例,我实现了一个自定义可拖动的单元格:

public class DraggableCell extends AbstractCell<ProductProxy>{

interface Templates extends SafeHtmlTemplates {
    @SafeHtmlTemplates.Template("<div draggable=\"true\">{0}</div>")
    SafeHtml simpleTextTemplate(String text);
}

protected Templates templates = GWT.create(Templates.class);

public DraggableCell() {
    super("dragstart");
}

@Override
public void render(Context context, ProductProxy value, SafeHtmlBuilder sb){
        sb.append(templates.simpleTextTemplate(value.getName()));
}

@Override
public void onBrowserEvent(Context context, Element parent, 
                           ProductProxy value, NativeEvent event, 
                           ValueUpdater<ProductProxy> valueUpdater) {
    final Integer cursorOffsetX = 0;
    final Integer cursorOffsetY = 0;

    if ("dragstart".equals(event.getType())) {
        // Save the ID of the entity
        DataTransfer dataTransfer = event.getDataTransfer();
        dataTransfer.setData("text", value.getId());

        SafeHtmlBuilder sb = new SafeHtmlBuilder();
        sb.appendEscaped(value.getSn());

        Element element = DOM.createDiv();
        element.setInnerHTML(sb.toSafeHtml().asString());

        // Set the helper image.
        dataTransfer.setDragImage(element, cursorOffsetX, cursorOffsetY);
    }
}

我为拖动图像使用了新元素(在MobileWebApp中,他们只使用父元素),但是不幸的是,拖动过程中没有显示任何图像。我想也许需要先将新元素附加到DOM中,因此我创建了一个helperPanel并将元素附加到它上面:

DOM.getElementById("dragHelperPanel").appendChild(element);
// Set the helper image.
dataTransfer.setDragImage(element, cursorOffsetX, cursorOffsetY);

这在 Firefox 6 中可以正常工作,但在使用最新稳定版的 Chrome 中无法运行,因此可能这不是正确的方法。有什么想法吗?谢谢!
1个回答

0

1
我已经使用gwtquery dnd插件(http://code.google.com/p/gwtquery-plugins/)有一个工作解决方案。我试图过渡到本地GWT方法,以减少我的外部依赖性。但不幸的是,原生拖放支持文档记录很差。 - Ioan Agopian

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接