Extjs4 Listener for window

Question

내 응용 프로그램에는 사용자 정의 스크롤바를 사용하는 많은 창과 패널이 있습니다. 각 창 또는 패널 그래서 사용자 정의 스크롤 막대를 얻을 청취자 afterlayout 지정해야

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

그래서 내가 그래서이 코드를 한 번 추가하여 창 및 패널에 대해 전역이 리스너를 추가 할 필요가 무엇을 임 찾고 모든 창 또는 패널에 적용해야합니다.

이

Answer 1

사용자 지정 스크롤바가 응용 프로그램의 모든 Windows 및 패널에서 사용 된 것 같습니다. 따라서 ExtJs 핵심 클래스 인 IMHO를 확장하는 데는 아무런 문제가 없습니다. 기본적으로 활성화 된 '기능'으로 구현하지만 스크롤바를 원하지 않는 드문 경우에 대해서는 비활성화 할 수 있습니다.

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

Answer 3

이럴 기존 Ext.panel.Panel 및 Ext.window.Window을 무시하는 것입니다, 나는이 작업을 수행하는 가장 좋은 방법은 귀하의 개인 창/패널 클래스를 정의하는 것입니다 생각합니다. 예, 한 가지 방법은 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); 
    } 
    } 
} 

지금, 당신은 변경되지 Ext.window.Window 및 Ext.panel.Panel를 떠나, MyCustomWindow 및 MyCustomPanel을 인스턴스화 할 수 있습니다.

또 다른 방법은 창 관리자와 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); 
    }); 
}); 

이 경우는, 먼저 호출 한 후, 당신의 창 및 패널을 인스턴스화 자신의 관리자로 등록해야하는 위의 예제에서와 마찬가지로 각 함수가 있습니다.