Question

在我的应用程序中，我有许多窗口和面板，我使用自定义滚动条。因此，对于每个窗口或面板，我需要指定afterlayout侦听器以获取自定义滚动条

            listeners:{
    afterlayout: function(c){
    fleXenv.fleXcrollMain(c.body.id);
      }
    }

所以我正在寻找的是我需要为窗口和面板全局添加这个监听器，以便通过添加此代码一次应该对所有窗口或面板产生影响。

有没有办法做到这一点

Answer 1

您的自定义滚动条似乎用于应用程序的所有Windows和面板中。因此扩展核心ExtJs类恕我直言是没有错的。将其作为一项功能实施＆＃39;默认启用，但是 - 对于您不想要滚动条的极少数情况 - 可以禁用。

Ext.define('patch.Ext.panel.Panel-scrollbar', {
    override: 'Ext.panel.Panel',

    enableCustomScrollbar: true,

    afterLayout: function() {
        this.fixScrollbar();
        this.callParent(arguments);
    },

    fixScrollbar: function() {
        if(this.enableCustomScrollbar) {
            // your code
        }
    }
});

加载Ext.require('patch.Ext.panel.Panel-scrollbar')或将其作为依赖项（requires）添加到您的应用程序定义中。

Ext.window.Window从Ext.panel.Panel延伸，因此它将继承行为。

Answer 2

您可以创建自己的面板和窗口来扩展ExtJS默认组件。您可以定义所需的侦听器，设置xtypes，然后在应用程序中使用这些已修改的组件。

另一个解决方案是使用Ext.override覆盖现有的Ext.panel.Panel和Ext.window.Window

Answer 3

恕我直言，我认为最好的方法是定义你的个人窗口/面板类。是的，一种方法是使用Ext.override函数，但我认为这不是一个好主意。

我建议你这样做：

Ext.define ('MyCustomWindow', {
  extend: 'Ext.window.Window' ,
  listeners: {
    afterlayout: function (win) {
      fleXenv.fleXcrollMain (win.body.id);
    }
  }
}

Ext.define ('MyCustomPanel', {
  extend: 'Ext.panel.Panel' ,
  listeners: {
    afterlayout: function (panel) {
      fleXenv.fleXcrollMain (panel.body.id);
    }
  }
}

现在，您可以实例化MyCustomWindow和MyCustomPanel，保持Ext.window.Window和Ext.panel.Panel不变。

另一种方法是使用WindowManager和PanelManager（这是你自己定义的）：

Ext.WindowManager.register (window1);
Ext.WindowManager.register (window2);
Ext.WindowManager.register (window3);

Ext.WindowManager.each (function (win) {
  win.on ('afterlayout', function (window) {
    fleXenv.fleXcrollMain (window.body.id);
  });
});

在这种情况下，首先你必须实例化你的窗口和面板，将它们注册到他们的经理，然后像我在上面的例子中那样调用每个函数。

Extjs4监听窗口

3 个答案: