一聚教程网:一个值得你收藏的教程网站

最新下载

热门教程

extjs4中Ext.window.Window窗口控件的介绍

时间:2011-12-20 编辑:简简单单 来源:一聚教程网

下面看看面板生成代码:

[html] 
 

 代码如下 复制代码
  

窗口


   

   
       

   

[Js]

 代码如下 复制代码

Ext.onReady(function () {
    var window1 = Ext.create('Ext.window.Window', {
        applyTo: 'win1',
        layout: 'table',            //内部元素布局方式{absolute accordion anchor border card column fit form table}
        width: 500,
        height: 200,
        closeAction: 'hide',        //窗口关闭的方式:hide/close
        plain: true,
        title: "窗口标题",
        maximizable: true,          //是否可以最大化
        minimizable: true,          //是否可以最小化
        closable: false,            //是否可以关闭
        modal: true,                //是否为模态窗口
        resizable: false,           //是否可以改变窗口大小
        items: [{
            text: '按钮',
            xtype: "button"
        }, {
            width: 214,
            minValue: 0,
            maxValue: 100,
            value: 50,
            xtype: "slider"
        }, {
            xtype: "button",
            text: '一个菜单',
            width: "60px",
            height: "15px",
            menu: {
                items: [
                            new Ext.ColorPalette({
                                listeners: {
                                    select: function (cp, color) {
                                        Ext.Msg.alert('颜色选择', '你选择了' + color + '。');
                                    }
                                }
                            }), '-',
                            { text: '菜单项1' }, { text: '菜单项2' }, { text: '菜单项3' }
                        ]
            }
        }],

        buttons: [{
            text: '确定',
            disabled: true
        }, {
            text: '取消',
            handler: function () {
                window1.hide();
            }
        }]
    });
    Ext.fly("button1").on("click", function () {
        window1.show(Ext.get("button1"));
    });
});


效果如下:

热门栏目