Ext.Window的属性及方法

 
Ext.Window扩展自Ext.Panel，其xtype值为window。
 
1、主要配置项：

      closable：是否允许关闭窗口，默认为true。

      closeAction：关闭窗口的动作，包括以下两种：

            close：从DOM删除窗口，销毁窗口及其所属组件，窗口不再可用，重新显示需要调用show方法。此为默认值。

            hide：通过设置可见性隐藏窗口，窗口还可用，调用show方法后重新显示。

      constrain：是否约束窗口只能在容器内移动，默认为false。窗口默认渲染到document.body。

      constrainHeader：是否约束窗口头部只能在容器内移动，默认为false。

      draggable：是否可拖曳，默认为true。

      resizable：是否可改变窗口的大小，默认为true。

      modal：是否为模式窗口，默认为false。

      maximizable：是否可最大化窗口，默认为false。

      maximized：是否在初始化时最大化显示窗口，默认为false。

      x：窗口的X坐标值。

      y：窗口的Y坐标值。

      manager：WindowGroup的引用。

 

      expandOnShow：是否在窗口显示时展开它，默认为true。当取值为false时，collapsed取值为true时，窗口初始显示时收缩。

      minimizable：是否可最小化窗口，默认为false。需要自定义最小化行为。

      defaultButton：当窗口获得焦点时，默认获得焦点的按钮。

      plain：主体背景是否透明，默认为false。
 
2、主要方法：

      show( [String/Element animateTarget], [Function callback], [Object scope] )：显示窗口。

      hide( [String/Element animateTarget], [Function callback], [Object scope] )：隐藏窗口。

      center()：窗口居中显示。

      close()：关闭窗口，相当于closeAction值为close的情形。

      maximize()：最大化窗口。

      restore()：还原窗口大小。

      toggleMaximize()：在最大化和还原之间切换。

 

      minimize()：最小化窗口。

      setActive( Boolean active )：激活窗口。

      focus()：窗口获得焦点。

      toBack()：后置窗口。

      toFront( [Boolean e] )：前置窗口。

      resize( Ext.Window this, Number width, Number height )：改变大小。
 
3、Ext.WindowGroup的主要方法：

      hideAll()

      sendToBack( String/Object win )

      bringToFront( String/Object win )

      get( String/Object id )

      getActive()

 

      each( Function fn, [Object scope] )

      getBy( Function fn, [Object scope] )
 
 
 
4、范例
var win;

Ext.get("btnShowWindow").on("click", function(){

 if(!win){

  win = new Ext.Window({

   title: "窗口",

   layout: "border",

   width: 500,

   height: 300,

   

   modal: true,

   closeAction: "hide",

   plain: true,

   maximizable: true,

   

   items: [

    {

     title: "组织机构",

     region: "west",

     collapsible: true,

     split: true,

     width: 100

    },

    {

     title: "组织人员",

     region: "center"

    }

   ],

   buttons: [

    {text:"关闭", handler:function(){

     win.hide();

    }}

   ]

  });

 }

 

 win.show(this);

});
 
 
 
    窗口分组：
var i=1, mygroup;

    

function newWin() { 

 var x = i++; 

 var win = new Ext.Window({

  id:"win"+x,

  title:"窗口"+x,   

  width:400,   

  height:300,   

  maximizable:true,   

  manager:mygroup

 });    

 win.show();

}
function toBack(){

 mygroup.sendToBack(mygroup.getActive());

}
function toFront(){

 mygroup.bringToFront(mygroup.get("win1"));

}
function hideAll(){  

 mygroup.hideAll();

}
Ext.onReady(function(){ 

 mygroup = new Ext.WindowGroup(); 

 Ext.get("btn").on("click", newWin); 

 Ext.get("btnToBack").on("click", toBack); 

 Ext.get("btnToFront").on("click", toFront);

 Ext.get("btnHide").on("click", hideAll);
效果图:
 
 效果图: