Ext.window用于创建window窗口,从外观上看和MessageBox相似,因为Ext.MessageBox内部也是基于Ext.Window实现的。以下就是实现Ext.Window创建和一些基本属性
el:用于设置存放Ext.window窗口的层。设置值为div的id值,需要在<body>之间创建<div id="aa"></div>的节点。
layout:设置内部控件显示样式,选项有:"fit“和"border“,其中fit只能显示一个子控件,且该子控件将填充整个window窗口,border可以显示多个子控件,常用于设置各个控件的布局。
width:设置窗口宽度。
height:设置窗口高度。
closeAction:用于设置点击右上角关闭按钮时所执行的命令,选项有"hide"和"close“,其中hide表示关闭窗口时执行隐藏命令,该窗口对象不被销毁,可以通过show()函数将其显示出来;close表示关闭窗口,该值为默认值,当执行close命令时,表时将窗口对象销毁,不能通过show()函数表示,只能进行重新创建。
items:[{控件1},{控件2}...],表示向窗口中添加控件,
buttons:[{按钮1},{按钮2}...],用于在窗口底端创建按钮,按钮创建方法:[{text:"按钮名称",handle:function(){ }}],其中handle表示当按下按钮时所执行的操作。同时也可以用于Ext.Panel中。
buttonAlign:left/center/right,表示buttons创建的按键显示的位置,分别表示左对齐,居中对齐,右对齐,默认为右对齐。
bbar:[{按钮1},{按钮2}...],用于创建底部工具按钮,用法和buttons一样。同时也可以用于Ext.Panel中
tbar:[{按钮1},{按钮2}...],用于创建底部工具按钮,用法同上。同时也可以用于Ext.Panel中
tools:[{按钮1},{按钮2}...],用于在窗口标题栏上创建按钮,创建方法[{id:"save",handler:function(){ },{id:"print",handler:function(){ },...}],其中id选项有save,print,help,close,minimize,maximize,restore,gear,pin,unpin,right,left,up,down,refresh,minus,plus,search。具体读者可以自行试。同时也可以用于Ext.Panel中。
maximizable:true/false,表示窗口右上角是否出现表示最大化按钮,当点击最大化按钮时,窗口将自动扩展以充满整个浏览器窗口,且最大化按钮将变成恢复原来大小的按键。该过程不需要自行设计相关函数。
minimizable:true/false,表示窗口右上角是否出现表示最小化按钮,与最大化不一样的地方就是Ext没有预设最小化函数,需自行定义。
constrain:true/false,表示用于限制窗口在移动时不得超出浏览器边界。
constrainHeader:true/false,表示用于限制窗口标题栏在移动时不得超出浏览器边界。
resizable:true/false,表示是否可以改变窗口大小。
modal:true/false,表示弹出窗口后,父窗口能否有效。