Ext.js学习笔记【2】.window

首先介绍一些ext.window:

• Ext.window.Window

对于组件，也就是Ext最吸引开发者的地方，那么我们要真正的使用Ext的组件，首先必须学会阅读API文档。

xtype：组件的别名

hierarchy 层次结构

Inherited mixins混入的类

requires 该组件需要使用的类

configs：组件的配置信息

properties：组件的属性

methods：组件的方法

events：组件的事件

window组件常用属性和方法讲解:

configs: constrain:布尔值，

true为限制窗口只能在其容器内移动，默认值为false，允许窗口在任何位置移动。(另：constrianHeader属性)

modal:布尔值，true为设置模态窗口。默认为false

plain：布尔值，true为窗口设置透明背景。

false则为正常背景，默认为false x、y 设置窗口左上角坐标位置。

onEsc：复写onEsc函数，默认情况下按Esc键会关闭窗口。

closeAction：string值，默认值为'destroy'，可以设置'hide'关闭时隐藏窗口

autoScroll：布尔值，是否需要滚动条，默认false

Ext.onReady(function(){

    //Ext.create方法相当于创建一个实例对象
    Ext.create('Ext.window.Window',{
        title:'我的第一个组件,window' ,
        width:400 ,     //Number型  也可以是字符串类型  width: '90%'
        height:300 ,
        layout:'fit' ,
        constrain:true ,        //限制窗口不超出浏览器边界
        modal:true ,            //设置一个模态窗口
        //plain:true ,
        icon:'js/extjs/icons/used/browser_window.png',                //字符串参数,图片的路径
        //iconCls:'' ,           //CSS样式
        x:50 ,
        y:50 ,
        autoScroll:true,        //添加滚动条
        html:'<div style=width:200px;height:200px>我是一个div</div><div style=width:200px;height:200px>我是第二个div</div>' ,
        //constrainHeader:true,    //不允许该窗口的title超出浏览器边界
        renderTo:Ext.getBody()    //新创建的组件 渲染到什么位置
    }).show();
        
    
});