Ext JS学习第五天 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
•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,学习之余提高文学修养
每天进步一点点 个人网址
posted on 2014-08-21 22:11 code&monkey 阅读(1780) 评论(2) 编辑 收藏 举报
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步