1 Ext.onReady(function(){
2 //ex003:用windowGroup对象去操作多个window窗口
3 var wingroup = new Ext.WindowGroup();
4 for(var i = 1 ; i <=4;i++){
5 var win = Ext.create('Ext.Window',{
6 title:'第' + i + '个窗口' ,
7 id:'win_' + i ,
8 constrain:true ,
9 width:300 ,
10 height:300 ,
11 x:320*(i-1),
12 y:100,
13 //minimizable:true,
14 maximizable:true,
15 listeners:{
16 "minimize":function(win, opts){
17 win.collapse();
18 //this.hide();
19 },
20 "close":function(win, opts){
21 alert('宽：'+win.getWidth()+' 高：'+win.getHeight());
22 }
23 },
24 html:"<img id='img_win_"+i+"' src='extjs/img/20170327132943.png'/>",
25 renderTo:Ext.getBody()
26 });
27
28 win.minimize = function(e){
29 this.hide();
30 };
31 win.show();
32
33 wingroup.register(win); //把窗体对象注册给ZindexManger
34 }
35 for(var i = 5 ; i <=8;i++){
36 var win = Ext.create('Ext.Window',{
37 title:'第' + i + '个窗口' ,
38 id:'win_' + i ,
39 constrain:true ,
40 width:300 ,
41 height:300 ,
42 x:320*(i-5),
43 y:420,
44 resizable:true, //是否可以改变窗口大小
45 //minimizable:true, //窗口最小化
46 maximizable:true, // 窗口最大化
47 html:"<img id='img_win_"+i+"' src='extjs/img/u=3516058194,542182021&fm=23&gp=0.jpg' style='width:300px;height:300px;'/>",
48 listeners:{
49 "minimize":function(win, opts){
50 win.collapse();
51 //this.hide();
52 }
53 },
54 renderTo:Ext.getBody()
55 });
56
57 win.show();
58
59 wingroup.register(win); //把窗体对象注册给ZindexManger
60 }
61
62 var btn1 = Ext.create('Ext.button.Button',{
63 text:'全部隐藏' ,
64 renderTo:Ext.getBody(),
65 handler:function(){
66 wingroup.hideAll(); //隐藏所有被管理起来的window组件
67 }
68 });
69
70 var btn2 = new Ext.button.Button({
71 text:'全部显示' ,
72 renderTo:Ext.getBody(),
73 handler:function(){
74 wingroup.each(function(cmp){
75 cmp.show();
76 });
77 }
78 });
79
80 var btn3 = new Ext.button.Button({
81 text:'把第三个窗口显示在最前端' ,
82 renderTo:Ext.getBody(),
83 handler:function(){
84 wingroup.bringToFront('win_3'); //把当前的组件显示到最前端
85 }
86 });
87
88
89 var btn4 = new Ext.button.Button({
90 text:'把第五个窗口显示在最末端' ,
91 renderTo:Ext.getBody(),
92 handler:function(){
93 wingroup.sendToBack('win_5'); //把当前的组件显示到最后
94 }
95 });
96
97 var btn5 = new Ext.button.Button({
98 text:'获取信息' ,
99 renderTo:Ext.getBody(),
100 handler:function(){
101 wingroup.each(function(cmp){
102 var id = '#'+cmp.getId();
103 alert(cmp.getId()+' 宽：'+cmp.getWidth()+' 高：'+cmp.getHeight()+ ' left：'+$(id).position().left + 'px top：'+$(id).position().top+'px html：'+cmp.body.dom.innerHTML);
104 });
105 }
106 });
107
108
109
110 });
