javascript - 将拖放代理置于指针的中心

Question

我正在使用 ExtJS 拖放，并尝试将拖动代理置于光标下方(代理:代表被拖动元素的半透明填充符)。我可以像这样将其物理居中，但之后它不会正确下降:

view.dragZone = Ext.create('Ext.dd.DragZone', view.getEl(), {

    onStartDrag: function(x, y) {
        this.setDelta(150, 20); // (the element is 300 x 40)
    },

    //.. other DD configs

});

当我使用它并将光标移动到放置区域时，它只会滑回到原始位置，就像我将其随机放置在某个地方一样。

如果我不使用此功能，光标将位于对象西北方向约 20 像素处(即不居中)，但我可以将其完全放置在放置区域中。

我认为这可能与光标没有直接位于放置区域有关，因为它现在直接位于拖动代理上。我尝试重置拖放区域的 z 索引，尝试将其置于拖动代理之上，但这似乎不起作用。尝试了其他一些非常随机的事情，不值得一提。

有人成功设置了拖放操作，使拖动代理以光标为中心吗？

Answer 1

我能够将代理居中并在grid drag/drop plugin的实时预览中看到它正确下降。 .

Ext.create('Ext.data.Store', {
    storeId:'simpsonsStore',
    fields:['name'],
    data: [["Lisa"], ["Bart"], ["Homer"], ["Marge"]],
    proxy: {
        type: 'memory',
        reader: 'array'
    }
});

var p = Ext.create('Ext.grid.Panel', {
    store: 'simpsonsStore',
    columns: [
        {header: 'Name',  dataIndex: 'name', flex: true}
    ],
    viewConfig: {
        plugins: {
            ptype: 'gridviewdragdrop',
            dragText: 'Drag and drop to reorganize'
        }
    },
    height: 200,
    width: 400,
    renderTo: Ext.getBody()
});

p.view.plugins[0].dragZone.onStartDrag = function() {
    this.setDelta(80, 10);
};

Ext.view.DragZone 看起来与 Ext.dd.DragZone 没有太大区别。然而，Ext.view.DropZone 添加了大量逻辑来检查记录被删除的位置。我猜测这个逻辑可能就是网格拖放插件的拖放工作正常的原因。