此文来记录学习笔记
•第一个组件: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
•properties 属性
•methods 方法
•events 事件
附上栗子代码
1 Ext.onReady(function () { 2 //Ext.create方法相当于创建一个实例对象 3 Ext.create(‘Ext.window.Window‘, { 4 title: ‘我的第一个组件,window‘, 5 width: 400, //Number型 也可以是字符串类型 width: ‘90%‘ 6 height: 300, 7 layout: ‘fit‘, 8 constrain: true, //限制窗口不超出浏览器边界 9 modal: true, //设置一个模态窗口 10 //plain:true , 11 icon: ‘JS/Ext/icons/used/browser_window.pngg‘, //字符串参数,图片的路径 12 //iconCls:‘‘ , //CSS样式 13 x: 50, 14 y: 50, 15 autoScroll: true, //添加滚动条 16 html: ‘<div style=width:200px;height:200px>我是一个div</div><div style=width:200px;height:200px>我是第二个div</div>‘, 17 //constrainHeader:true, //不允许该窗口的title超出浏览器边界 18 renderTo: Ext.getBody() //新创建的组件 渲染到什么位置 19 }).show(); 20 21 });
给各位推荐个文章网www.fishcmonkey.com,学习之余提高文学修养