Мне нужно реализовать перетаскивание для ячеек в 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 (с использованием последней стабильной версии), так что, возможно, это неправильный способ сделать это.Есть идеи?Спасибо!