您的位置:首页 > Web前端 > JavaScript

extjs4.2 desktop 桌面图标拖动

2015-01-04 14:48 369 查看
自带的例子桌面图标不能拖动,网上找的代码,有bug,和桌面图标换行一起使用时,拖动过程图标看不见,反复调试修改,以下代码完美拖动桌面图标,有人反映拖动后会出现白屏,经调试已解决,在本论坛我的另一篇文章有解决办法。

1. 打开extjs自带的desktop.js文件 加入如下代码:

// onRenderShortcut 桌面拖动

onRenderShortcut: function (v) {
var me = this;
me.shortcutsView.dragZone = new Ext.dd.DragZone(v.getEl(), {
getDragData: function (e) {
var sourceEl = e.getTarget(v.itemSelector, 10);
if (sourceEl) {
var d = sourceEl.cloneNode(true);
d.style.left = 0;
d.style.top = 0;
d.id = Ext.id();
return v.dragData = {
sourceEl: sourceEl,
ddel: d,
sourceStore: v.store,
draggedRecord: v.getRecord(sourceEl)
}
}
},
getRepairXY: function () {
return this.dragData.repairXY;
},
onMouseUp: function (e) {
var currDom = Ext.fly(this.dragData.sourceEl);
var oldXY = currDom.getXY();
var newXY = e.getXY();
var width = currDom.getWidth();
var height = currDom.getHeight();
if (Math.abs(oldXY[0] - newXY[0]) > width || Math.abs(oldXY[1] - newXY[1]) > height) {
var mymaxx = me.getHeight() - me.taskbar.getHeight() - height - 10;
var mymaxy = me.getWidth() - width;
if (newXY[1] > mymaxx) { newXY[1] = mymaxx; }
if (newXY[1] < 1) { newXY[1] = 0; }
if (newXY[0] < 1) { newXY[0] = 0; }
if (newXY[0] > mymaxy) { newXY[0] = mymaxy; }
currDom.setXY(newXY);
}

}
});
},

// onRenderShortcut 桌面拖动结束
2. 在 desktop.js中找到  initComponent: function () { 里,加入代码:
 me.shortcutsView.on('render', me.onRenderShortcut, me);

=======================================
源码下载:  http://download.csdn.net/detail/olinbsoft/8326735
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息