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 触发录入项
如果要使输入域为密码类型可以使用
inputType: 'password'
如果:
{xtype:'textfield',inputType: 'password',fieldLabel: '密码',name: 'PASSWORD',allowBlank:false,anchor:'95%'}
分享到:
相关推荐
在 Ext 中,xtype 和 vtype 是两个非常重要的概念,它们分别用于定义组件的类型和验证规则。 xtype 是 Ext 中的一种组件类型,它定义了组件的行为和外观。Ext 提供了许多内置的 xtype,例如 button、textfield、...
Xtype在Ext JS中扮演着至关重要的角色,它是组件类型的标识符,允许开发人员通过简单的字符串引用来实例化复杂的UI组件。 #### 组件生命周期与Xtype的关系 每个Ext JS组件,无论多复杂,都是从`Component`基类派生...
`xtype`是Sencha框架(如Ext JS和Sencha Touch)中用于组件类型的扩展名,它允许开发者通过一个简短的字符串来创建各种组件。这种机制极大地简化了代码,使得开发人员能够快速地构建复杂且功能丰富的用户界面。 ###...
### ExtJS xtype 类型概述 在ExtJS框架中,`xtype`是一种用于标识特定组件类型的简短字符串,便于在配置对象中快速定义组件。本文将深入探讨ExtJS中的各种`xtype`类型,帮助开发者更好地理解并运用这些组件。 ####...
在EXT框架中,`xtype`是一个至关重要的概念,它主要用作组件(Component)的类型标识符。`xtype`允许开发者以一种轻量级的方式引用和使用组件,而不是直接实例化完整的类对象,从而提高了性能和内存管理效率。在深入...
`xtype` 是ExtJS中的一个重要概念,它是组件类的简写形式,用于在配置对象中声明组件类型,使得代码更加简洁。理解并掌握ExtJS的各种`xtype`可以帮助开发者快速构建复杂的用户界面。 1. **基本组件**: - `button`...
在EXTJS中,`xtype`是一个关键的概念,它用来定义组件的类型或类。`xtype`是EXTJS中组件的简写形式,可以理解为组件的标识符,用于创建组件实例时引用已定义的组件类。通过使用`xtype`,开发者可以简化代码,减少...
### Ext组件概述与详解 #### 一、Ext基础组件 **1.1 Box Component (Ext.BoxComponent)** - **xtype**: `box` - **功能描述**:Box Component 是一个非常基本的 Ext 组件,主要用于定义具有边框和其他布局属性的...
在Extjs开发过程中,`xtype`(扩展类型)是极为重要的一个概念。它实际上是一种类型标识符,用于快速创建特定类型的组件实例。通过使用预定义的`xtype`值,开发者可以方便地构建出各种复杂的用户界面而无需编写大量...
在ExtJs框架中,`xtype`是用于定义组件类型的扩展类型。这是一种简化的组件标识方式,使得开发者可以更方便地在配置文件或代码中指定组件类型,而无需完整地写出对应的类名。下面,我们将根据提供的内容对ExtJs中的...
根据给定的信息,本文将详细解释“Ext 添加功能form表单实例”的知识点,这主要针对Ext初学者。本文会从创建表单、字段定义、验证规则以及提交逻辑等方面进行深入探讨。 ### Ext 添加功能form表单实例 #### 表单...
在ExtJs框架中,`xtype`是一种用于标识组件类型的字符串,它定义了组件的类。这个特性使得在创建UI时能够简洁地指定组件的类型,而无需直接实例化具体的类。以下是一些主要的`xtype`及其对应的组件类和功能的详细...
根据项目需求,可以选择合适的版本和许可证类型。 3. **设置HTML文件**: 创建一个基本的HTML文件,引入EXT库。在`<head>`标签中添加EXT的CSS和JS文件链接,通常是`ext-all.css`和`ext-all.js`。 4. **启动开发工具...
在ExtJS中,`xtype` 是组件(Component)的标识符,它定义了组件的类型。`xtype` 类似于HTML中的元素标签,但针对ExtJS的组件体系。它们是轻量级的,用于创建组件实例时引用预定义的组件类。`xtype` 与对应的`class`...
- 要在Grid中显示图片,我们需要创建一个自定义的列类型,这通常通过扩展EXT JS的Column类来实现。 - 自定义列需要重写`renderer`函数,这个函数负责将数据转化为可渲染的HTML。 3. **图片数据的处理** - 图片...
3. **自定义vtype**:EXT JS允许开发人员创建自定义验证类型。这通常通过扩展`Ext.form.field.VTypes`类来完成,然后在vtype属性中使用新创建的函数名。例如,如果你需要验证一个密码强度,可以创建一个新的vtype并...
每个组件都有一个`xtype`属性,用于标识组件类型。组件体系大致分为三类:基本组件、工具栏组件和表单及元素组件。其中,基本组件包括Box、Button、ColorPalette、Component、Container等,工具栏组件如Toolbar、...
`pluginConfig`对象用于传递给插件,`type: 'yearmonth'`指定了我们要使用的插件类型。 这个插件的工作原理是修改DateField原有的选择界面,使其仅显示年份和月份的选项,通常会通过一个下拉菜单或者弹出的日历面板...
3. **验证**:EXT提供了内置的验证功能,可以设置`vtype`属性来进行简单的类型验证,比如邮箱、电话号码等。例如,验证邮箱格式: ```javascript var emailField = new Ext.form.TextField({ fieldLabel: '邮箱', ...