ExtJS学习--------通过WindowGroup（也叫ZIndexManager）来操作window等组件

首页 > 代码库 > ExtJS学习--------通过WindowGroup（也叫ZIndexManager）来操作window等组件

ExtJS学习--------通过WindowGroup（也叫ZIndexManager）来操作window等组件

2024-07-17 22:36:16 225人阅读

具体实现代码：（注意：在进行测试的时候最好分别进行测试，测试一个功能的时候将其他功能注释掉，否则会影响效果....）WindowGroup对象的方法可以在其参考文档中进行查看，文档下载地址：http://download.csdn.net/detail/z1137730824/7748893 下载查看

Ext.onReady(function(){//WindowGroup的使用
	var wingroup=new Ext.ZIndexManager();//两个都可以
//	var wingroup=new Ext.WindowGroup();//两个都可以
	for(var i=1;i<=5;i++)//创建5个窗口，
	{
		var win=Ext.create('Ext.Window',{//也可以是Ext.window.Window
			title:'第'+i+'个窗口',
			id:'win_'+i,//窗口的ID，尽量不要直接用数字表示
			width:300,
			height:300,
			renderTo:Ext.getBody()
		});
		win.show();//显示窗口
		wingroup.register(win);//可参考API
		/* register( Ext.Component comp )
		 * 通过ZIndexManager登记一个浮动Ext.Component。 
		 * 在正常情况下，这个应该不需要被调用。 
		 * 浮动组件(如理Windows，BoundLists和Menus)在渲染的同时在zIndexManager中自动注册。
		 * */
	}
	//下面添加一些按钮来对WindowGroup（也叫ZIndexManager）的主要方法进行介绍
	//隐藏所有组件
	var btn1=Ext.create('Ext.Button',{
		text:'全部隐藏',
		renderTo:Ext.getBody(),
		handler:function()//按钮点击的处理函数
		{
			wingroup.hideAll();//隐藏所有被管理的组件
		}
	});
	//显示所有组件
	var btn2=Ext.create('Ext.Button',{
		text:'全部显示',
		renderTo:Ext.getBody(),
		handler:function()//按钮点击的处理函数
		{
			wingroup.each(function(cmp){//显示所有被隐藏的组件
				cmp.show();
			});
		}
	});
	//添加新的组件
	var winn=Ext.create('Ext.Window',{//也可以是Ext.window.Window
			title:'这是新窗口',
			width:300,
			height:300,
			renderTo:Ext.getBody()
		});
	winn.show();//显示窗口
	var btn3=Ext.create('Ext.Button',{
		text:'添加新窗口',
		renderTo:Ext.getBody(),
		handler:function()//按钮点击的处理函数
		{
			wingroup.addMembers(winn);
		}
	});
	//将指定组件放到任何其他活动组件的前面在这个ZIndexManager
	var btn4=Ext.create('Ext.Button',{
		text:'将第1个组件移动到最前面',
		renderTo:Ext.getBody(),
		handler:function()//按钮点击的处理函数
		{
			wingroup.bringToFront('win_1');
		}
	});
	//将组件放到最后面
	var btn4=Ext.create('Ext.Button',{
		text:'将第5个组件移动到最后面',
		renderTo:Ext.getBody(),
		handler:function()//按钮点击的处理函数
		{
			wingroup.bringToFront('win_5');
		}
	});
	//将组件放到最后面
	var btn5=Ext.create('Ext.Button',{
		text:'将组件从windowgroup中移出',
		renderTo:Ext.getBody(),
		handler:function()//按钮点击的处理函数
		{
			wingroup.unregister(winn);//解除绑定之后该组件不会被销毁
		}
	});
	
});

运行结果：

（1）初始运行结果：添加了5个window窗口