xtype就是一个代表类(Class)的标识名字。譬如,你有这个类,名字是Ext.ux.MyGrid。正常情况下你需要用这个名字来实例化这个类(创建类的对象)。
试想一下,你手头上的是一个大型的项目,为了响应用户的操作,程序里面包含者大量的对象(windows、forms、grids)。用户点击图标或按钮,就会新建一个窗体,窗体里面又有grid,最终在屏幕上渲染出来。
我们实例化所有对象是页面第一次加载后就进行的(程序代码第一次的运行)。在客户端内存 中,Ext.ux.MyGrid类的对象已经存在,等待用户的点击。 同样是这个grid,假设你上百个的实例,...是多么浪费宝贵的资源啊!很多grid其实用户未必会点击让它出现。
延时实例化
如果你使用xtype,那么在内存中的仅仅是一个配置项对象.
Ext2.0对框架进行了非常大的重构,其中最重要的就是形成了一个结构及层次分明的组件体系,由这些组件形成了Ext的控件,Ext组件是由 Component类定义,每一种组件都有一个指定的xtype属性值,通过该值可以得到一个组件的类型或者是定义一个指定类型的组件。
组件大致可以分成三大类,即基本组件、工具栏组件、表单及元素组件。
基本组件有:
xtype Class
------------- ------------------
box Ext.BoxComponent 具有边框属性的组件
button Ext.Button 按钮
colorpalette Ext.ColorPalette 调色板
component Ext.Component 组件
container Ext.Container 容器
cycle Ext.CycleButton
dataview Ext.DataView 数据显示视图
datepicker Ext.DatePicker 日期选择面板
editor Ext.Editor 编辑器
editorgrid Ext.grid.EditorGridPanel 可编辑的表格
grid Ext.grid.GridPanel 表格
paging Ext.PagingToolbar 工具栏中的间隔
panel Ext.Panel 面板
progress Ext.ProgressBar 进度条
splitbutton Ext.SplitButton 可分裂的按钮
tabpanel Ext.TabPanel 选项面板
treepanel Ext.tree.TreePanel 树
viewport Ext.ViewPort 视图
window Ext.Window 窗口
工具栏组件有
---------------------------------------
toolbar Ext.Toolbar 工具栏
tbbutton Ext.Toolbar.Button 按钮
tbfill Ext.Toolbar.Fill 文件
tbitem Ext.Toolbar.Item 工具条项目
tbseparator Ext.Toolbar.Separator 工具栏分隔符
tbspacer Ext.Toolbar.Spacer 工具栏空白
tbsplit Ext.Toolbar.SplitButton 工具栏分隔按钮
tbtext Ext.Toolbar.TextItem 工具栏文本项
表单及字段组件包含:
---------------------------------------
form Ext.FormPanel Form面板
checkbox Ext.form.Checkbox checkbox录入框
combo Ext.form.ComboBox combo选择项
datefield Ext.form.DateField 日期选择项
field Ext.form.Field 表单字段
fieldset Ext.form.FieldSet 表单字段组
hidden Ext.form.Hidden 表单隐藏域
htmleditor Ext.form.HtmlEditor html编辑器
numberfield Ext.form.NumberField 数字编辑器
radio Ext.form.Radio 单选按钮
textarea Ext.form.TextArea 区域文本框
textfield Ext.form.TextField 表单文本框
timefield Ext.form.TimeField 时间录入项
trigger Ext.form.TriggerField 触发录入项
来源:http://hi.baidu.com/%D3%C5%D3%CE%D7%D4%B5%C3/blog/item/723e83d73320bbd5a144df76.html
分享到:
相关推荐
5. **兼容多种浏览器**:Ext 2.0在不同浏览器中的表现一致,降低了跨浏览器的兼容性问题。 ### 示例代码解析 #### 示例一:基本表格展示 这段代码可能展示了如何使用Ext 2.0创建一个简单的表格,其中包含了数据行...
在"Ext2.0js my first test"项目中,你可能会接触到一些基础的组件,例如创建一个简单的窗口或按钮。 `test.jsp`文件可能是这个项目中的主入口点,它是JavaServer Pages(JSP)文件,用于动态生成HTML内容。在JSP中...
在Ext2.0中,这些控件都可以方便地添加到FormPanel中,例如: ```javascript items: [ {xtype: 'textfield', fieldLabel: '姓名'}, {xtype: 'passwordfield', fieldLabel: '密码'}, {xtype: 'combobox', ...
EXT中的下拉列表组件(Select和Combo)展现了其灵活性和实用性。Select虽然不具备输入和定位功能,但Combo则可以读取并绑定到SELECT标签,甚至可以从远程获取数据,实现无刷新填充,这极大地提升了用户体验。此外,...
5. **EXT2.0组件体系**:EXT2.0引入了清晰的组件层次结构,组件由`Component`类定义,每个组件有一个特定的`xtype`属性,用于标识组件类型。组件分为基本组件、工具栏组件和表单及元素组件三类,涵盖了大量的常用UI...
在EXT_JS开发中,首先要在HTML页面中引入EXT_JS的样式表和JavaScript库文件。通常,这包括`extjs/resources/css/ext-all.css`用于样式,`extjs/adapter/ext/ext-base.js`作为适配器,以及`extjs/ext-all.js`包含EXT...
在本文中,我们将深入探讨ExtJS 2.0中的FormPanel组件,并通过具体的示例来了解如何使用不同的组件,如checkbox、radio以及htmleditor。首先,Ext.FormPanel是ExtJS中用于创建表单的主要组件,它允许我们构建复杂的...
### ExtJs2.0简明教程 #### 一、ExtJS简介 ExtJS是一款基于JavaScript的前端框架,它提供了一套完整的用户界面解决方案,能够帮助开发者快速构建高性能、跨浏览器的Web应用程序。ExtJS2.0是该框架的一个重要版本,...
或者,如果希望在窗口中显示内容,可以创建一个`Ext.Window` 实例,如下: ```javascript Ext.onReady(function() { var win = new Ext.Window({ title: "Hello", width: 300, height: 200, html: '<h1>Hello, ...
### ExtJs2.0入门实例知识点详解 #### 1. Ext.MessageBox ...以上是ExtJs2.0中的一些基础控件和方法的详细介绍,通过这些内容可以帮助初学者快速入门,并掌握如何使用这些控件进行Web应用程序开发。
这使得在配置文件中可以通过xtype来创建和引用组件,而不是直接实例化。 7. **EXTJS组件分类**: - **基本组件**:如Box、Button、Panel、Progress Bar等,它们是构建复杂UI的基础。 - **工具栏组件**:如Toolbar...
为了实现单元格编辑,我们需要在grid的配置中指定`plugins`属性,包含一个`Ext.grid.plugin.CellEditing`实例。在这个实例中,我们可以设置`clicksToEdit`属性来决定需要点击几次才能开始编辑,以及监听`edit`事件...
每个组件都有一个`xtype`属性,用于标识组件类型。组件体系大致分为基本组件、工具栏组件和表单及元素组件。例如: - 基本组件:Box、Button、ColorPalette、Component、Container等。 - 工具栏组件:Toolbar、...
此外,还要注意浏览器加载页面的差异,特别是对于Web 2.0应用,通常需要在DOM准备就绪后开始管理页面元素。 EXTJS的布局系统也是其强大之处,能够确保组件按照预定的方式进行排列和扩展。例如,`ContentBody`中的...