我有一个extjs面板。我需要为此面板引入拖动和调整大小属性。
这是创建面板的代码:
var childPanel = new Ext.Panel({
draggable: true,
layout: 'fit',
................
});
我已使用以下代码实现拖动和调整属性:
Ext.override(Ext.Panel, {
// private
initEvents: function () {
if (this.draggable) {
this.initDraggable();
}
this.resizer = new Ext.Resizable(this.el, {
animate: true,
duration: '.6',
easing: 'backIn',
handles: 'all',
pinned: false,
transparent: true
});
this.resizer.on("resize", this.onResizer, this);
},
onResizer: function (oResizable, iWidth, iHeight, e) {
this.setHeight(iHeight);
this.setWidth(iWidth);
}
});
如您所见,我正在覆盖该物业。因此,我创建的所有面板都具有这些属性。我不希望这样。
我知道Ext.extend是使用的方法,但每次我都会遇到一些错误。我需要的是带有上述代码的扩展面板。
有人可以帮助我实现这个目标吗?
答案 0 :(得分:1)
你累了吗?错误是什么? 您应该记得从扩展方法中调用超类构造函数。
MYDRAGRESIZEPANEL = Ext.extend(Ext.Panel,{
// private
initEvents: function () {
**MYDRAGRESIZEPANEL.superclass.constructor.call(this);**
if (this.draggable) {
this.initDraggable();
}
this.resizer = new Ext.Resizable(this.el, {
animate: true,
duration: '.6',
easing: 'backIn',
handles: 'all',
pinned: false,
transparent: true
});
this.resizer.on("resize", this.onResizer, this);
},
onResizer: function (oResizable, iWidth, iHeight, e) {
this.setHeight(iHeight);
this.setWidth(iWidth);
}
});