Viewport Viewport
代表整个浏览器窗口，直接渲染到document.body节点，取代页面中的所有内容。一般作为应用程序主界面.
随着浏览器显示区域的大小自动改变，一个页面中只能有一个ViewPort实例。
Ext.onReady(function(){ new Ext.Viewport({ layout: 'border', //布局 items:[{region:'north',title:'顶部工具Logo及Banner',height:100}, {region:'west',title:'菜单区',200}, {region:'center',title:'主区域'}] }); });
Window
表示应用程序窗口，其实是一个浮动的层，直接调用show方法显示窗口，窗口有关闭按钮； 窗口的关闭直接调用close方法，窗口的隐藏使用hide方法； 使用modal属性来配置模式窗口
窗口有一个属性 closeAction来设置到底是close还是hide
应用程序创建窗口是比较耗资源的.
我们可以创建一个窗口池，以后用的时候拿过来直接使用.
Ext中提供的对话框Ext.MessageBox及Ext.Msg
Ext的对话框都封装在Ext.MessageBox类，该类还有一个简写形式即Ext.Msg，可以直接通过Ext.MessageBox或Ext.Msg类直接调用相应的对话框方法来显示漂亮的Ext对话框
alert prompt confirm wait progress show
<body> <a href="javascript:testAlert()">Ext对话框</a> <a href="javascript:testConfirm()">Ext确认框</a> <a href="javascript:testPrompt()">Ext输入框</a> <a href="javascript:testWait()">Ext等待对话框</a> <a href="javascript:testProgress()">Ext进度条</a> <a href="javascript:testShow()">Ext自定义对话框</a> </body>
function testAlert(){ Ext.MessageBox.alert("友情提示：","禁止攀爬!"); } // Ext.Msg 是 Ext.MessageBox的别名 function testConfirm(){ // 要取得Ext对话框的结果，使用回调函数 Ext.Msg.confirm('友情提示', '是否真的删除?:', function(btn){ if (btn == 'yes'){ Ext.Msg.alert("数据已经删除"); } }); } function testPrompt(){ Ext.Msg.prompt('友情提示', '请输入您的电话:', function(btn, text){ if (btn == 'ok'){ Ext.Msg.alert("您的电话:"+text); } }, this, //作用域,默认是window 50, // 输入框的高度，也可以设置为true 'awei' //默认值 ); } // 等待对话框 function testWait(){ var ret=Ext.MessageBox.wait("正在处理中，请稍候..."); //3秒后让该对话框消失 setTimeout(function(){ ret.hide(); },3000); } //进度条 function testProgress(){ var ret=Ext.MessageBox.progress("进度条...","正在处理"); var i=0; //每隔500毫秒更新进度条 var timer=setInterval(function(){ ret.updateProgress( i+=0.1, (i*100)+"%" ); },500); //结束时清理掉定时器 setTimeout(function(){ ret.hide(); clearInterval(timer); },10000); } //自定义对话框 function testShow(){ Ext.Msg.show({ title:'保存数据', msg: '请<font color="red">选择</font>操作?', //这里支持的是html buttons: Ext.Msg.YESNOCANCEL, fn: doSave, // animEl: 'elId', icon: Ext.MessageBox.QUESTION }); } function doSave(button,text){ if(button=='yes'){ Ext.Msg.alert("数据已经报存"); }else if(button=='no'){ }else{ } }
