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 触发录入项
---------------------------------------
ExtJS xtype class对照表
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 触发录入项
---------------------------------------
基本组件：
xtype Class 描述
button Ext.Button 按钮
splitbutton Ext.SplitButton 带下拉菜单的按钮
cycle Ext.CycleButton 带下拉选项菜单的按钮
buttongroup Ext.ButtonGroup 编组按钮(Since 3.0)
slider Ext.Slider 滑动条
progress Ext.ProgressBar 进度条
statusbar Ext.StatusBar 状态条，2.2加进来，3.0 又去了
colorpalette Ext.ColorPalette 调色板
datepicker Ext.DatePicker 日期选择面板
---------------------------------------
容器及数据类组件
xtype Class 描述
window Ext.Window 窗口
viewport Ext.ViewPort 视口，即浏览器的视口，能随之伸缩
box Ext.BoxComponent 盒子组件，相当于一个 <div>
component Ext.Component 组件
container Ext.Container 容器
panel Ext.Panel 面板
tabpanel Ext.TabPanel 选项面板
treepanel Ext.tree.TreePanel 树型面板
flash Ext.FlashComponent 显示 Flash 的组件(Since 3.0)
grid Ext.grid.GridPanel 表格
editorgrid Ext.grid.EditorGridPanel 可编辑的表格
propertygrid Ext.grid.PropertyGrid 属性表格
editor Ext.Editor 编辑器
dataview Ext.DataView 数据显示视图
listview Ext.ListView 列表视图
---------------------------------------
工具栏组件：
xtype Class 描述
paging Ext.PagingToolbar 分页工具条
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 工具栏文本项
---------------------------------------
菜单组件：
xtype Class 描述
menu Ext.menu.Menu 菜单
colormenu Ext.menu.ColorMenu 颜色选择菜单
datemenu Ext.menu.DateMenu 日期选择菜单
menubaseitem BaseItem
menucheckitem Ext.menu.CheckItem 选项菜单项
menuitem Ext.menu.Item
menuseparator Ext.menu.Separator 菜单分隔线
menutextitem Ext.menu.TextItem 文本菜单项
---------------------------------------
表单及表单域组件：
xtype Class 描述
form Ext.FormPanel/Ext.form.FormPanel 表单面板
checkbox Ext.form.Checkbox 多选框
combo Ext.form.ComboBox 下拉框
datefield Ext.form.DateField 日期选择项
timefield Ext.form.TimeField 时间录入项
field Ext.form.Field 表单字段
fieldset Ext.form.FieldSet 表单字段组
hidden Ext.form.Hidden 表单隐藏域
htmleditor Ext.form.HtmlEditor HTML 编辑器
label Ext.form.Label 标签
numberfield Ext.form.NumberField 数字编辑器
radio Ext.form.Radio 单选按钮
textarea Ext.form.TextArea 多行文本框
textfield Ext.form.TextField 表单文本框
trigger Ext.form.TriggerField 触发录入项
checkboxgroup Ext.form.CheckboxGroup 编组的多选框(Since 2.2)
displayfield Ext.form.DisplayField 仅显示，不校验/不被提交的文本框
radiogroup Ext.form.RadioGroup 编组的单选按钮(Since 2.2)
---------------------------------------
图表组件：
xtype Class 描述
chart Ext.chart.Chart 图表组件
barchart Ext.chart.BarChart 柱状图
cartsianchart Ext.chart.CartesianChart
columnchart Ext.chart.ColumnChart
linechart Ext.chart.LineChart 连线图
piechart Ext.chart.PieChart 扇形图
---------------------------------------
数据集 Store：
xtype Class 描述
arraystore Ext.data.ArrayStore
directstore Ext.data.DirectStore
groupingstore Ext.data.GroupingStore
jsonstore Ext.data.JsonStore
simplestore Ext.data.SimpleStore
store Ext.data.Store
xmlstore Ext.data.XmlStore
---------------------------------------
另外：关于 ExtJs 如何依据 xtype 创建对应组件这里只简单的说一句，ExtJs 的组件是通过 Ext.ComponentMgr 来管理的，组件类会以 xtype 为 key 注册到 ComponentMgr 中，用 xtype 形式时就通过 ComponentMgr 来创建 xtype 对应的组件。ComponentMgr 如何对组件进行管理下面会进一步深入探究。
假如想要获得 xtype 与组件最完整的列表，有两种办法：
1. ExtJs 运行后，遍历 ComponentMgr 的 types{} 哈稀属性，这个属性是私有的，需改源代使之为公有，存储结构为{button:Ext.Button, cycle:Ext.CycleButton}
2. 用 grep 从 ExtJs 源代码中搜寻出来。在组件的 JS 代码(如 Button.js) 中会用 Ext.reg('button', Ext.Button) 形式注册，所以下面我用移植到 Windows 上的 GNU grep 程序从源代码中扒出所有的 xtype 及对应的组件类来。
分享到：
相关推荐
`xtype` 与对应的`class` 关联，`class` 是组件的实际JavaScript类，包含组件的完整功能和行为。 以下是一些主要的ExtJS `xtype` 和其对应的`class`： 1. **面板（Panel）** - `xtype: 'panel'` 对应的类是 `Ext....
`xtype`是EXTJS中组件的简写形式，可以理解为组件的标识符，用于创建组件实例时引用已定义的组件类。通过使用`xtype`，开发者可以简化代码，减少重复，并提高代码的可读性和维护性。 例如，当你想要创建一个按钮，...
### ExtJS xtype 类型概述 在ExtJS框架中，`xtype`是一种用于标识特定组件类型的简短...以上是ExtJS中主要的`xtype`类型及其对应类的概述。通过对这些组件的理解和掌握，开发者可以更高效地构建复杂的Web应用程序。
在ExtJs框架中，`xtype`是用于定义组件类型的扩展类型。这是一种简化的组件标识方式，使得开发者可以更方便地在配置文件或代码中指定组件类型，而无需完整地写出对应的类名。下面，我们将根据提供的内容对ExtJs中的...
在ExtJs框架中，`xtype`是一种用于标识组件类型的字符串，它定义了组件的类。这个特性使得在创建UI时能够简洁地指定组件的类型，而无需直接实例化具体的类。以下是一些主要的`xtype`及其对应的组件类和功能的详细...
以上就是ExtJS中一些主要的`xtype`及其对应组件的介绍。通过灵活组合这些组件，开发者可以创建出各种复杂的用户界面，满足不同业务需求。在实际开发中，可以根据具体应用场景选择合适的`xtype`，并根据需要配置其...
EXTJS中的浮动组件（Floating Components）是一类特殊的组件，它们使用CSS绝对定位，脱离文档流，不参与容器布局。例如，Window组件默认就是浮动的，而任何组件都可以通过设置floating属性变为浮动组件。浮动组件常...
所有组件都继承自`Component`类，并拥有一个特定的`xtype`属性，用于标识组件的类型。例如，`xtype`为`'panel'`表示这是一个面板组件。 常见的组件及其对应的`xtype`包括： - `box`：具有边框属性的组件 - `button...
例如，当用户点击按钮创建一个新的组件时，ExtJS 会识别到 `xtype` 并知道应该实例化对应的类，如 `Ext.ux.MyGrid`，而不会在初始加载时就创建所有可能用到的组件实例。 **Ext.extend() 与组件扩展** `Ext.extend...
此外，这些图标还可以与ExtJS的皮肤系统结合，使得在整个应用中保持一致的视觉风格。 总之，"ExtJS icons（5000个extjs小图标）.zip"为ExtJS开发者提供了一个丰富的图标库，能够满足各种Web应用设计需求。通过合理...
在提供的实例源码中，我们看到的是如何在 EXTJS 中修改颜色的示例，具体涉及到 EXTJS 的 FormPanel 和 ComboBox 组件，以及自定义事件处理。 1. **FormPanel**： - `Ext.form.FormPanel` 是 EXTJS 中用于创建表单...
首先，我们需要了解ExtJS中的表单组件（`Ext.form.Panel`）。表单面板是承载输入字段和其他表单元素的容器。创建一个基本的表单，你可以这样写： ```javascript var formPanel = Ext.create('Ext.form.Panel', { ...
EXTJS组件通过xtype属性定义，这个属性值对应于组件的类型，使得开发者可以通过配置轻松创建和管理组件。EXTJS的组件化设计使得UI布局和功能模块化，便于维护和扩展。 总之，EXTJS以其强大的功能和良好的用户体验，...
在ExtJS中，图标通常与按钮、菜单项和其他UI元素关联，用于表示特定的功能或操作。这些图标可以通过CSS类名引用，每个类名对应一个预定义的SVG图像或者PNG图片。ExtJS提供了多种方式来设置图标的样式，包括`icon`, `...
以下是ExtJS3中常见组件的`xtype`及其对应的类名： - `box`: `Ext.BoxComponent` - `button`: `Ext.Button` - `buttongroup`: `Ext.ButtonGroup` - `colorpalette`: `Ext.ColorPalette` - `component`: `Ext....
在实际项目中，为了保持代码整洁，图标通常会存储在一个专门的目录下，然后在CSS文件中定义对应的类名，将图标与类名关联。这样，当需要改变图标或更新图标集时，只需要修改CSS，而无需改动JavaScript代码。 为了更...
在EXTJS中，下拉框（ComboBox）是一种常见的UI组件，常用于用户选择一个或多个预定义的选项。本篇文章将详细讲解如何在EXTJS中操作下拉框，以及如何获取用户选定的值。 首先，创建一个基本的EXTJS下拉框需要定义`...
在这个"5000个extjs小图标"的压缩包中，我们看到的是与ExtJS相关的图标资源，这些图标可能是用于定制ExtJS组件外观的重要元素。 1. **图标在UI设计中的作用**：图标是用户界面设计中的关键组成部分，它们以视觉方式...
在前端开发中，Extjs 是一款非常强大的 UI 框架，它提供了丰富的组件和便捷的开发方式，深受开发者们的喜爱。然而随着应用程序复杂度的提升，如何提高 Extjs 的性能成为了一个重要的课题。本文旨在针对具有一定 ...