Viewport Viewport

　　代表整个浏览器窗口，直接渲染到document.body节点，取代页面中的所有内容。一般作为应用程序主界面.

随着浏览器显示区域的大小自动改变，一个页面中只能有一个ViewPort实例。

Ext.onReady(function(){

        new Ext.Viewport({
            layout: 'border',   //布局
            items:[{region:'north',title:'顶部工具Logo及Banner',height:100},
                   {region:'west',title:'菜单区',width: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{

    }
}

03_Ext_Viewport_Window_Dialog的更多相关文章

随机推荐

  1. WSGIweb框架--1

    from multiprocessing import Process import re import sys import socket #设置静态文件根目录 HTML_ROOT_DIR = '. ...

  2. 01、Mybatis快速入门

    MyBatis是一个支持普通SQL查询,存储过程和高级映射的优秀持久层框架.MyBatis消除了几乎所有的JDBC代码和参数的手工设置以及对结果集的检索封装.MyBatis可以使用简单的XML或注解用 ...

  3. c语言 内存管理

    动态内存是由程序员手动分配,不再使用时,一定记得释放内存. 静态内存是程序开始运行时由编译器分配的内存,它的分配是程序开始编译时完成的,不占用cpu资源.程序中的各种变量在编译源程序时就已经分配了内存 ...

  4. Java中的i=i++

    public class Demo_01 { public static void main(String[] args) { int a = 10; int b = 20; int i = 0; i ...

  5. html复选框

    1.添加复选框 <input type="checkbox" id="yc" name="yc" value="year&q ...

  6. 多线程编程学习一(Java多线程的基础).

    一.进程和线程的概念 进程:一次程序的执行称为一个进程,每个 进程有独立的代码和数据空间,进程间切换的开销比较大,一个进程包含1—n个线程.进程是资源分享的最小单位. 线程:同一类线程共享代码和数据空 ...

  7. 总结各种排序算法【Java实现】

    一.插入类排序 1.直接插入排序 思想:将第i个插入到前i-1个中的适当位置 时间复杂度:T(n) = O(n²). 空间复杂度:S(n) = O(1). 稳定性:稳定排序. 如果碰见一个和插入元素相 ...

  8. c# List集合中First、Last、Single方法使用

    操作符 如果源序列是空的 源序列只包含一个元素 源序列包含多个元素 First 抛异常 返回该元素 返回第一个元素 FirstOrDefault 返回default(TSource) 返回该元素 返回 ...

  9. mysql时间戳的获取

    时间戳函数:current_timestamp() 在此位置添加时间戳函数. 然后整体的写法就是下图这样: 根据当前时间戳更新有没有打钩将决定你的时间是什么时间(一个是数据完成写入的时间,一个时间戳回 ...

  10. alert执行顺序

    <p><span id="span1">Hello World!</span></p> <script type=" ...