学习ExtJS（五） Window常用方法

最新推荐文章于 2021-04-29 09:34:38 发布

转载最新推荐文章于 2021-04-29 09:34:38 发布 · 4.4k 阅读

文章标签：

#extjs #function #button #layout

extjs 专栏收录该内容

22 篇文章

订阅专栏

本文介绍 Ext.Window 组件的各种配置属性，包括布尔类型的 plain、resizable 等，以及 show、hide 和 close 方法与事件。通过一个登录窗口的实例展示了如何设置这些属性并监听相关事件。

一、属性

plain：布尔类型，true表示强制与背景色保持协调，默认值为false。

resizable：布尔类型，用户是否可以调整窗体大小，默认值为true表示可以调整大小。

maxinizable：布尔类型，true表示显示最大化按钮，默认值为false。

maximized：布尔类型，true表示显示窗体时将窗体最大化，默认值为false。

closable：布尔类型，true表示显示关闭按钮，默认值为true。

bodyStyle：与边框的间距，如：bodyStyle:"padding:3px"。

buttonAlign：窗体中button的对齐方式(left、center、right)，默认值为right。

closeAction："close"释放窗体所占内存，"hide"隐藏窗体，建议使用"hide"。

二、方法

show：打开窗体。

hide：隐藏窗体。

close：关闭窗体。

三、事件

show：打开窗体时触法。

hide：隐藏窗体时触法。

close：关闭窗体时触法。

四、应用举例

Ext.onReady(function(){
       var _window=new Ext.Window({
             title:"登陆",
             renderTo:Ext.getBody(),
             frame:true,
             plain:true,
             resizable:false,
             buttonAlign:"right",
             closeAction:"hide",
             maximizable:true,
             closable:true,
             bodyStyle:"padding:4px",
             width:310,
             height:230,
             layout:"form",
             lableWidth:45,
             defaults:{xtype:"textfield",width:180},
             items:[{fieldLabel:"帐号"},{fieldLabel:"密码"}],
             buttons:[{text:"确定"},{text:"取消",handler:function(){_window.hide();}}],
             listeners:{
               "show":function(){
                  alert("显示");
               },
               "hide":function(){
                  alert("隐藏");
                  },
               "close":function(){
                  alert("关闭");
               }
             }

             })
       _window.show();
    })