当前位置: 代码迷 >> JavaScript >> ExtJS2.0适用简明教程》之窗口分组
  详细解决方案

ExtJS2.0适用简明教程》之窗口分组

热度:583   发布时间:2012-11-04 10:42:42.0
ExtJS2.0实用简明教程》之窗口分组

窗口是分组进行管理的,可以对一组窗口进行操作,默认情况下的窗口都在默认的组 Ext.WindowMgr中。窗口分组由类Ext.WindowGroup定义,该类包括bringToFront、getActive、 hideAll、sendToBack等方法用来对分组中的窗口进行操作。

  看下面的代码:

var i=0,mygroup;
 function newWin()
 {	
 	var win=new Ext.Window({title:"窗口"+i++,
			width:400,
			height:300,
			maximizable:true,
			manager:mygroup}); 	
 	win.show();
 }
function toBack()
{
	mygroup.sendToBack(mygroup.getActive());
}
function hideAll()
{	
	mygroup.hideAll();
}
Ext.oReay(function(){
	mygroup=new Ext.WindowGroup();
	Ext.get("btn").on("click",newWin);
	Ext.get("btnToBack").on("click",toBack);
	Ext.get("btnHide").on("click",hideAll);
 });

  页面中的html代码

<input id="btn" type="button" name="add" value="新窗口" /> <input id="btnToBack" type="button" name="add" value="放到后台" /> <input id="btnHide" type="button" name="add" value="隐藏所有" />

  执行上面的代码,先点击几次“新窗口”按钮,可以在页面中显示几个容器,然后拖动这些窗口,让他们在屏幕中不同的位置。然后点“放到后台”按钮,可以实现把最前面的窗口移动该组窗口的最后面去,点击“隐藏所有”按钮,可以隐藏当前打开的所有窗口。如下图所示:

  相关解决方案