ExtJs的expand和collapse

时间:2022-01-15 00:10:45

最近在研究ExtJs的窗口组件(Ext.window),关于扩展显示expand和折叠显示collapse的一点心得记录一下,以便后查。

        var win2 = new Ext.window({
id : "TestWin",
panelLayout: 'fit',
resizable: true,
modal : false,
collapsible :true,
collapseDirection:'top',
title : "TEST",
innerItems : pnlInner,
buttons : [
],
listeners :{
collapse : function(){
this.setPosition(x,y);
},
expand: function(){
this.center();
},
close :function(){ }
}
});

点击下图右上角的双箭头钮,就可以在expand和collapse之间随时切换显示。只要把window的collapsible属性设置成true,这个按钮就可以显示出来。

在expand显示时,自定义的操作可以放在listener的expand函数里。

在collapse显示时,自定义的操作可以放在listener的collapse函数里。

1,expand显示

ExtJs的expand和collapse

2,collapse折叠显示

ExtJs的expand和collapse