|
在Ext.Viewport中动态添加删除panel (转载)
(2009-11-12 11:00:21)
今天一个朋友问，能不能在Viewport中动态添加删除panel?
刚听到的时候，感觉挺容易的啊，于是乎，写了下来，在Ext.Viewport中动态添加/删除panel的方法.
viewport代码如下：
01.
//-----------------------------布局操作begin-------------------------------
02.
var viewport = new Ext.Viewport({
03.
id:'viewport',
04.
layout:'border',
05.
items:[
06.
new Ext.BoxComponent(
07.
{
08.
id:'north-panel',
09.
region:'north',
10.
el: 'north',
11.
height:32
12.
}),
13.
{
14.
id:'south-panel',
15.
region:'south',
16.
contentEl: 'south',
17.
title:'下',
18.
split:true,
19.
height: 100,
20.
minSize: 100,
21.
maxSize: 200,
22.
collapsible: true,
23.
margins:'0 0 0 0',
24.
collapsed: true
25.
},
26.
{
27.
id:'east-panel',
28.
region:'east',
29.
title: '文件查询',
30.
split:true,
31.
width: 200,
32.
minSize: 200,
33.
maxSize: 200,
34.
collapsible: true,
35.
margins:'0 0 0 0',
36.
contentEl: 'east',
37.
collapsed: true
38.
},
39.
{
40.
id:'west-panel',
41.
region:'west',
42.
title:'文件夹',
43.
split:true,
44.
width: 200,
45.
minSize: 200,
46.
maxSize: 200,
47.
collapsible: true,
48.
margins:'0 0 0 0',
49.
layout:'fit',
50.
items: treepanel
51.
},
52.
{
53.
id:'center-panel',
54.
region:'center',
55.
title:'',
56.
layout:'fit',
57.
items:
58.
[
59.
gridpanel
60.
]
61.
}
62.
]
63.
});
64.
//-----------------------------布局操作end---------------------------------
现在要使用的是在center-panel中将gridpanel去掉，换成一个treepanel
于是乎，就写了如下代码：
var items=Ext.getCmp('center-panel').items;
for(var i=0;i<items.length;i++){
Ext.getCmp('center-panel).remove(items[i]);
}
var treePanel=new Ext.tree.TreePanel({....})
（treepanel 的定义看在Ext Tree分类中~，链接：Ext-tree专题）
然后：
Ext.getCmp('center-panel').add(treePanel).doLayout();
这样，就实现在了在Ext.Viewport中动态添加/删除panel的功能
|
|
转载
转播
