写 ExtJs 相关代码多了就会用 xtype 的体会,下面是 ExtJs 中各组件的 xtype 与组
件类的对应表。不包括 Ext.ux 命名空间中扩展的组件。其实在 Ext API 文档中有此
列表,在 API 帮助中查找 Component 打该页面就能看到,
即:http://www.extjs.com/deploy/dev/docs/output/Ext.Component.html。
基本组件:
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 如何对组件进行管理下
面会进一步深入探究。
可用的vtype列表
alpha,alphanum,email,url
分享到:
相关推荐
ExtJS的xtype列表ExtJS的xtype列表ExtJS的xtype列表ExtJS的xtype列表ExtJS的xtype列表ExtJS的xtype列表ExtJS的xtype列表ExtJS的xtype列表
ExtJs组件类的对应表,很好的,分享给大家!!
ExtJs xtype一览ExtJs xtype一览ExtJs xtype一览
extjs中的xtype的所有类型介绍
ExtJS xtype class对照表
有关于ext的xtype,Ext.QuickTips.init(),几种extjs的vtype默认支持的验证
里面包含了所有extjs的一些xtype的class的对照说明
Extjs表单VTYPE扩展,方便验证!
[09]EXTJS4.0的core包和Ext类.003.zip (60.22M)[09]EXTJS4.0的core包和Ext类.002.zip [09]EXTJS4.0的core包和Ext类.001.zip 第十讲:extjs4.0的util包 [10]EXTJS4.0的util包.001.zip (80.00M)[10]EXTJS4.0的...
extjs时间日期选择组件.
ExtJS4下拉树组件 ExtJS4下拉树组件
extjs 开发中遇到的xtype值,此文挡包含了extjs中的全部xtype值
只是简单的了解加入组件的数据类型:例如 textfield 就是有标签的文本框,用户名:XXX XXX代表文本框。
漂亮的Extjs图片展示组件实例,类似于幻灯片,可直接拿去用,非常不错的哦
中英文对照,理解更容易,是一个不错的参考文档
[09]EXTJS4.0的core包和Ext类.003.zip (60.22M)[09]EXTJS4.0的core包和Ext类.002.zip [09]EXTJS4.0的core包和Ext类.001.zip 第十讲:extjs4.0的util包 [10]EXTJS4.0的util包.001.zip (80.00M)[10]EXTJS4.0的...
第九讲: EXTJS4.0的Core包和Ext类 第十讲: EXTJS4.0的Util包 ***************第二部分高级组件**************** 第十一讲: EXTJS4.0的高级组件Grid(上) 第十二讲: EXTJS4.0的MVC重构十一讲中的Grid(中) 第十三讲: ...
这里主要介绍了ExtJS常用组件的样式修改,包括工具栏样式修改、菜单样式修改、树形菜单样式修改、表格样式修改、按钮样式修改等。
[09]EXTJS4.0的core包和Ext类.003.zip (60.22M)[09]EXTJS4.0的core包和Ext类.002.zip [09]EXTJS4.0的core包和Ext类.001.zip 第十讲:extjs4.0的util包 [10]EXTJS4.0的util包.001.zip (80.00M)[10]EXTJS4.0的...