Ext.MessageBox 大集合 不同的dialog图解加写法 出自example

我们知道在Ext中有很多漂亮的dialog，如何做出来在Ext中原带的example中有写。但是为了以后方便用，特写这样一篇博文
以下是效果图和代码还有部分注释，
大家根据自己需要略加修改就好:

1、alert对话框
效果图:

代码:

function a1(){
//alert案例
Ext.MessageBox.alert('title','text');
}

2、confirm案例，确定不确定2个按钮对话框

效果图:

代码:

Ext.MessageBox.confirm('title','warn test',showres);
function showres(btn){   //传入btn
alert(btn);
}

3、prompt案例,带有输入框的对话框

效果图:

代码:

function p1(){
Ext.MessageBox.prompt('title','请输入一些文档',showrestxt);
}
function showrestxt(btn,text){
alert(btn);
alert(text);
}

4、带有输入框的对象框show

效果图:

代码:

function s1(){
//可以写带有图片的确认框,自定义确认框
Ext.MessageBox.show({
          title: 'Address',
          msg: 'Please enter your address:',
          width:300,
          buttons: Ext.MessageBox.OKCANCEL,   //or   Ext.MessageBox.OKNOCANCEL,
          multiline: true,
          fn: showrestxt
      });
}

5、progress进度条的show对话框

效果图:

代码:

//进度条对话框
function s2(){
Ext.MessageBox.show({
          title: 'Please wait',
          msg: 'Loading items...',
          progressText: 'Initializing...',
          width:300,
          progress:true,
          closable:false
      });
      
       // this hideous block creates the bogus progress 进度条程序
      var f = function(v){
           return function(){
               if(v == 12){
                   Ext.MessageBox.hide();
                   Ext.example.msg('Done', 'Your fake items were loaded!');
               }else{
                   var i = v/11;
                   Ext.MessageBox.updateProgress(i, Math.round(100*i)+'% completed');
               }
          };
      };
      for(var i = 1; i < 13; i++){
          setTimeout(f(i), i*500);
      }
}

6、保存对话框带进度对话框（图片文件未加入）

效果图:

代码:

/下载时候图像的对话框
function downl(){
Ext.MessageBox.show({
          msg: 'Saving your data, please wait...',
          progressText: 'Saving...',
          width:300,
          wait:true,
          waitConfig: {interval:200},
          icon:'ext-mb-download', //custom class in msg-box.html
          animEl: 'mb7'
      });
       setTimeout(function(){
           //This simulates a long-running operation like a database save or XHR call.
           //In real code, this would be in a callback function.
           Ext.MessageBox.hide();
           Ext.example.msg('Done', 'Your fake data was saved!');
       }, 8000);
}