Alternate names
Ext.grid.PropertyGridHierarchy
Inherited mixins
Uses
Files
一个专门的grid实现，旨在模仿传统的通常在开发的IDE看到的grid， 以键/值对Properties的数据格式存储grid的每一行的属性，这些属性可以是一些对象。 用例:
Ext.create('Ext.grid.property.Grid', {
title: 'Properties Grid',
width: 300,
renderTo: Ext.getBody(),
source: {
"(name)": "My Object",
"Created": Ext.Date.parse('10/15/2006', 'm/d/Y'),
"Available": false,
"Version": 0.01,
"Description": "A test object"
}
});
子组件id 或者是子组件所在容器的索引 设置该属性的目的是设置那个子组件在最初显示的容器的布局上渲染. For example,
activeItem: 'itemId-1' or activeItem: 0 (容器中的第一个子组件).
activeItem 仅适用于布局样式 Ext.layout.container.Card and Ext.layout.container.Fit
并且一次只显示一个子组件。
定义容器的相对定位值.(参见类说明) 可以是一个数值来定义宽度, 也可以是一个含width, height的对象.
定义容器的相对定位值.(参见类说明) 可以是一个数值来定义宽度, 也可以是一个含width, height的对象.
true 将会在panel被折叠时使用动画效果，false 将会跳过动画效果( 默认为true 如果Ext.fx.Anim类有效， 否则为 false )。也可以设定动画的时间,以毫秒为单位，默认为Ext.enableFx。
true 将会在panel被折叠时使用动画效果，false 将会跳过动画效果( 默认为true 如果Ext.fx.Anim类有效， 否则为 false )。也可以设定动画的时间,以毫秒为单位，默认为Ext.enableFx。
如果为true，容器会自动销毁包含的任何组件被删除它，否则必须手动销毁。
Defaults to: true
一个标签名或者 DomHelper 描述，用来创建 Element ，它将封装当前组件。
一般情况下你不必指定此值。 对于基类 Ext.Component 和 Ext.container.Container, 此值默认为 'div'。 越复杂的sencha类使用越复杂的DOM结构， 这些是由它们自己的renderTpl方法创建的。
这被设计用来允许开发者创建针对特定应用的 工具组件，这些组件由不同的DOM元素封装而成。 示例用法:
{
xtype: 'component',
autoEl: {
tag: 'img',
src: 'http://www.example.com/example.jpg'
}
}, {
xtype: 'component',
autoEl: {
tag: 'blockquote',
html: 'autoEl is cool!'
}
}, {
xtype: 'container',
autoEl: 'ul',
cls: 'ux-unordered-list',
items: {
xtype: 'component',
autoEl: 'li',
html: 'First list item'
}
}
设置 True 组件创建时自动显示. 这个配置项可能仅仅用于 floating 组件或者组件使用 autoRender. 默认为false.
Defaults to: false
便利的配置。''Bottom Bar'的缩略形式。
bbar: [
{ xtype: 'button', text: 'Button 1' }
]
等价于
dockedItems: [{
xtype: 'toolbar',
dock: 'bottom',
items: [
{ xtype: 'button', text: 'Button 1' }
]
}]
添加或者移除面板body的border属性.这个仅仅适用于一个frame属性设为'true'的Panel。
默认undefined。
一个CSS类，空格分隔字符串的类，或者一组样式类被应用到Panel的body元素上。 下示例都是有效的:
bodyCls: 'foo'
bodyCls: 'foo bar'
bodyCls: ['foo', 'bar']
在body元素上设置padding样式的快捷方式。这个值可以是一个数字被应用到所有的边界，
或者是一个正规的CSS字符串用于设定padding。默认为undefined。
在body元素上设置padding样式的快捷方式。这个值可以是一个数字被应用到所有的边界，
或者是一个正规的CSS字符串用于设定padding。默认为undefined。
用户自定义CSS样式被应用到panel的body元素上，这个样式可以是一个有效的CSS样式串， 可以是一个包含样式属性名/值的对象或者是一个方法返回一个字符串或对象。 例如，这两种方式是等效的：
bodyStyle: 'background:#ffc; padding:10px;'
bodyStyle: {
background: '#ffc',
padding: '10px'
}
事件数组，当事件触发的时候，将会冒泡到父容器。 参见 Ext.util.Observable.enableBubble.
Defaults to: ["add", "remove"]
一个描述组件的子元素的数组. 数组的每个成员是这些属性的对象:
name - 组件的子元素的属性名称.itemId - ID结合组件的ID是子元素的ID.id - 子元素的id.如果数组成员是字符串, 它相当于 { name: m, itemId: m }.
例如, 组件呈现一个标题和正文:
Ext.create('Ext.Component', {
renderTo: Ext.getBody(),
renderTpl: [
'<h1 id="{id}-title">{title}</h1>',
'<p>{msg}</p>',
],
renderData: {
title: "Error",
msg: "Something went wrong"
},
childEls: ["title"],
listeners: {
afterrender: function(cmp){
// After rendering the component will have a title property
cmp.title.setStyle({color: "red"});
}
}
});
一个更灵活的, 但是有些慢, 方法是 renderSelectors.
该属性配置为true这个窗体的'close'工具按钮便会展现出来并且允许用户通过点击这个按钮来关闭这个窗体，false则相反。
默认情况下，当点击头部工具栏关闭按钮时，close方法将会被调用。这将_销毁 此Panel并且该Panel中的元素不能再被使用。
如果使Panel在关闭之后该Panel不被销毁只是隐藏以便之后再被调用，将 closeAction置为'hide'。
Defaults to: false
当折叠/展开切换按钮被单击的时候 Panel 的折叠方向。
默认设置 headerPosition
重要：这个配置当Panel作为直接子项设置了collapsible属性以 border 布局 时被忽略
指定为 'top', 'bottom', 'left' or 'right'.
'true'将会确保折叠/展开(collapse/expand)按钮总是被渲染在第一个位置， 在panel顶部的工具栏中位于任何其它工具左侧，'false'将会把它渲染在最后。默认为true。
Defaults to: true
重要: 这个配置仅仅在 Panel 以border 布局中存在子组件且配置了collapsible 属性时有效。
当直接子项拥有border 布局，并且 Panel 的头一直可见， 面板体被折叠为0.如果这个 Panel 没有头，一个新的头(正确的导向取决于collapseDirection)将被添加用于显示一个变体和重新展开的按钮。
When a child item of a border layout,这样的配置有两种选项: 当一个子项为border 布局，
Panel折叠后，一个被添加到Panel元素上的CSS类，默认为 collapsed。
Defaults to: "collapsed"
设置为true是panel具有可折叠功能并且有一个展开/折叠的切换按钮被添加到panel的标题头区域。设置为false则该panel的 大小是静态不可变的，后者被其自身的布局所管理，并且没有切换按钮。
参见 collapseMode 和 collapseDirection
Defaults to: false
添加列的框线样式
添加列的框线样式
Overrides: Ext.grid.Panel.columns
CSS 类被添加到组件根级别元素通过样式区别它.
CSS 类被添加到组件根级别元素通过样式区别它.
一个组件的内部元素的尺寸大小和定位是由组件的布局管理器决定的, 组件的布局管理器掌管着被衡量组件的内部结构.
一般来说, 开发者不会使用这个配置, 因为所有给定的需要制定尺寸大小的内部元素的组件 (比如 input fields) 是由其自身的组件布局管理器来决定的.
默认布局管理 将被用于基本类 Ext.Component 的实例上, 这个类将会简单地通过 setSize 方法来设置组件的封装元素的高度和宽度.
指定一个已存在的HTML元素, 或者一个已存在HTML元素的 id , 它们将被用作当前组件的内容.
此配置选项被用来将一个已存在的HTML元素 插入到一个新组件(在组件渲染之后它简单地移动DOM元素) 的layout元素中, 使它成为该组件的内容.
注意:
指定的HTML元素将被附加到组件的layout元素中, 在所有配置的 HTML 被插入之后, 并且, 这样的话, 在 render 事件被触发时, document中将不再包含此元素.
指定的 HTML 元素将不会参与所有的可能使用的 layout
过程. 它仅是 HTML 而已. 布局操作是在
items 上进行的.
添加 x-hidden 或者 x-hide-display 类, 以防在内容渲染到panel时发生闪烁.
一个包含键/值对的编辑对象，支持自定义类型的编辑字段。 默认情况下，grid支持强类型的字符串，日期，数字和布尔值使用内置的表单编辑器去编辑， 但是也可以通过指定自定义编辑器，可以支持任何自定义类型和自定义的输入控制。 编辑器类型的名称应与使用编辑器的属性的名称对应。 用例:
var grid = new Ext.grid.property.Grid({
// 自定义编辑器的某些属性名称
customEditors: {
evtStart: Ext.create('Ext.form.TimeField' {selectOnFocus:true})
},
// 在源代码中的属性名称的显示名称
propertyNames: {
evtStart: 'Start Time'
},
// 数据对象中包含的要编辑的属性
source: {
evtStart: '10:00 AM'
}
});
一个包含键/值对的渲染器对象，允许自定义渲染器的类型定义。 默认情况下，grid支持使用内置的表单编辑器的字符串，日期，数字和布尔值的强类型的渲染， 但可以支持任何自定义类型和相关的值的类型。渲染器的类型的名称应对应的属性的名称。 用例:
var grid = Ext.create('Ext.grid.property.Grid', {
customRenderers: {
Available: function(v){
if (v) {
return '<span style="color: green;">Yes</span>';
} else {
return '<span style="color: red;">No</span>';
}
}
},
source: {
Available: true
}
});
默认的dock权重 这个对象用来保存的默认的权重,没有设置权重的dockedItems使用默认的. 权重开始于1,允许负权重用来插入到top组件集合之前,权重都是奇数。 因此，权重可以被用来获得不同的dock顺序.
这样设置，让默认的dock顺序匹配border布局:
Ext.panel.AbstractPanel.prototype.defaultDockWeights = { top: 1, bottom: 3, left: 5, right: 7 };
在此对象上更改这些默认值或单独更改其中一个将会影响所有的面板。 若要更改默认并且应用到一个单一的面板上，开发者必须更换整个对象
initComponent: function () {
// 注意：不要更改defaultDockWeights成员，因为对象是共享的。
this.defaultDockWeights = { top: 1, bottom: 3, left: 5, right: 7 };
this.callParent();
}
To change only one of the default values, you do this:
initComponent: function () {
//注意：不要更改defaultDockWeights成员，因为对象是共享的。
this.defaultDockWeights = Ext.applyIf({ top: 10 }, this.defaultDockWeights);
this.callParent();
}
Defaults to: {top: {render: 1, visual: 1}, left: {render: 3, visual: 5}, right: {render: 5, visual: 7}, bottom: {render: 7, visual: 3}}
当一个子项目通过一个原生的配置对象而不是一个组件的实例指定时， 在当前容器中创建子组件时使用的默认 xtype，默认为 'panel'。
Defaults to: "panel"
此选项提供了为所有添加的组件上应用默认设置的途径, 这些属性要么是通过 items 配置项添加的， 或者是通过 add 或者是通过 insert 方法添加的
默认属性将会应用到所有的子组件上，但是不会覆盖子组件本身已经有的属性 (可以参见 Ext.applyIf).
如果默认选项被指定为一个函数， 那么将使用当前容器作为作用域来调用这个函数( this 引用)， 并且传递被添加的项目作为第一个参数。 调用产生的所有结果都将被作为默认参数应用到项目上。
例如，如需自动在 Ext.panel.Panel 所包含的每个子组件上应用padding属性， 你可以设置: defaults: {bodyStyle: 'padding:15px'} 。
用法:
defaults: { // defaults 将会应用所有的子组件上,而不是父容器
autoScroll: true
},
items: [
// panel1 已经存在 autoScroll: false 所以 defaults将不会应用
{
xtype: 'panel',
id: 'panel1',
autoScroll: false
},
// panel2 将会 autoScroll: true
new Ext.panel.Panel({
id: 'panel2'
})
]
默认为true，启用延迟渲染行。
这将允许视图快速地执行刷新，与昂贵的更新推迟， 以便与GridPanels的布局出现，并迅速布置更多的行结构。
True 当组件从该容器中移除detachedBody 将会真正移动到任何组件。 此选项只适用于容器不是被销毁的情况下，请参阅autoDestroy和remove。 如果这个选项被设置为false，DOM组件将保持在当前位置，直到它被明确地移动。
Defaults to: true
设置为true，则禁用选择模型。
Defaults to: false
当组件被禁用添加的CSS 类. 默认为 'x-item-disabled'.
Defaults to: "x-item-disabled"
一个或者一系列组件作为dockedItems被添加到Panel中。dockedItems可以被安置在Panel的上方，右方，左方或者下方。这通常 用于像toolbars或者tab bars:
var panel = new Ext.panel.Panel({
dockedItems: [{
xtype: 'toolbar',
dock: 'top',
items: [{
text: 'Docked to the top'
}]
}]
});
Overrides: Ext.panel.AbstractPanel.dockedItems
指定正确的使用组件的封装元件的拖动手柄进行floating 浮动组件拖动的。
这也可以被指定作为配置对象被实例化的ComponentDragger 执行拖动。
例如，创建一个组件，只能将它拖动周围使用某些内部元件的句柄， 使用委托选项：
new Ext.Component({
constrain: true,
floating: true,
style: {
backgroundColor: '#fff',
border: '1px solid black'
},
html: '<h1 style="cursor:move">The title</h1><p>The content</p>',
draggable: {
delegate: 'h1'
}
}).show();
Defaults to: false
Overrides: Ext.AbstractComponent.draggable
当Store为空时，使用默认文本(接受html标签)来显示在Panel的body区域。 当其指定后，并且Store依然为空，该文本具有CSS类"x-grid-empty"，被渲染到一个DIV中。
设置为false则禁用隐藏表格中的列。
Defaults to: true
设置为false来禁用拖动表格中的列。
Defaults to: true
设置为false来禁用表格中列的大小调节功能。
Defaults to: true
设置为true，则启用此表格的锁定支持。或者，如果任何一列的列配置中包含锁定的配置选项， 锁定也将会自动启用。
Defaults to: false
便利的配置用于为Panel底部添加子组件。作为Footer Bar的简写。
fbar: [
{ type: 'button', text: 'Button 1' }
]
等价于
dockedItems: [{
xtype: 'toolbar',
dock: 'bottom',
ui: 'footer',
defaults: {minWidth: minButtonWidth},
items: [
{ xtype: 'component', flex: 1 },
{ xtype: 'button', text: 'Button 1' }
]
}]
minButtonWidth属性被用于fbar中每个按钮minWidth的默认宽度。
要添加到该表格的一个关于表格特征的数组。关于其用法参见Ext.grid.feature.Feature。
要添加到该表格的一个关于表格特征的数组。关于其用法参见Ext.grid.feature.Feature。
重要：这个配置仅仅对于Panel的collapsible属性且其直接子项拥以border 布局时有效。 设置为true允许单击一个折叠的 Panel 的placeholder去展现Panel， 如果为false则强制用户充分扩大折叠的区域通过点击按钮将其再次展现。 默认为true。
Defaults to: true
指定为'true'的时候浮动组件以外的文档流中使用CSS绝对定位。
Ext.window.Window Window and Ext.menu.Menu Menu 组件默认情况下是浮动的.
浮动的组件编程方式将自己rendered注册到全局ZIndexManager
一个浮动的组件，也可以使用一个容器作为一个子项。这只是允许的浮动组件， This just allows the floating Component to seek a ZIndexManager by examining the ownerCt chain.
当配置为浮动，组件获取，在渲染时，一个ZIndexManager管理堆栈相关的浮动元件。 ZIndexManager带来一个单一的浮动组件组件toFront的方法被调用时，它的堆栈的顶部。
ZIndexManager通过遍历链找到一个被继承的ownerCt这本身就是浮动的。 这使子类浮动容器组件（如在一个窗口一个ComboBox下拉）可以有它的zIndex的管理 相对于任何同级节点，但始终高于浮动被继承的对象。
如果没有父类的浮动定义，浮动组件注册本身的默认 ZIndexManager.
在容器的布局，浮动组件不参与。正因为如此，他们都不会呈现，直到您明确。show
渲染后，父类浮动引用将被删除，该属性设置为找到的父类容器floatParent。 如果没有浮动的父类容器floatParent的属性 不会被删除.
Defaults to: false
Overrides: Ext.AbstractComponent.floating
设置为true，则强制列自适应成可用宽度。标题头部的尺寸首先根据配置来确定， 无论它被指定了一个width，或是flex。 然后，它们的宽度成比例地改变，以便采用内容的整个宽度。
True 为Panel的头部填充画面(如果该Panel的属性设置为true)
Defaults to: true
通过设置false来阻止Panel的标题头被创建与渲染，默认为undefined。
通过配置一个对象 (通过 xtype 来创建) 从而达到用户自定义 Panel 的标题头。
指定Panel头部的显示位置，配置可选'top'(上面), 'bottom'(下面), 'left'(左面)或者 'right'(右面)。
默认为 top 。
Defaults to: "top"
'true'将会在 collapsible == true 时隐藏展开/折叠按钮， false 将会显示它(默认为 false )。默认为false。
Defaults to: false
如果为true，则隐藏列的标题栏。
Defaults to: false
一个字符串，它指定了这个组件的封装DOM元素会被隐藏. 值可以是:
'display' : 使用 display: none 样式组件将被隐藏.'visibility' : 使用 visibility: hidden 样式组件将被隐藏.'offsets' : 组件定位在文档的可见区域之外将被隐藏.
当一个隐藏的组件必须保持可测量的这是有用的. 使用 display 将导致一个
组件不可测.Defaults to: "display"
当前组件实例唯一的ID。
它不应该是必要的，除了在你的应用程序使用这个配置单例对象。 用一个 id 创建的组件可以使用 Ext.getCmp 进行全局访问。
代替使用分配的id, 使用 itemId 配置项, 和 ComponentQuery 它提供了基于选择搜索Sencha组件类似于DOM查询。 Container 类包含 快捷方法 通过选择器查询子组件。
注意这个ID也将被用于包含HTML元素，在页面上呈现此组件的元素的ID。 这允许你写的基于ID的CSS规则让组件的特定实例风格独特， 也可以把这个组件作为父组件, 使用它的 id 来查找子元素。
注意: 为了避免与唯一的id 产生重复，请参见 itemId.
注意: 如需访问一个元素的容器，参见 ownerCt.
默认为 auto-assigned id.
当没有可利用的对象引用时，itemId可以作为第二选择，用来获得一个组件的引用。
代替 id 与 Ext.getCmp, 使用 itemId 与
Ext.container.Container.getComponent 将会获得
itemId's 或者 id's。 既然 itemId's 是一个到容器内部MixedCollection的索引，
itemId 的作用域就被限定在容器之内 -- 避免与 Ext.ComponentManager 产生潜在的冲突，
它需要一个 唯一 id.
var c = new Ext.panel.Panel({ //
height: 300,
renderTo: document.body,
layout: 'auto',
items: [
{
itemId: 'p1',
title: 'Panel 1',
height: 150
},
{
itemId: 'p2',
title: 'Panel 2',
height: 150
}
]
})
p1 = c.getComponent('p1'); // not the same as Ext.getCmp()
p2 = p1.ownerCt.getComponent('p2'); // reference via a sibling
也可以参见 id, Ext.container.Container.query, Ext.container.Container.down 和
Ext.container.Container.child.
注意: 需要访问一个item的容易请参见 ownerCt.
单个组件,或者是以数组形式定义的子组件集合 将会自动添加到容器中去
如果开发者没有配置layout属性， 默认是按顺序将子组件渲染到在容器中，不考虑子组件的大小和定位。
用法:
// 单个组件
items: {...},
layout: 'fit', // 布局设置为fit
// 多个子组件
items: [{...}, {...}],
layout: 'hbox', // 布局设置为hbox
每个子组件可以是:
如果子组件是指定的,它的实际组件的类型将根据xtype选项进行实例化. 每个组件都有各自的xtype.
如果没有指定 xtype, 那么将会使用
defaultType，默认是panel.
Ext使用延迟渲染的方式. 子组件只有在必要的时候渲染. 子组件第一次会自动布局(隐藏的时候不调整大小), 或者是响应一个doLayout布局.
布局 重要: 为了保证子组件的大小和位置,通常开发者需要进行布局管理， 必须 通过layout项进行配置。
子组件的大小和位置items是根据开发者的配置由布局管理器去创建和管理的。 例如:
如果不明确配置layout到通用容器上(Container or Panel)那么它将使用默认的布局 default layout manager只是将子组件按顺序放到容器中 (如果开发者不需要改变子组件的大小和位置)。
layout 可以指定为对象，或字符串:
用法:
layout: {
type: 'vbox',
align: 'left'
}
布局类型将会被容器使用,如果没有指定的话 默认使用布局类型Ext.layout.container.Auto.
有效的布局 <code>类型</code> 值:
- Auto - **默认**
- card
- fit
- hbox
- vbox
- anchor
- table
具体的布局配置选项
每个不同的布局有不同的属性项，具体的参见布局的Ext.layout.container.
用法:
layout: 'vbox'
布局
布局类型type将会被当前容器使用 (具体请参见布局类型值清单).
不同的布局类型有不同特性和属性项，如果开发者需要详细的信息请参见具体的
layout 布局类。
如果容器类有默认的布局类型 (例如 Toolbar
默认 `Box` 布局), 可以简单配置而没有`type`属性：
xtype: 'toolbar',
layout: {
// type: 'box',//不需要写
pack: 'center'
}
便利的配置。作为'Left Bar'的简写(left-docked, vertical toolbar)。
lbar: [
{ xtype: 'button', text: 'Button 1' }
]
等价于
dockedItems: [{
xtype: 'toolbar',
dock: 'left',
items: [
{ xtype: 'button', text: 'Button 1' }
]
}]
一个配置对象，包含一个或多个事件处理函数，在对象初始化时添加到对象。 它应该是addListener指定的一个有效的监听器配置对象， 一次添加多个事件处理函数。
Ext JS 组建的DOM事件
虽然一些Ext JS组件类输出选定的DOM事件（例如"click"、"mouseover"等),
但是这只能通过添加额外的值（如果能）。例如，DataView的itemclick传递被单击的节点。为了通过Component的子元素直接访问DOM事件，
我们需要指定element选项来标识要
添加DOM监听器的Component属性：
new Ext.panel.Panel({
width: 400,
height: 200,
dockedItems: [{
xtype: 'toolbar'
}],
listeners: {
click: {
element: 'el', //bind to the underlying el property on the panel
fn: function(){ console.log('click el'); }
},
dblclick: {
element: 'body', //bind to the underlying body property on the panel
fn: function(){ console.log('dblclick body'); }
}
}
});
一个配置对象或者一个 Ext.ComponentLoader 实例加载组件远程内容.
一个配置对象或者一个 Ext.ComponentLoader 实例加载组件远程内容.
:当设置为true时，挂靠组件布局的高度信息写入到 基于panel收缩包装高度计算的dom元素。这个确保浏览器计算高度。当设置为false的时候 挂靠组件布局将不会在panel中写入高度或者其自身的元素。在一些简单的布局情况，不指 定DOM元素的高度使得DOM元素自动计算因为这个允许浏览器来控制(like animations)。
Defaults to: true
指定所有 footer toolbar 按钮的最小像素宽度。如果设置了这个属性的值，将会被作为Ext.button.Button.minWidth 的默认值，应用到每一个经由fbar或buttons将要添加到footer toolbar的Button上.当被添加的按钮在 其他地方配置了minWidth属性，例如在它们自己对象中或者通过它们的父容器，则该属性会被忽略。默认宽度为75。
Defaults to: 75
设置为true则启用'MULTI'多行选择模式。参见 Ext.selection.Model.mode。
设置为true则启用'MULTI'多行选择模式。参见 Ext.selection.Model.mode。
指定名称列的宽度，值列将会取得所有的剩余空间。
Defaults to: 115
使用store的字段名称做为属性字段的名称 这可能有用的如果你不是通过一个对象配置property Grid，而是使用你定义的store去配置。
Defaults to: "name"
当鼠标移到该元素, 一个可选的额外的CSS类将被添加到该组件的元素, 并在鼠标移出后删除. 这可能对添加自定义的 'active' 或者 'hover' 样式的组件有用 或任何其子组件使用标准的CSS规则.
Defaults to: ""
可能的值有:
* 'auto' 自动启用水平滚动条(水平溢出:'auto')
* 'scroll' 始终启用水平滚动条(水平溢出:'scroll')
默认的水平溢出是'hidden',不能这样指定autoScroll.又自动又始终
可能的值有:
* 'auto' 自动启用水平滚动条(水平溢出:'auto')
* 'scroll' 始终启用水平滚动条(水平溢出:'scroll')
默认的水平溢出是'hidden',不能这样指定autoScroll.又自动又始终
可能的值有:
* 'auto' 自动启用自动垂直滚动条(垂直溢出:'auto')
* 'scroll' 始终启用垂直滚动条(垂直溢出:'scroll')
默认的垂直溢出是'hidden',不能这样指定autoScroll.又自动又始终
可能的值有:
* 'auto' 自动启用自动垂直滚动条(垂直溢出:'auto')
* 'scroll' 始终启用垂直滚动条(垂直溢出:'scroll')
默认的垂直溢出是'hidden',不能这样指定autoScroll.又自动又始终
设置为true重叠的头在Panel自身编制当中。这是需要当frame:true(是为你自动完成的)。否则他是未定义的。如果你手动添加 Panel头为圆角且没有设置Panel属性frame:true，这个是需要被设置为true的。
设置为true重叠的头在Panel自身编制当中。这是需要当frame:true(是为你自动完成的)。否则他是未定义的。如果你手动添加 Panel头为圆角且没有设置Panel属性frame:true，这个是需要被设置为true的。
重要:这个配置仅仅对Panel的直接子项以border 布局有效并且没有配置'header' collapseMode。
可选 一个组件(或者为一个组件配置一个对象)在 Panel 中显示当这个Panel以border 布局被折叠。 默认创建一个Header拥有一个工具栏按钮可以再次展开Panel。
属性mode用于隐藏折叠的panel当配置using collapseMode "placeholder"。
属性mode用于隐藏折叠的panel当配置using collapseMode "placeholder"。
一个对象或者对象数组, 组件将提供自定义功能. 一个有效的插件唯一的要求是包含一个 init 方法, 接收一个 Ext.Component 类型参数. 当组件被创建时, 如果有可用的插件, 组件将会调用每个插件的 init 方法, 并将自身的引用作为方法参数传递给它. 然后, 每个插件就可以调用方法或者响应组件上的事件, 就像需要的那样提供自己的功能.
Defaults to: false
This cfg has been deprecated
4.1.0 使用 header 代替。 阻止Panel的标题头被创建与渲染，默认为false。
一个对象，包含自定义属性的名称/显示名称对。 如果指定的显示名称将显示名称在列中，而不是属性名称。
便利的配置。作为'Right Bar'的简写(right-docked, vertical toolbar)。
rbar: [
{ xtype: 'button', text: 'Button 1' }
]
等价于
dockedItems: [{
xtype: 'toolbar',
dock: 'right',
items: [
{ xtype: 'button', text: 'Button 1' }
]
}]
所使用的数据 renderTpl 除了以下属性值的组件:
参见 renderSelectors 和 childEls 用法示例.
所使用的数据 renderTpl 除了以下属性值的组件:
参见 renderSelectors 和 childEls 用法示例.
一个对象其中包含指定DomQuery 选择器确定创建的子元素渲染过程的属性.
在组件的内部结构呈现根据 renderTpl, 这个对象遍历,
找到的元素作为属性添加到组件使用 renderSelector 属性名称.
例如, 一个的组件渲染标题和描述到它的元素:
Ext.create('Ext.Component', {
renderTo: Ext.getBody(),
renderTpl: [
'<h1 class="title">{title}</h1>',
'<p>{desc}</p>'
],
renderData: {
title: "Error",
desc: "Something went wrong"
},
renderSelectors: {
titleEl: 'h1.title',
descEl: 'p'
},
listeners: {
afterrender: function(cmp){
// After rendering the component will have a titleEl and descEl properties
cmp.titleEl.setStyle({color: "red"});
}
}
});
对于一个更快, 但弹性较差, 替代方案达到相同的最终结果 (渲染后组件的子元素属性), 参见 childEls 和 addChildEls.
指定元素的id, 一个DOM元素或现有的元素，这个组件将被渲染成.
注意:
不使用此配置项，如果该组件是一个Container的子元素. 它的职责是 Container的 layout manager 渲染和管理其子项.
当使用此配置, 调用 render() 不是必须的.
也可参见 render .
一个 XTemplate 用于创建此组件的封装内的内部结构 Element.
你通常不需要进行设置. 对基类 Ext.Component 和
Ext.container.Container, 默认值为 null 这意味着它们最最初将被呈现没有内部结构;
他们渲染 Element 为空. 很多专用的ExtJS和Touch
类使用更复杂的DOM结构类, 提供自己的模板定义.
这是为了允许开发者创建应用程序特定的效用与定制的内部结构的组成部分.
在渲染时候, 任何创建的子元素可以自动导入对象属性的使用 renderSelectors 和 childEls 配置项.
Defaults to: "{%this.renderContent(out,values)%}"
Ext.resizer.Resizer 只有在自动大小为true的情况下,配置字符串才有效
Defaults to: "all"
设置为true，约束列拖拽以便使其他列无法拖动进来和当前列无法拖出它的当前分组。 唯一相关的是启用enableColumnMove。
Defaults to: false
滚动条的配置。有效值是'both'，'horizontal'或'vertical'。 设置为true意味着'both'。设置为false意味着'none'。
Defaults to: true
一个selection model实例或配置对象。在后一种情况下， selType配置选项确定此配置应用于哪种类型的选择模型。
一个selection model实例或配置对象。在后一种情况下， selType配置选项确定此配置应用于哪种类型的选择模型。
所使用到的选择模型的xtype。默认为'rowmodel'。 如果只是一个配置对象或者在selModel配置中未给出任何指定则在这里将被用来创建选择模型。
Defaults to: "rowmodel"
定义浮动组件是否应该有阴影效果. 设置为 true 则自动创建一个 Ext.Shadow 对象, 或者设为string类型的值,用于指定 阴影的显示模式 Ext.Shadow.mode. 设置为 false 则禁用阴影.
Defaults to: "sides"
阴影效果偏移的像素值.
阴影效果偏移的像素值.
如果此属性是一个数字, 解释如下:
false.true.在 CSS 方面, shrink-wrap 宽度类似于 inline-block 元素而不是类似一个 block-level 元素. 有些容器布局总是 shrink-wrap 他们的子元素, 忽略这个属性 (e.g., Ext.layout.container.HBox, Ext.layout.container.VBox, Ext.layout.component.Dock).
Defaults to: 2
设置为true则启用'SIMPLE'单行选择模式。参见 Ext.selection.Model.mode。
设置为true则启用'SIMPLE'单行选择模式。参见 Ext.selection.Model.mode。
设置为false则禁用通过单击标题和排序菜单项来进行列排序。
Defaults to: true
一组事件，当被触发时，应该触发这个对象去保存它的state。默认是none。
stateEvents可以是任何类型的事件支持的对象，包括浏览器或客户端事件。
(例如, ['click', 'customerchange']).
参见 stateful 对于一个解释的保存和恢复的state。
一个试图从启动时保存的state恢复到state的内部属性状态的标志。 对象必定有一个stateId为state被管理。
自动生成的id不能保证稳定的跨页面加载和不能被指望来保存和恢复相同的状态对象。
为state保存工作，state管理的提供者必须被设置为一个实现Ext.state.Provider， 并且覆盖了set和get 方法保存和召回name/value对。
一个内置的实现，Ext.state.CookieProvider是可用的。
设置state提供的当前页面：
Ext.state.Manager.setProvider(new Ext.state.CookieProvider({
expires: new Date(new Date().getTime()+(1000*60*60*24*7)), //从现在开始后的7天
}));
当stateEvents中被列出的事件被触发时， 一个stateful对象试图去保存state。
为了保存state，stateful对象首先序列化它的state通过调用getState。
state只有在最初配置，并改变了配置的值， 组件基类来实现{ @link # getState }来保存它的宽度和高度。
Panel类保存它折叠的state除了那个。
Grid类保存它的列state除了它超类的state。
假如有更多的应用state要保存，开发者必须提供一个实现首先 调用超类的方法去继承上面的行为，然后注入新的属性到返回的对象。
通过getState得到的值被传递给Ext.state.Manager.set， 使用配置的Ext.state.Provider，通过stateId来保存对象键。
在构造过程中，stateful对象试图通过调用Ext.state.Manager.get 传送stateId修复它的状态。
作为传递给applyState的对象。默认实现applyState 简单地复制属性的对象，但开发者可以覆盖这个支持更复杂的应用程序状态的恢复。
您可以执行额外的处理状态保存和恢复通过附加处理程序到beforestaterestore， staterestore，beforestatesave和statesave事件。
Defaults to: false
Overrides: Ext.panel.Table.store
自定义风格规范适用于该组件的元素. 应该是Ext.Element.applyStyles的一个有效参数.
new Ext.panel.Panel({
title: 'Some Title',
renderTo: Ext.getBody(),
width: 400, height: 300,
layout: 'form',
items: [{
xtype: 'textarea',
style: {
width: '95%',
marginBottom: '10px'
}
},
new Ext.button.Button({
text: 'Send',
minWidth: '100',
style: {
marginBottom: '10px'
}
})
]
});
当你设置 styleHtmlContent 为 true 的时候, 配置的样式类添加到目标的内容区域.
Defaults to: "x-html"
如果设置为 true，就自动地将这个html嵌入在这个组件 (body for panels) 的内容目标里.
Defaults to: false
如果为true,暂停调用doLayout. 当开发者需要协调同时更新多个组件和容器， 而不是将它们传递为多个参数的数组的时候使用。
Defaults to: false
便利的配置。'Top Bar'的缩略形式。
tbar: [
{ xtype: 'button', text: 'Button 1' }
]
等价于
dockedItems: [{
xtype: 'toolbar',
dock: 'top',
items: [
{ xtype: 'button', text: 'Button 1' }
]
}]
此标题头内容被用于在panel 标题头展现。当一个title属性在Ext.panel.Header
中被指定那么会自动创建和渲染出一个头除非header属性被设置为了false。
Defaults to: ""
可以设置为"left"(左), "right"(右) 或者 "center"(居中)。
设置Panel标题文字在图标和工具栏之间可利用的位置。
Defaults to: "left"
'true'允许通过单击Panel头部的任何位置实现Panel展开和折叠之间的切换(当collapsible = true)
'false'只能通过点击工具按钮来实现展开和折叠之间切换的实现。默认为false。
Defaults to: false
一组Ext.panel.Tool配置/实例被添加到Panel头工具区域。这些工具被头容器作为子组件被存放。它们允许被访问通过 down 和 {query}，和其他组件方法一样。这个切换工具被自动创建如果collapsible属性设置为了true。
需要注意的是，除了切换工具，提供当面板是可折叠的，这些工具只提供视觉按钮。任何需要的功能必须提供添加处理程序， 执行必要的行为。
应用实例:
tools:[{
type:'refresh',
tooltip: 'Refresh form Data',
// hidden:true,
handler: function(event, toolEl, panel){
// 实现逻辑
}
},
{
type:'help',
tooltip: 'Get Help',
handler: function(event, toolEl, panel){
// 在此显示帮助信息
}
}]
一个 Ext.Template, Ext.XTemplate 或者一个字符串数字以形成一个 Ext.XTemplate.
配合 data 和 tplWriteMode 配置一起使用.
Ext.(X)Template 更新内容区域使用的方法.
参见 Ext.XTemplate.overwrite 默认模式信息.
Defaults to: "overwrite"
An array of of classNames which are currently applied to this component
Defaults to: []
使用store的字段名称做为值字段的名称 这可能有用的如果你不是通过一个对象配置property Grid，而是使用你定义的store去配置。
Defaults to: "value"
在配置scroll monitor来控制刷新"无限表格"中的数据时， 所用到的一个配置对象。
此对象的配置允许微调的数据缓存， 可以提高性能和无限网格的可用性。
表格所使用到的Ext.view.Table。使用viewConfig只是提供一些配置选项到视图中 (而不是创建整个视图实例)。
表格所使用到的Ext.view.Table。使用viewConfig只是提供一些配置选项到视图中 (而不是创建整个视图实例)。
将应用于表格的 UI 视图的配置对象。任何对于Ext.view.Table所使用到的配置选项都在这里被指定。 如果指定了view，则忽略此选项。
此属性提供了一个较短的替代全类型创建对象.
使用 xtype 是最常见的方式来定义组件实例,
特别是在一个容器中. 例如,
在一个表单包含文本域的元素可以显式创建像这样:
items: [
Ext.create('Ext.form.field.Text', {
fieldLabel: 'Foo'
}),
Ext.create('Ext.form.field.Text', {
fieldLabel: 'Bar'
}),
Ext.create('Ext.form.field.Number', {
fieldLabel: 'Num'
})
]
但使用 xtype, 上述成为:
items: [
{
xtype: 'textfield',
fieldLabel: 'Foo'
},
{
xtype: 'textfield',
fieldLabel: 'Bar'
},
{
xtype: 'numberfield',
fieldLabel: 'Num'
}
]
当 xtype 是多个元素共有, Ext.container.AbstractContainer.defaultType
是另一种方式为所有没有明确xtype的元素明确 xtype:
defaultType: 'textfield',
items: [
{ fieldLabel: 'Foo' },
{ fieldLabel: 'Bar' },
{ fieldLabel: 'Num', xtype: 'numberfield' }
]
items 数组所有成员现在仅仅是一个"配置对象".
这些对象用于创建和配置组件的实例.
一个配置对象可以使用 Ext.widget手动实例化一个组件:
var text1 = Ext.create('Ext.form.field.Text', {
fieldLabel: 'Foo'
});
// or alternatively:
var text1 = Ext.widget({
xtype: 'textfield',
fieldLabel: 'Foo'
});
这种转换的配置对象实例化组件完成时创建容器作为其 {Ext.container.AbstractContainer.initComponent}
的过程的一部分. 就像同一进程的一部分, items 数组
由原来的数组转换成 Ext.util.MixedCollection 示例.
你可以定义自己的 xtype 在一个自定义的 component 指定
xtype 属性在 Ext.define. 例如:
Ext.define('MyApp.PressMeButton', {
extend: 'Ext.button.Button',
xtype: 'pressmebutton',
text: 'Press Me'
});
当给一个自定义组件命名xtype应谨慎, 因为他是唯一的,
所有xtypes共享范围.
第三方组件可考虑使用一个前缀以免冲突.
Ext.define('Foo.form.CoolButton', {
extend: 'Ext.button.Button',
xtype: 'ux-coolbutton',
text: 'Cool!'
});
扩展事件
Defaults to: []
设置这个属性为 'true' 会引起 isLayoutRoot 方法返回 'true' 并且停止寻找最顶级的组件布局.
Defaults to: false
The number of component layout calls made on this object.
Defaults to: 0
如果这个Panel配置了draggable,这个属性将包含一个 Ext.dd.DragSource手动托追的panel实例
开发者必须提供抽象方法Ext.dd.DragSource的实现为了提供行为每个层次的托/放过程.参见draggable.
只存在于作为容器的子项被插入的浮动组件。
浮动的组件编程方式rendered 将不会有浮动的父级属性
对于floating浮动组件是一个容器的子项，浮动上级将是拥有容器
例如，在一个窗口的下拉列表BoundList 在窗体中, 它的浮动父窗口就是窗体
See floating and zIndexManager
其中加入任何划分元件内的密封元件,以提供图形表示的宽度, 圆角边界. 参见 frame 配置.
这是包含以像素为单位的一个对象为所有四个侧面包含下面属性的组件:
Defaults to: {left: 0, top: 0, right: 0, bottom: 0, width: 0, height: 0}
顶部边框元素的像素宽度.
Defaults to: 0
右侧边框元素的像素宽度.
Defaults to: 0
底部边框元素的像素宽度.
Defaults to: 0
左侧边框元素的像素宽度.
Defaults to: 0
左右边框元素的像素总宽度
Defaults to: 0
顶部和右侧底部的像素总宽度.
Defaults to: 0
本对象包含任何有监听器的事件的键。监听器可以在实例上直接设置， 或者在其类或者父类(通过observe) 或者在MVC EventBus上设置。本对象的值为真 (一个非零的数字)和假(0或者undefined)。它们并不代表确切的监听器数量。 如果事件必须被触发，它的值是真的， 如果没有必要，就是假的。
本属性的设计目的是避免没有监听器时调用fireEvent的开销。 如果fireEvent要调用成百上千次，这尤其有用。 用法:
if (this.hasListeners.foo) {
this.fireEvent('foo', this, arg1);
}
true 在这个类标识对象是 Component或者其子类的实例。
Defaults to: true
在本类中设置为true将一个对象标识为实例化的Observable或其子类。
Defaults to: true
子组件的所有集合.
子组件的所有集合.
布局计数器 记录布局次数.
Defaults to: 0
创建自定义组件时这是个内部标识. 默认情况下, 此设置为 'true'
这意味着禁用时每个组件都获得一个蒙版. 组件像 FieldContainer, FieldSet, Field, Button, Tab
覆盖这个属性为 false 因为他们希望实现自定义禁用逻辑.
Defaults to: true
如果你正在编写一个表格插件，或者一个{Ext.grid.feature.Feature Feature}创建了一个基于列的结构， 当列移动时需要刷新视图，那么设置这个属性到表格中。
一个例子是内置在Summary 的特征中。
创建摘要行和汇总列必须在相同的数据列的顺序下。这个插件对象设置 optimizedColumnMove 为 false。
本身
获取当前类的引用，此对象被实例化。不同于 statics,
this.self是依赖范围，它意味着要使用动态继承。
参见 statics 详细对比
Ext.define('My.Cat', {
statics: {
speciesName: 'Cat' // My.Cat.speciesName = 'Cat'
},
constructor: function() {
alert(this.self.speciesName); // 依赖 'this'
},
clone: function() {
return new this.self();
}
});
Ext.define('My.SnowLeopard', {
extend: 'My.Cat',
statics: {
speciesName: 'Snow Leopard' // My.SnowLeopard.speciesName = 'Snow Leopard'
}
});
var cat = new My.Cat(); // alerts 'Cat' 猫
var snowLeopard = new My.SnowLeopard(); // alerts 'Snow Leopard' 雪豹
var clone = snowLeopard.clone();
alert(Ext.getClassName(clone)); // alerts 'My.SnowLeopard'
只存在于floating组件后，他们已提供。
管理该组件的ZIndexManager的参考是z-index。
ZIndexManager维护一个堆栈的浮动组件z轴， 并且还提供了一个单一模态面具下是插入模态浮动组件的可见。
浮动组件可能是 brought to the front or sent to the back of the z轴 堆栈.
这个默认为全局ZIndexManager 浮动组件 他们以编程方式访问rendered.
对于浮动floating组件被添加到一个容器中， ZIndexManager首先回收第一个父类的浮动状态, 如果没有浮动层,全局ZIndexManager就被使用
See floating and zIndexParent
只存在于被插入的floating浮动组件作为子项的容器， 有一个浮动的容器包含在其中。
对于floating浮动组件是一个容器的子项，zIndexParent将是一个浮动的顶层容器， 负责其所有浮动的子类z-index值。 它提供了ZIndexManager的Z-索引服务， 提供其所有的后代浮动组件。
浮动的组件rendered编程方式呈现， 不会有一个'zIndexParent`属性
例如，在一个窗口这是一个ComboBox的的下拉BoundList 的窗口， 它的zIndexParent，上面显示该窗口，无论被放置在窗口的z-index堆栈。
See floating and zIndexManager
Creates new Component.
The configuration options may be specified as either:
Overrides: Ext.AbstractComponent.constructor
Adds 向当前容器中添加 Component(s).
defaults).add event after the component has been added.如果子组件已经添加并渲染了，调用add的时候，
它将会渲染一个新的到父容器里面.
如果 配置了子组件的布局管理 layout, 容器在添加到时候会重新计算它的内部布局.
需要注意的是默认的布局管理器只是简单地按顺序呈现子组件 到内容区域，其后的执行不会调整子组件的大小.
如果要添加多个新的子组件，可以把它们作为一个数组传递给方法， 一次执行，这样只重新布局一次，以提高性能.
tb = new Ext.toolbar.Toolbar({
renderTo: document.body
}); // toolbar is rendered
// add multiple items.
// (defaultType for Toolbar is 'button')
tb.add([{text:'Button 1'}, {text:'Button 2'}]);
如果要添加的组件在已经存在组件之间,请使用insert 方法.
直接管理容器的BorderLayout布局管理器的组件可能不会被删除 或添加。具体参见BorderLayout。
容器
可以是一个或多个子组件数组.
其他信息参见 items.
被添加的组件.
此方法添加解析到的每个参数到 childEls 数组.
从代表此组件的顶层元素添加 CSS 类.
This method has been deprecated since 4.1
Use addCls instead.
返回此组件让方法可以链接.
添加一个 cls 到 uiCls 数组, 这也将调用 addUIClsToElement 并增加到该组件的所有元素.
Sets up the focus listener on this Component's focusEl if it has one.
Form Components which must implicitly participate in tabbing order usually have a naturally focusable element as their focusEl, and it is the DOM event of that recieving focus which drives the Component's onFocus handling, and the DOM event of it being blurred which drives the onBlur handling.
If the focusEl is not naturally focusable, then the listeners are only added if the FocusManager is enabled.
成员
向本对象添加一个事件处理函数，例如:
myGridPanel.on("mouseover", this.onMouseOver, this);
这个方法也允许传递单个参数，参数为一个 包含指定多个事件的属性的配置对象。例如:
myGridPanel.on({
cellClick: this.onCellClick,
mouseover: this.onMouseOver,
mouseout: this.onMouseOut,
scope: this // Important. Ensure "this" is correct during handler execution
});
你也能为每个事件处理函数单独指定选项：
myGridPanel.on({
cellClick: {fn: this.onCellClick, scope: this, single: true},
mouseover: {fn: panel.onMouseOver, scope: panel}
});
也能使用在特定作用域的方法名。注意
必须指定scope:
myGridPanel.on({
cellClick: {fn: 'onCellClick', scope: this, single: true},
mouseover: {fn: 'onMouseOver', scope: panel}
});
被监听的事件名。 也可以是属性名字是事件名字的对象。
事件调用的方法, 或者如果指定了scope，在指定scope的方法名*。
会被调用，
参数为fireEvent的参数加上下述options参数。
事件处理函数执行的作用域(this应用的上下文)
如果省略, 默认为触发事件的对象。
包含事件处理函数配置的对象。
注意: 不像ExtJS 3.x, options对象也会作为最后一个参数 传递给每一个事件处理函数。
这个对象可能包含以下任何一个属性:
事件处理函数执行的作用域(this应用的上下文)
如果省略, 默认为触发事件的对象。
事件触发后，调用事件处理函数延时毫秒数。
设置为true添加一个事件处理函数，只处理下一次触发的事件, 然后移除这个函数。
使事件处理函数在Ext.util.DelayedTask中调度运行， 延时指定的毫秒数。如果事件在这段事件再次触发， 原先的事件处理函数不再调用, 新的事件处理函数接替。
只有当事件在目标Observable上触发时调用事件处理函数, 如果事件是从Observable的子类起泡的，不会调用事件处理函数
这个选项只对绑定在Components上的监听器有效。 Component的一个属性名，这个属性引用一个待添加监听器的元素
这个选项在Component构造过程中向Components的元素添加DOM事件监听器有用。 这些元素只有在Component渲染之后才会存在。 例如, 向Panel的body中添加click监听器:
new Ext.panel.Panel({
title: 'The title',
listeners: {
click: this.handlePanelClick,
element: 'body'
}
});
组合选项
使用options参数, 可以组合不同类型的监听器：
一个延时的一次性监听器：
myPanel.on('hide', this.handleClick, this, {
single: true,
delay: 100
});
向任何Observable对象（或者Ext.Element）添加监听器， 当组件被销毁时，监听器自动被移除
添加监听器的目标项。
事件名或者包含的事件名属性的对象。
(可选的) 如果ename参数是事件名, 这就是一个事件处理函数。
(可选的) 如果ename参数是事件名, 这就是(this引用的上下文)
事件处理函数执行的作用域。
(可选的)如果ename参数是事件名,
这就是addListener的选项。
模板方法在子类中被实现用于在其自身中添加他们自己的功能按钮在折叠的按钮的后面。
This is a template method. a hook into the functionality of this class. Feel free to override it in child classes.
Method which adds a specified UI to the components element.
Panel折叠之后触发.
This is a template method. a hook into the functionality of this class. Feel free to override it in child classes.
Called by the layout system after the Component has been layed out.
This is a template method. a hook into the functionality of this class. Feel free to override it in child classes.
调用后 Panel 展开.
This is a template method. a hook into the functionality of this class. Feel free to override it in child classes.
容器隐藏后调用的函数
获取通过相同的回调范围和作用范围`。
This is a template method. a hook into the functionality of this class. Feel free to override it in child classes.
在容器完成子组件布局（并且渲染了必须的子组件以后）以后调用.
This is a template method. a hook into the functionality of this class. Feel free to override it in child classes.
允许完成渲染之后添加行为。在这个阶段，组件的元素 根据配置已经有了样式, 已经添加了任意CSS类名， 具有配置的可见性和启用状态。
This is a template method. a hook into the functionality of this class. Feel free to override it in child classes.
Template method called after a Component has been positioned.
This is a template method. a hook into the functionality of this class. Feel free to override it in child classes.
组件显示后调用
相同的参数被传递
This is a template method. a hook into the functionality of this class. Feel free to override it in child classes.
将此浮动组件对齐到指定的元素(element)
要对齐的元素或者 Ext.Component. 如果此参数为组件,则其必须是一个 component 实例. 如果是一个字符串形式的id, 将被当做元素 element 的 id.
要对齐的位置 (请参考 Ext.Element.alignTo 了解更多细节).
Defaults to: "tl-bl?"
位置的偏移,格式为 [x, y]
this
在 this 这个对象上执行自定义动画.
动画方法适用于 Component 类和 Element 类. 它在指定的时间内,对this对象的特定属性进行动画.
唯一的参数是一个配置对象, 该对象定义了开始属性值, 结束属性值,以及描述时间线的属性.
当一个元素进行动画时, 下列的属性都可定义在 from, to, 以及 keyframe 这几个配置对象中:
x - 页面 X 位置,单位:像素.
y - 页面 Y 位置,单位:像素.
left - 元素的 CSS left 值. 必须指定单位(比如: "6px").
top - 元素的 CSS top 值. 必须指定单位(比如: "6px").
width - 元素的 CSS width 值. 必须指定单位(比如: "6px").
height - 元素的 CSS height 值. 必须指定单位(比如: "6px").
scrollLeft - 元素的 scrollLeft 值.
scrollTop - 元素的 scrollLeft 值.
opacity - 元素的 opacity 值. 透明度,值只能位于 0 和 1之间.
需要注意的是, 如果动画一个被 Ext Component 所使用的元素,却不以某种方式通知组件Component 元素改变过后的状态, 可能会导致错误的 Component 行为. 这是因为 Component会继续使用元素旧的状态. 想要规避这个问题, 直接对Components 特定的属性值进行动画即可(而不要动画其内部的元素).
当组件进行动画的时候, 下列的属性都可定义在 from, to, and keyframe 这几个配置对象中:
x - 组件在页面内的 X 位置,单位:像素.
y - 组件在页面内的 Y 位置,单位:像素.
left - 组件的 left 值,单位:像素.
top - 组件的 top 值,单位:像素.
width - 组件的 width 值,单位:像素.
height - 组件的 height 值,单位:像素.
dynamic - 指定为 true, 则动画的每一帧都会 更新组件的布局 (如果是容器的话).
需要注意,每次组件大小改变,立即就重新进行布局是一种昂贵的操作.请根据实际需要进行取舍
要将一个 Window 通过动画效果改变大小, 确保其内部的布局,以及所有的阴影都正确,代码如下:
myWindow = Ext.create('Ext.window.Window', {
title: 'Test Component animation',
width: 500,
height: 300,
layout: {
type: 'hbox',
align: 'stretch'
},
items: [{
title: 'Left: 33%',
margins: '5 0 5 5',
flex: 1
}, {
title: 'Left: 66%',
margins: '5 5 5 5',
flex: 2
}]
});
myWindow.show();
myWindow.header.el.on('click', function() {
myWindow.animate({
to: {
width: (myWindow.getWidth() == 500) ? 700 : 500,
height: (myWindow.getHeight() == 300) ? 400 : 300,
}
});
});
基于效率和性能的考虑, 默认情况下, Window 的内部布局只在其达到 "to" 所指定的大小时才进行刷新.
如果需要动态更新 Window 的子组件, 可以指定动画的属性 dynamic: true ,
此时两个子item在动画过程中都保持其比例.
一个对象,包含动画相关的属性,这些属性包括: 指定起始状态,结束状态,以及动画的时间线 相关的值.
下面所列出的属性中,只有 to 是强制必须有的.
config的属性值包括:
一个对象,指定动画开始时的相关CSS属性值. 如果没有指定,则默认使用元素当前实际的值. 实际的属性可能受此对象前面的动画所影响. 参见下面的元素与组件动画小节.
一个对象,指定动画结束时需要达到的相关CSS属性值.
每次动画的持续时间，单位: 毫秒 milliseconds.
一个字符串值.用于描述 如何从默认的线下 变为 非线性 的速率的类型. 其值 可以 是下列英文字符串 之一:
关键帧; 此参数是一个描述在时间轴(时间线)中特定点动作属性的对象. 其包含的属性, 名称是时间轴百分比的数字,对应的值指定在这个点的动画状态.
这是一个标准的 监听器 配置对象,
可用于在beforeanimate 事件 或者 afteranimate 事件中注入行为.
this
Sets references to elements inside the component. This applies renderSelectors as well as childEls.
Occurs before componentLayout is run. Returning false from this method will prevent the componentLayout from being executed.
This is a template method. a hook into the functionality of this class. Feel free to override it in child classes.
Invoked before the Component is destroyed.
This is a template method. a hook into the functionality of this class. Feel free to override it in child classes.
在 componentLayout前执行. 如果返回false componentLayout方法不会执行.
This is a template method. a hook into the functionality of this class. Feel free to override it in child classes.
显示之前调用组件。
This is a template method. a hook into the functionality of this class. Feel free to override it in child classes.
更改缺省设置之前调用，已配置为折叠状态。在渲染的时候调用此方法，是渲染现在最初的折叠状态，或者 这运行时充分布满 Panel 的折叠区域。它基本上是保存配置需要进行彻底的折叠状态的时间。
泡沫起来组件/容器的层次结构，每个组件调用指定的功能。 (this)函数调用作用域，将规定的范围或当前组件。该函数的参数将提供的 args或当前组件。如果在任何时候，该函数返回false泡沫停止。
this
调用原来的方法，这是以前的override重写
Ext.define('My.Cat', {
constructor: function() {
alert("I'm a cat!");
}
});
My.Cat.override({
constructor: function() {
alert("I'm going to be a cat!");
this.callOverridden();
alert("Meeeeoooowwww");
}
});
var kitty = new My.Cat(); // alerts "I'm going to be a cat!"
// alerts "I'm a cat!"
// alerts "Meeeeoooowwww"
This method has been deprecated since 4.1
版本 使用 callParent 代替.
参数的参数，数组或'参数'对象
来自当前方法，例如： this.callOverridden(arguments)
返回调用重写方法的结果。
所谓的"parent"方法是指当前的方法。 这是以前的方法派生或重写(参见 Ext.define)。
Ext.define('My.Base', {
constructor: function (x) {
this.x = x;
},
statics: {
method: function (x) {
return x;
}
}
});
Ext.define('My.Derived', {
extend: 'My.Base',
constructor: function () {
this.callParent([21]);
}
});
var obj = new My.Derived();
alert(obj.x); // alerts 21
这可以用来重写如下:
Ext.define('My.DerivedOverride', {
override: 'My.Derived',
constructor: function (x) {
this.callParent([x*2]); // 调用原来的My.Derived构造
}
});
var obj = new My.Derived();
alert(obj.x); // 现在提示 42
This also works with static methods.
Ext.define('My.Derived2', {
extend: 'My.Base',
statics: {
method: function (x) {
return this.callParent([x*2]); // 调用 My.Base.method
}
}
});
alert(My.Base.method(10); // alerts 10
alert(My.Derived2.method(10); // alerts 20
然后，它也可以重写静态方法。
Ext.define('My.Derived2Override', {
override: 'My.Derived2',
statics: {
method: function (x) {
return this.callParent([x*2]); // 调用 My.Derived2.method
}
}
});
alert(My.Derived2.method(10); // 现在提示 40
这个参数, 通过当前方法得到数组或者 arguments 对象,
例如: this.callParent(arguments)
返回调用父类的方法的结果。
此组件上取消任何递延重点
级联调用指定方法的容器结构树 (它本身会被第一个调用), 函数的参数将会作为参数提供的给当前调用的函数。 如果函数返回false将会停止级联当前分支。
调用函数
函数的作用域 (默认是当前容器)
调用函数的参数集合.当前容器会一直在参数集合的最后一个
this
获取符合匹配选项的第一层子组件. 匹配选项必须是一个符合Ext.ComponentQuery的选择器.
一个 Ext.ComponentQuery 选择器. 如果没有指定，返回第一个子组件.
移除本对象的包括受管理的监听器在内的所有监听器
移除本对象的所有受管理的监听器
克隆当前组件使用原来的配置传入到该实例的默认值。
覆盖一个新的配置包含任何属性来覆盖在克隆版本。 可以通过对这个对象的id属性，否则将产生以避免重复。
此组件克隆的克隆副本
关闭Panel。默认情况下这个方法会将其自身的DOM对象在浏览器中移除，destroys 销毁Panel对象并且销毁该Panel中的子组件。在关闭Panel动作发生之前beforeclose事件被触发，如果 要取消关闭动作则在其事件的处理函数中返回false即可。
注意 这个方法也同样被属相closeAction的设置所影响。它的设置会明确的控制使用destroy 还是 hide 方法。
折叠 Panel 体以便将其隐藏。挂靠组与边界平行折叠之后保持其依然可见。触发beforecollapse事件，如果取消 折叠动作在该事件的处理函数中返回false。
。折叠的方向，必须从下面当中选一个
True 折叠的时候动态的过度，否则没有动态效果 (默认参照Panel的animCollapse属性配置)
this
确保plugins数组包含完全构建插件实例. 这个将所有的配置转换成他们相应的实例.
销毁组件.
Overrides: Ext.state.Stateful.destroy
在4.1中，此方法已过时。 4.1 中的最接近是doLayout， 但也有可能没有布局需要的。
This method has been deprecated since 4.1
Called from the selected frame generation template to insert this Component's inner structure inside the framing structure.
When framing is used, a selected frame generation template is used as the primary template of the #getElConfig instead of the configured renderTpl. The renderTpl is invoked by this method which is injected into the framing template.
处理自动渲染。 漂浮的组件可能有ownerCt。如果要限制它们，将它们限制在 ownerCt内，并在本地管理z-index。漂浮的组件总是渲染到document.body。
将此浮动组件移入到一个限制区域.
默认情况下,此组件被限制在其父容器中, 或在其被渲染的元素中.
有两个可选的约束范围的参数:
某元素(Element) 或者此组件将被限制在其中的 Region. 默认是此浮动组件将被渲染到其中的元素.
手动强制这个容器的布局进行重新计算。大多数情况下框架自动完成刷新布局。
this 译者注：doLayout方法比较耗性能。如果添加多个组件,只要在最后调用doLayout,不要add一个 doLayout一次(remove时也是如此).
检索容器的第一层子组件. 匹配选项必须是一个符合Ext.ComponentQuery的选择器.
一个Ext.ComponentQuery的选择器. 如果没有指定，返回第一个子组件..
通过调用this.getBubbleTarget()（如果存在）允许本Observable对象触发的事件沿着继承体系起泡
在Observable基类中没有实现类。
这通常被Ext.Components用来将事件起泡到它的容器。 见Ext.Component.getBubbleTarget。Ext.Component中的默认实现 返回Component的直接容器。但是如果需要一个明显的target, 它可以被重写 以更快地访问需要的target。
使用范例:
Ext.override(Ext.form.field.Base, {
// Add functionality to Field's initComponent to enable the change event to bubble
initComponent : Ext.Function.createSequence(Ext.form.field.Base.prototype.initComponent, function() {
this.enableBubble('change');
}),
// We know that we want Field's events to bubble directly to the FormPanel.
getBubbleTarget : function() {
if (!this.formPanel) {
this.formPanel = this.findParentByType('form');
}
return this.formPanel;
}
});
var myForm = new Ext.formPanel({
title: 'User Details',
items: [{
...
}],
listeners: {
change: function() {
// Title goes red if form has been modified.
myForm.header.setStyle('color', 'red');
}
}
});
确保组件添加到document.body。如果组件
渲染到了Ext.getDetachedBody, 组件然后被附加到document.body。
重建所有配置的位置。
设置为true运行组件的布局。
Defaults to: false
展开 Panel 使之状态变为可见.触发beforeexpand事件,当处理函数中返回false则展开操作被取消.
设为true开启动画过度效果, false 则没有动画效果(默认值依照Panel中属性 animCollapse的配置)
this
找一个容器上面这个组件在任何级别的自定义函数。 如果传递的函数返回true，容器将被退回。
请参见up方法
自定义函数调用的参数(container, this component).
第一个容器的自定义函数返回true
使用传递过来的参数(去掉事件名，加上传递给addListener的options对象
)触发指定的事件。
通过调用enableBubble，一个事件 能被设置为沿着Observable的继承体系(见Ext.Component.getBubbleTarget)向上起泡。
如果任何一个事件处理函数返回false，就返回false，否则返回true。
聚焦此组件。
如果适用，true也可以选择这个组件中的文本
延迟焦点的毫秒数（true:10毫秒）。
聚焦的Component。通常的 this的组件。
一些容器可能委托焦点到的(Window可以做到这一点通过他们
的defaultFocus 的配置选项。
Forces this component to redo its componentLayout.
This method has been deprecated since 4.1.0
Use updateLayout instead.
Gets the bubbling parent for an Observable
The bubble parent. null is returned if no bubble target exists
返回传入元素指定的子组件.
元素(或者是元素ID).
深度如果为true,返回最深层级的子组件，其中包含传入的元素.
包含传递的元素的子项.
尝试查找默认组件(参见Ext.container.Container.getComponent)。如果在正规的子组件数组中没有找到，这个dockedItems被查找并且匹配 组件(参见 getDockedComponent)。注意挂靠组件仅仅匹配组件的Id或者itemId -- 如果你通过一个数值索引查找不到挂靠子组件。
组件 (如果查找到了)
Overrides: Ext.container.AbstractContainer.getComponent
私有方法,获取此浮动组件能移动的范围(x/y 偏移)
元素或者 此组件将被限制的Region.
限制的 x/y 范围
检索所有目前docked组件的数组.
例如寻找一个toolbar已经docked在顶部的组件集合
panel.getDockedItems('toolbar[dock="top"]');
一个 ComponentQuery 字符串用来过滤子组件的选择器.
一个可选标志，限制返回的集合，为(true)只返回 body之前的组件(false)则返回body之后的组件。默认所有组件都返回.
The array of docked components meeting the specified criteria.
返回容器中获得焦点的元素和容器本身. 默认是容器的目标元素。 使用可以获得焦点的元素（如窗口和按钮）的子类的时候，应该重写focus方法。
获得焦点的目标元素.
Overrides: Ext.AbstractComponent.getFocusEl
On render, reads an encoded style attribute, "background-position" from the style of this Component's element. This information is memoized based upon the CSS class name of this Component's element. Because child Components are rendered as textual HTML as part of the topmost Container, a dummy div is inserted into the document to receive the document element's CSS class name, and therefore style attributes.
本函数使用传递给onRender的位置参数并返回一个 DOM元素，你能在insertBefore中使用它。
索引, 元素id或者 你想把这个组件放在它前面的元素
在insertBefore中使用的DOM元素
获取左手边的header改变大小处理器标记。
Returns the CSS style object which will set the Component's scroll styles. This must be applied to the target element.
获取右手边的header改变大小处理器标记。
返回一个对象, 描述如何管理这个组件的宽度和高度. 这些对象是共享的, 不应该被修改.
，此组件的 size model.
The size model for the width.
The size model for the height.
为AbstractComponent类提供的默认状态收集方法.
此方法返回尺寸设置如 flex, anchor, width 和 height 随着 collapsed
状态.
子类实现更复杂的状态应该调用父类的实现, 如果基础的状态需要保存, 要将他们的状态应用到结果.
如果组件有一个 stateId 和 他们作为 StateProvider 文档配置, 需要注意的是组件状态只会被保存.
Overrides: Ext.state.Stateful.getState
Returns an offscreen div with the same class name as the element this is being rendered. This is because child item rendering takes place in a detached div which, being not part of the document, has no styling.
This is used to determine where to insert the 'html', 'contentEl' and 'items' in this component.
获取此组件的xtype注册Ext.ComponentManager。 对于列表所有可用xtypes，请看到Ext.Component 头。用法示例：
var t = new Ext.form.field.Text();
alert(t.getXType()); // alerts 'textfield'
The xtype
返回这个组件的 xtype 层次字符串, 用斜杠分隔. 所有可用的xtype列表, 参见 Ext.Component 类头部.
如果使用你自己的子类, 请注意, 组件必须注册它自己的 xtype 值以便区别于继承的xtype.
示例用法:
var t = new Ext.form.field.Text();
alert(t.getXTypes()); // alerts 'component/field/textfield'
xtype层次字符串
返回此元素当前是否有正在进行或在队列中的动画效果, 没有则返回 false.
This method has been deprecated
废弃的方法; 4.0以后使用 getActiveAnimation 替代
如果元素有正在进行的动画效果则返回 true, 否则返回 false
隐藏这个组件，将其设置为不可见使用配置的hideMode.
回调函数调用后的组件是隐藏的。
范围（本参考），其中执行回调。默认这个组件。
this
解析 bodyStyle 配如果可用于创建样式将应用到body元素的字符串。 这也包括 bodyPadding 和 bodyBorder 如果可用.
一个body的CSS样式字符串，填充和边框。
在初始化组件模板方法是一个重要的组件的初始化步骤。它的目的 是要实现Ext.Component提供任何所需的构造逻辑函数每个子类的。 在初始化组件模板被创建的类的方法，
首先会调用层次结构向上Ext.Component被称为此后与每个在InitComponent的方法。 这使得它很容易实现，如果需要的话，重载的构造函数逻辑的组件层次结构中的任何步骤。
在InitComponent方法必须包含一个调用callParent以确保父类的在InitComponent方法是传递给构造函数的called.
All的配置选项`被称为前在InitComponent，所以你可以简单地访问他们的this.someOption。
下面的例子演示了如何使用一个动态的一个按钮的文本字符串的类的实例的时候。
Ext.define('DynamicButtonText', {
extend: 'Ext.button.Button',
initComponent: function() {
this.text = new Date();
this.renderTo = Ext.getBody();
this.callParent();
}
});
Ext.onReady(function() {
Ext.create('DynamicButtonText');
});
This is a template method. a hook into the functionality of this class. Feel free to override it in child classes.
这个类的初始化配置。典型例子:
Ext.define('My.awesome.Class', {
// 这是默认配置
config: {
name: 'Awesome',
isAwesome: true
},
constructor: function(config) {
this.initConfig(config);
}
});
var awesome = new My.awesome.Class({
name: 'Super Awesome'
});
alert(awesome.getName()); // 'Super Awesome' 超级棒
配置
mixins 混入原型 键-值对
当renderTpl渲染的时候初始化渲染时所使用的数据
键值对组成的对象将要被 renderTpl 使用
Overrides: Ext.util.Renderable.initRenderData
根据结构初始化state对象
工具栏(header上的按钮组)是Panel特有的功能 Panel 用于初始化工具栏。Panel的子类可以实现向工具栏中添加工具功能。
添加容器到指定的位置. 触发 beforeadd 事件在添加之前, 之后触发add 事件在添加完容器以后.
指定插入的组件在子组件数组的位置
父容器.
Ext使用延迟渲染机制,组件插入以后只会在必要的时候渲染.
为了避免过多的组件配置可能会构建一个真实的组件对象。 如果要使用延迟渲染机制，让插入组件不会立即呈现的话， 设置对应的Ext.Component.xtype配置项
所有xtypes的列表,参见Ext.Component.
已经添加到子组件并且默认属性已经设置到子组件上了.
在4.1中，此方法已过时。 4.1 中的最接近是Ext.AbstractComponent.updateLayout， 但也有可能没有布局需要的。
This method has been deprecated since 4.1
判断 容器 是否是传入的组件的父容器或者是组件的父容器的容器.
如果返回 true，那么传递的组件是当前容器的结构树的子项。
组件 .
Determines whether this Component is the root of a layout. This returns true if
this component can run its layout without assistance from or impact on its owner.
If this component cannot run its layout given these restrictions, false is returned
and its owner will be considered as the next candidate for the layout root.
Setting the _isLayoutRoot property to true causes this method to always
return true. This may be useful when updating a layout of a Container which shrink
wraps content, and you know that it will not change size, and so can safely be the
topmost participant in the layout run.
如果此组件的布局是挂起的, 返回 true. This can come from direct 这可能是由这个组件的布局活动直接挂起引起的 (suspendLayouts) 或者此组件容器之一的布局是挂起的.
此组件的布局被挂起返回 true.
检验此组件是否是指定的xtype. 此方法既可以检验是否是指定的 xtype 的某个子类 (default) 或者它是否直接是指定的xtype类 (shallow = true).
如果使用你自己的子类, 请注意, 组件必须注册它自己的 xtype 值以便区别于继承的xtype.
所有可用的xtype列表, 参见 Ext.Component 类头部.
示例用法:
var t = new Ext.form.field.Text();
var isText = t.isXType('textfield'); // true
var isBoxSubclass = t.isXType('field'); // true, descended from Ext.form.field.Base
var isBoxInstance = t.isXType('field', true); // false, not a direct Ext.form.field.Base instance
需要为当前组件进行检测的xtype
如果为 true, 只检测组件是否是指定的xtype类型, false to 如果为false，检测组件是否是xtype继承树中的某个子类.
Defaults to: false
如果当前组件是指定xtype的子类, 返回 true, 其他返回 false.
addManagedListener的简写方法
向任何Observable对象（或者Ext.Element）添加监听器， 当组件被销毁时，监听器自动被移除
添加监听器的目标项。
事件名或者包含的事件名属性的对象。
(可选的) 如果ename参数是事件名, 这就是一个事件处理函数。
(可选的) 如果ename参数是事件名, 这就是(this引用的上下文)
事件处理函数执行的作用域。
(可选的)如果ename参数是事件名,
这就是addListener的选项。
移除通过mon方法添加的监听器。
待移除监听器的项
事件名或者包含的事件名属性的对象。
(可选的) 如果ename参数是事件名, 这就是一个事件处理函数。
(可选的) 如果ename参数是事件名, 这就是(this引用的上下文)
事件处理函数执行的作用域。
返回在树的遍历顺序的下一个节点的组件.
注意 这并不限定于同级, 如果在同级找不到匹配节点, 会遍历树 尝试找到一个匹配节点. 对比 nextSibling.
一个 ComponentQuery 选择器过滤过滤下面的节点.
下一个节点 (或者下一个匹配选择器的节点). 如果没有没有匹配的节点返回 null.
返回此组件的下一个同级组件.
随意选择下一个匹配 ComponentQuery 选择器的同级组件.
也可参考 next()
注意 这仅限于同级, 并且如果没有同级组件匹配, 返回 null . 对比
nextNode
一个 ComponentQuery 选择器过滤下面的组件.
下一个同级组件 (或者下一个匹配选择器的同级组件). 如果没有没有匹配的同级组件返回 null.
addListener的简写方法
向本对象添加一个事件处理函数，例如:
myGridPanel.on("mouseover", this.onMouseOver, this);
这个方法也允许传递单个参数，参数为一个 包含指定多个事件的属性的配置对象。例如:
myGridPanel.on({
cellClick: this.onCellClick,
mouseover: this.onMouseOver,
mouseout: this.onMouseOut,
scope: this // Important. Ensure "this" is correct during handler execution
});
你也能为每个事件处理函数单独指定选项：
myGridPanel.on({
cellClick: {fn: this.onCellClick, scope: this, single: true},
mouseover: {fn: panel.onMouseOver, scope: panel}
});
也能使用在特定作用域的方法名。注意
必须指定scope:
myGridPanel.on({
cellClick: {fn: 'onCellClick', scope: this, single: true},
mouseover: {fn: 'onMouseOver', scope: panel}
});
被监听的事件名。 也可以是属性名字是事件名字的对象。
事件调用的方法, 或者如果指定了scope，在指定scope的方法名*。
会被调用，
参数为fireEvent的参数加上下述options参数。
事件处理函数执行的作用域(this应用的上下文)
如果省略, 默认为触发事件的对象。
包含事件处理函数配置的对象。
注意: 不像ExtJS 3.x, options对象也会作为最后一个参数 传递给每一个事件处理函数。
这个对象可能包含以下任何一个属性:
事件处理函数执行的作用域(this应用的上下文)
如果省略, 默认为触发事件的对象。
事件触发后，调用事件处理函数延时毫秒数。
设置为true添加一个事件处理函数，只处理下一次触发的事件, 然后移除这个函数。
使事件处理函数在Ext.util.DelayedTask中调度运行， 延时指定的毫秒数。如果事件在这段事件再次触发， 原先的事件处理函数不再调用, 新的事件处理函数接替。
只有当事件在目标Observable上触发时调用事件处理函数, 如果事件是从Observable的子类起泡的，不会调用事件处理函数
这个选项只对绑定在Components上的监听器有效。 Component的一个属性名，这个属性引用一个待添加监听器的元素
这个选项在Component构造过程中向Components的元素添加DOM事件监听器有用。 这些元素只有在Component渲染之后才会存在。 例如, 向Panel的body中添加click监听器:
new Ext.panel.Panel({
title: 'The title',
listeners: {
click: this.handlePanelClick,
element: 'body'
}
});
组合选项
使用options参数, 可以组合不同类型的监听器：
一个延时的一次性监听器：
myPanel.on('hide', this.handleClick, this, {
single: true,
delay: 100
});
在组件添加以后，通过添加到这个组件调用该方法。 可以被用于更新任何内部的结构，但是这取决于子项的状态.
This is a template method. a hook into the functionality of this class. Feel free to override it in child classes.
容器
位置
Method to manage awareness of when components are added to their respective Container, firing an added event. References are established at add time rather than at render time.
Allows addition of behavior when a Component is added to a Container. At this stage, the Component is in the parent Container's collection of child items. After calling the superclass's onAdded, the ownerCt reference will be present, and if configured with a ref, the refOwner will be set.
This is a template method. a hook into the functionality of this class. Feel free to override it in child classes.
Container which holds the component
Position at which the component was added
这个方法将会被调用在添加子组件之前. 它通过新的组件，并且可以被用于修改组件，或以某种方式准备的容器。 返回false中止的添加操作.
This is a template method. a hook into the functionality of this class. Feel free to override it in child classes.
允许销毁操作的行为。 调用父类的OnDestroy后，组件将被销毁。
This is a template method. a hook into the functionality of this class. Feel free to override it in child classes.
Allows addition of behavior to the disable operation. After calling the superclass’s onDisable, the Component will be disabled.
This is a template method. a hook into the functionality of this class. Feel free to override it in child classes.
在panel添加一个docked item以后调用.
This is a template method. a hook into the functionality of this class. Feel free to override it in child classes.
在一个docked item从panel移除以后调用.
This is a template method. a hook into the functionality of this class. Feel free to override it in child classes.
组件
Allows addition of behavior to the enable operation. After calling the superclass’s onEnable, the Component will be enabled.
This is a template method. a hook into the functionality of this class. Feel free to override it in child classes.
动画可能下降到目标元素。
允许行为的隐藏操作。后调用父类onHide的， 组件将被隐藏。
相同的参数被传递＃隐藏。
This is a template method. a hook into the functionality of this class. Feel free to override it in child classes.
Called after the component is moved, this method is empty by default but can be implemented by any subclass that needs to perform custom logic after a move occurs.
This is a template method. a hook into the functionality of this class. Feel free to override it in child classes.
这个方法将会被调用在组件移除以后。 此方法可用于更新任何内部结构，但是这取决于子项的状态.
This is a template method. a hook into the functionality of this class. Feel free to override it in child classes.
容器
是否自动销毁
Method to manage awareness of when components are removed from their respective Container, firing a removed event. References are properly cleaned up after removing a component from its owning container.
Allows addition of behavior when a Component is removed from its parent Container. At this stage, the Component has been removed from its parent Container's collection of child items, but has not been destroyed (It will be destroyed if the parent Container's autoDestroy is true, or if the remove call was passed a truthy second parameter). After calling the superclass's onRemoved, the ownerCt and the refOwner will not be present.
This is a template method. a hook into the functionality of this class. Feel free to override it in child classes.
Will be passed as true if the Container performing the remove operation will delete this Component upon remove.
这个组件的DOM结构创建之后调用的模板方法。
此时, 这个组件(及其所有子组件)的DOM存在， 但是它还没有布局(摆放和调整大小)。
重写这个方法的子类能在渲染时访问DOM结构。 它应该在访问组件的任何子元素之前调用父类的方法。
This is a template method. a hook into the functionality of this class. Feel free to override it in child classes.
包含封装本组件的元素的父元素。
本组件的父容器的子元素集合中的索引。
Allows addition of behavior to the resize operation.
Called when Ext.resizer.Resizer#drag event is fired.
This is a template method. a hook into the functionality of this class. Feel free to override it in child classes.
跟踪视图中发生的事件，并保留水平滚动条的位置。
允许显示操作的行为。 父类的onShow事件后，组件将是可见的。
覆盖在子类中需要更复杂的行为。
相同的参数被传递 Gets passed the same parameters as show.
This is a template method. a hook into the functionality of this class. Feel free to override it in child classes.
方法afterShow 完成后调用。
获取通过相同的回调和范围，收到的#afterShow参数。
This is a template method. a hook into the functionality of this class. Feel free to override it in child classes.
任何stateEvents事件被触发将调用这个方法。
当视图宣布其内部的DOM已经就绪时，触发TablePanel的viewready事件。
返回在树的遍历顺序的前一个节点的组件.
注意 这并不限定于同级, 如果在同级找不到匹配节点, 会遍历树 以相反的方向来尝试找到一个匹配节点. 对比 previousSibling.
一个 ComponentQuery 选择器过滤过滤前面的节点.
前一个节点 (或者前一个匹配选择器的节点). 如果没有没有匹配的节点返回 null.
返回此组件的前一个同级组件.
随意选择前一个匹配 ComponentQuery 选择器的同级组件.
也可参考 prev()
注意 这仅限于同级, 并且如果没有同级组件匹配, 返回 null . 对比
previousNode
一个 ComponentQuery 选择器过滤前面的组件.
前一个同级组件 (或者前一个匹配选择器的同级组件). 如果没有没有匹配的同级组件返回 null.
处理来自视图的UI事件。传播到需要处理它们的任何内部组件。
事件类型，比如'click'
TableView组件
产生事件的 Cell HtmlElement
关联的存储模型的索引(如果找不到则为-1)
在行中的单元格索引
原始事件
用匹配选项检索容器的结构树. 执行一个 Ext.ComponentQuery方法.当前容器作为根节点.
符合Ext.ComponentQuery的匹配选项选择器 如果没有指定，所有的子项全部检索.
符合匹配选项的组件
在任何层级上查找符合条件的id或者是itemId的组件. 可以缩写为 ct.down('#' + id);
/itemId
符合的组件,如果没有找到返回null
使用一个新的store/columns配置项进行重新配置生成grid。 如果你不想改变store或者columns，他们任意一项均可以省略。
(可选) 新的store。
(可选) columns配置对象数组
Called by Component#doAutoRender
注册一个容器配置 floating: true 同这个组件的 ZIndexManager.
组件通过这种方式添加将不参与任何的布局, 但是首次显示时以 Window 这种方法来渲染.
从指定的Observable接替选定的事件就好像事件是this触发的。
例如，如果你想要扩展Grid, 你可能决定转发store的一些事件。 所以你能在你的initComponent中实现这个:
this.relayEvents(this.getStore(), ['load']);
grid实例将会有一个observable的'load'事件，
这个事件的参数是store的load事件的参数。任何grid的load事件触发的函数
可以使用this访问grid。
从父容器移除子组件. 触发beforeremove 事件 在移除之前, 触发remove 在移除以后
子组件的引用对象或者是组件的ID.
是否自动销毁，True的话将会调用 Ext.Component.destroy 方法.
默认是这个容器的配置对象 autoDestroy config.
被移除的子组件.
从父容器中移除所有子组件.
True将会自动销毁子组件 参见方法Ext.Component.destroy. 默认将会根据子组件的 autoDestroy 配置项决定是否自动销毁.
要移除的子组件的集合
Removes items in the childEls array based on the return value of a supplied test function. The function is called with a entry in childEls and if the test function return true, that entry is removed. If false, that entry is kept.
The test function.
从 uiCls 数组中移除一个 cls, 这也将调用 removeUIClsFromElement 并从该组件所有元素中移除它.
从panel中移除docked子项.
. 要移除的item.
(可选) 是否在移除后销毁item.
移除事件处理函数。
事件处理函数关联的事件类型
待移除的事件处理函数。 必须是对传递给addListener 的函数的引用。
(可选的) 原先为事件处理函数指定的作用域。 它必须是和原先调用addListener时指定的作用域参数是一样的，否者监听器将会被移除。
移除通过mon方法添加的监听器。
待移除监听器的项
事件名或者包含的事件名属性的对象。
(可选的) 如果ename参数是事件名, 这就是一个事件处理函数。
(可选的) 如果ename参数是事件名, 这就是(this引用的上下文)
事件处理函数执行的作用域。
方法, 移除一个特定的 UI + uiCls 到组件元素. 这是将添加到该元素的 cls :
this.baseCls + '-' + ui
从元素中添加的 UI
Method which removes a specified UI from the components element.
继续事件的触发(见suspendEvents)。
如果事件被使用queueSuspended参数挂起, 那么所有
在事件挂起期间触发的事件将会被发送到任意监听器。
保存对象的状态到持久存储。
滚动组件target element 的元素由传入三角点，选择动画。
以下是等价的:
comp.scrollBy(10, 10, true);
comp.scrollBy([10, 10], true);
comp.scrollBy({ x: 10, y: 10 }, true);
此方法仅供 Ext.ZIndexManager 内部调用, 用来标记一个浮动组件(floating Component)或者被移动到其 zIndex 栈的顶部, 或者从其zIndex 栈的顶部被推入(pushed from the top of its zIndex stack).
如果一个 Window 被另一个 Window 所取代, 则将其停用,并隐藏它的阴影.
此方法也将触发 activate 或者 deactivate 事件,取决于具体所发生的事情.
设置为true来激活组件,设 为 false 则停用.
Defaults to: false
新的 将霸占顶端的 zIndex 位置 的活动(active)组件.
autoScroll不适用于所有继承自TablePanel的类。
Overrides: Ext.Component.setAutoScroll
通过传进来的参数设置面板体样式
一个完整的样式规范字符串或对象，或要设置的样式属性的名称。
果第一个参数是一个样式属性的名称，样式属性值。
设置此组件在其父面板的停靠位置. 注意, 如果此组件是含有 DockLayout 的父面板的集合的一部分, 此设置才有效果.(注意, 任何面板上默认有一个 DockLayout)
this
设置组件的高度. 这个方法会触发 resize 事件.
设置的新的高度. 这可能是一种:
this
为Panel设置其自身头的图标. 参见 Ext.panel.Header.icon. 该方法将会触发组件的 iconchange 事件.
新的图标的路径
为Panel设置其自身头的图标样式. 参见 Ext.panel.Header.iconCls. 该方法将触发组件的 iconclschange 事件.
新的CSS样式的名字
此方法允许你显示或隐藏LoadMask这个组件上。
加载LoadMask显示默认为true LoadMask构造函数将被传递给一个配置对象， 或显示一个消息字符串。隐藏当前LoadMask为false。
如果为true掩盖的targetEl此组件，而不是的this.el。
例如，设置面板上true会导致容器被屏蔽。
Defaults to: false
LoadMask 实例
设置溢出x / y的内容元素的组件.x / y的溢出值可以是任何有效的CSS溢出 （例如，“自动”或“滚动”）.默认情况下，被'隐藏'。 传递null值将清除内联样式。传递未定义将保持当前值。
The overflow-x value. overflowX溢出x的值
The overflow-y value. overflowY溢出y的值
this
设置组件的宽度和高度. 此方法触发 resize 事件. 此方法可以接收单独的 width 或者 height 值作为参数,
或者你可以传递像这样的一个 size 对象: {width:10, height:20}.
设置新的宽度值. 这可以是:
{width: widthValue, height: heightValue}.undefined 保留原来的宽度不变.设置新的高度值 (如果第一个参数传递了一个size对象, 此参数没有必要传递). 这可以是:
undefined 保留原来的高度不变.this
设置包含属性数据的数据源对象。 数据对象可以包含一个或多个键/值对，所有对象的属性显示在grid中， 而这个数据将被自动加载到grid的store。 如果需要的话应该提供适当的数据类型，否则将会假定为字符串类型。 如果gird中已经存在数据，这个方法将会替换原来已经存在的数据 参见 source 配置项. 用例:
grid.setSource({
"(name)": "My Object",
"Created": Ext.Date.parse('10/15/2006', 'm/d/Y'), // date type
"Available": false, // boolean type
"Version": .01, // decimal type
"Description": "A test object"
});
数据对象
设置组件的宽度. 此方法触发 resize 事件.
设置新的宽度值. 这可以是:
this
Inject a reference to the function which applies the render template into the framing template. The framing template wraps the content.
显示此组件，使其自动解析autoRender或floating浮动，如果是'真'。
在显示之后，一个floating浮动的组分（如一个Ext.window.Window）， 被激活，并且其z-index stack的前面。
仅适用于floating组件如 Ext.window.Window或 ToolTips，或固定组件已配置浮动：true`。 组件动画从开通时的目标。
Defaults to: null
显示后的组件调用的回调函数。 只有必要的，如果指定的动画。
作用域 (this reference)，
其中执行回调。
this
显示组件在特定XY位置。 一个浮动的组件（如菜单）被定位相对如有 有用的弹出上下文菜单： Useful for popping up a context menu:
listeners: {
itemcontextmenu: function(view, record, item, index, event, options) {
Ext.create('Ext.menu.Menu', {
width: 100,
height: 100,
margin: '0 0 10 0',
items: [{
text: 'regular item 1'
},{
text: 'regular item 2'
},{
text: 'regular item 3'
}]
}).showAt(event.getXY());
}
}
该方法是漂浮的 Panel 开始滑出。
该方法清理滑出之后的 Panel
获取从该对象被实例化的类的引用。 请注意不同于 self,
this.statics()是独立的作用域，无论this是否运行，总是返回其中的调用类。
Ext.define('My.Cat', {
statics: {
totalCreated: 0,
speciesName: 'Cat' // My.Cat.speciesName = 'Cat'
},
constructor: function() {
var statics = this.statics();
alert(statics.speciesName); // 总是等于'Cat'，无论'this'是什么，
// 相当于：My.Cat.speciesName
alert(this.self.speciesName); // 依赖 'this'
statics.totalCreated++;
},
clone: function() {
var cloned = new this.self; // 依赖 'this'
cloned.groupName = this.statics().speciesName; // 相当于: My.Cat.speciesName
return cloned;
}
});
Ext.define('My.SnowLeopard', {
extend: 'My.Cat',
statics: {
speciesName: 'Snow Leopard' // My.SnowLeopard.speciesName = 'Snow Leopard'
},
constructor: function() {
this.callParent();
}
});
var cat = new My.Cat(); // alerts 'Cat', 然后提示 'Cat'
var snowLeopard = new My.SnowLeopard(); // alerts 'Cat', 然后提示 'Snow Leopard'
var clone = snowLeopard.clone();
alert(Ext.getClassName(clone)); // alerts 'My.SnowLeopard'
alert(clone.groupName); // alerts 'Cat'
alert(My.Cat.totalCreated); // alerts 3
停止所有正在运行的特效,并清空此对象内部特效队列,如果此队列包含有尚未开始执行的那些特效.
This method has been deprecated
从 4.0 开始被 stopAnimation 替代
The Element
挂起所有事件的触发。(见resumeEvents)
传true，让挂起的事件排队而不是丢弃所有挂起的事件， 这些事件将会在调用resumeEvents之后触发。
将此浮动组件置于同一 ZIndexManager 管理器所管理的所有可见元素的顶层.
如果此组件式模态(modal)的, 以比此组件只小一点的 z-index值 插入模态遮罩层.
指定为 true 来阻止此组件获得焦点.
Defaults to: false
this
配置扩展
removeListener的简写方法
移除事件处理函数。
事件处理函数关联的事件类型
待移除的事件处理函数。 必须是对传递给addListener 的函数的引用。
(可选的) 原先为事件处理函数指定的作用域。 它必须是和原先调用addListener时指定的作用域参数是一样的，否者监听器将会被移除。
沿着 ownerCt 查找匹配简单选择器的祖先容器.
例如:
var owningTabPanel = grid.up('tabpanel');
用来检验的简单选择器.
匹配的祖先容器 (或者 undefined 如果未找到匹配).
刷新组件的内部区域.
如果已经通过tpl为当前组件配置了一个模板, 那么将会使用此参数来装配模板. 如果没有为当前组件配置模板, 组件的内容区域将会通过 Ext.Element 进行刷新.
只有在使用 html 配置时此参数才合法.
Defaults to: false
只有在使用 html 配置时此参数才合法. 当脚本加载完成时回调函数才被执行.
Injected as an override by Ext.Aria.initialize
方法/属性添加到这个类的原型。
Ext.define('My.awesome.Cat', {
constructor: function() {
...
}
});
My.awesome.Cat.implement({
meow: function() {
alert('Meowww...');
}
});
var kitty = new My.awesome.Cat;
kitty.meow();
成员
添加/重写这个类的静态属性。
Ext.define('My.cool.Class', {
...
});
My.cool.Class.addStatics({
someProperty: 'someValue', // My.cool.Class.someProperty = 'someValue'
method1: function() { ... }, // My.cool.Class.method1 = function() { ... };
method2: function() { ... } // My.cool.Class.method2 = function() { ... };
});
成员
this
这个类的原型借用另一个类的成员
Ext.define('Bank', {
money: '$$$',
printMoney: function() {
alert('$$$$$$$');
}
});
Ext.define('Thief', {
...
});
Thief.borrow(Bank, ['money', 'printMoney']);
var steve = new Thief();
alert(steve.money); // alerts '$$$'
steve.printMoney(); // alerts '$$$$$$$'
this 借用成员
创建这个类的新实例。
Ext.define('My.cool.Class', {
...
});
My.cool.Class.create({
someConfig: true
});
所有参数传递至类的构造。
创建的实例。
创建现有的原型方法的别名。例如：
Ext.define('My.cool.Class', {
method1: function() { ... },
method2: function() { ... }
});
var test = new My.cool.Class();
My.cool.Class.createAlias({
method3: 'method1',
method4: 'method2'
});
test.method3(); // test.method1()
My.cool.Class.createAlias('method5', 'method3');
test.method5(); // test.method3() -> test.method1()
别名新方法的名称，或对象设置多个别名。 参见flexSetter
原来的方法名
以字符串格式，获取当前类的名称。
Ext.define('My.cool.Class', {
constructor: function() {
alert(this.self.getName()); // alerts 'My.cool.Class'
}
});
My.cool.Class.getName(); // 'My.cool.Class'
className 类名
重写这个类的成员。通过callParent重写的方法可以调用。
Ext.define('My.Cat', {
constructor: function() {
alert("I'm a cat!");
}
});
My.Cat.override({
constructor: function() {
alert("I'm going to be a cat!");
this.callParent(arguments);
alert("Meeeeoooowwww");
}
});
var kitty = new My.Cat(); // alerts "I'm going to be a cat!我要成为一只猫！"
// alerts "I'm a cat!我是一只猫！"
// alerts "Meeeeoooowwww"
在4.1版本, 直接利用这种方法已经过时了。 使用 Ext.define 代替:
Ext.define('My.CatOverride', {
override: 'My.Cat',
constructor: function() {
alert("I'm going to be a cat!");
this.callParent(arguments);
alert("Meeeeoooowwww");
}
});
以上完成了相同的结果，但可以由Ext.Loader重写， 其目标类和生成过程中，可以决定是否需要根据目标类所需的状态覆盖管理(My.Cat)。
This method has been deprecated since 4.1.0
使用 Ext.define 代替
添加到这个类的属性。 这应当被指定为一个对象包含一个或多个属性的文字。
this class 当前类
组件激活后触发.
The options object passed to Ext.util.Observable.addListener.
在添加或者插入完成Ext.Component后触发.
这个事件会自动冒泡: 'add' 当这个添加的子组件的子项添加子组件的的时候 ...
要添加的子组件
组件被添加到容器在子组件集合中时的索引位置
The options object passed to Ext.util.Observable.addListener.
组件被添加到一个容器后触发.
父容器
组件的位置索引
The options object passed to Ext.util.Observable.addListener.
当容器中的组件被指定的布局管理器排列的时候触发。
为当前容器提供的实现
The options object passed to Ext.util.Observable.addListener.
在组件渲染完成之后触发.
afterrender 事件在当前组件被 rendered 之后, 在为组件定义的所有afterRender方法执行之后 触发.
The options object passed to Ext.util.Observable.addListener.
组件激活前触发. 事件监听返回 false 能阻止激活的发生.
The options object passed to Ext.util.Observable.addListener.
在任何Ext.Component被添加或者插入到容器中之前触发。 事件处理器可以返回false取消添加操作。
要添加的子组件
组件被添加到容器在子组件集合中时的索引位置
The options object passed to Ext.util.Observable.addListener.
在Panel被关闭之前触发.处理函数可以返回false以取消关闭操作。
正在被关闭的Panel。
The options object passed to Ext.util.Observable.addListener.
在Panel被折叠之前触发. 监听器可以返回false取消折叠。
被折叠的Panel。
折叠的方向。 可配置以下当中的任一一个
如果折叠操作启用动画效果，为true，其它为false。
The options object passed to Ext.util.Observable.addListener.
容器中的单击事件之前 在容器中的click事件被处理之前触发。返回false取消默认动作。
指向Ext.view.View
事件对象
The options object passed to Ext.util.Observable.addListener.
容器中的双击事件之前 在容器中的dblclick事件被处理之前触发。返回false取消默认动作。
指向Ext.view.View
事件对象
The options object passed to Ext.util.Observable.addListener.
容器上的鼠标按下事件之前 在容器中的mousedown事件被处理之前触发。返回false取消默认动作。
指向Ext.view.View
事件对象
The options object passed to Ext.util.Observable.addListener.
容器上的鼠标移出事件之前 在容器中的mouseout事件被处理之前触发。返回false取消默认动作。
指向Ext.view.View
事件对象
The options object passed to Ext.util.Observable.addListener.
容器上的鼠标悬停事件之前 在容器中的mouseover事件被处理之前触发。返回false取消默认动作。
指向Ext.view.View
事件对象
The options object passed to Ext.util.Observable.addListener.
容器上的鼠标释放事件之前 在容器中的mouseup事件被处理之前触发。 返回false取消默认动作。
指向Ext.view.View
事件对象
The options object passed to Ext.util.Observable.addListener.
组件失去激活前触发. 事件监听返回 false 能阻止失去激活的发生.
The options object passed to Ext.util.Observable.addListener.
取消选择一条记录前触发。 如果任何监听器返回假， 取消取消选择。
被取消选择的记录
被取消选择的行索引
The options object passed to Ext.util.Observable.addListener.
组件被 destroy前触发. 在事件监听中返回 false 可以停止destroy操作.
The options object passed to Ext.util.Observable.addListener.
从Ext.grid.plugin.Editing转发的事件.
触发事件在开始编辑之前.事件处理返回false则停止编辑.
这个编辑事件具有以下属性:
The options object passed to Ext.util.Observable.addListener.
在Panel被展开之前触发. 监听器可以返回false取消展开操作。
被展开的Panel.
如果展开操作启用动画效果，为true，其它为false。
The options object passed to Ext.util.Observable.addListener.
当调用 hide 方法组件隐藏前触发. 从事件处理返回 false 将停止隐藏.
The options object passed to Ext.util.Observable.addListener.
单击选项之前 在选项上的click事件被处理之前触发。返回false取消默认动作。
指向Ext.view.View
属于选项的记录
选项元素
选项索引
事件对象
The options object passed to Ext.util.Observable.addListener.
双击选项之前 在选项上的dblclick事件被处理之前触发。返回false取消默认动作。
指向Ext.view.View
属于选项的记录
选项元素
选项索引
事件对象
The options object passed to Ext.util.Observable.addListener.
选项鼠标按下之前 在选项上的mousedown事件被处理之前触发。返回false取消默认动作。
指向Ext.view.View
属于选项的记录
选项元素
选项索引
事件对象
The options object passed to Ext.util.Observable.addListener.
选项鼠标移入之前 在选项上的mouseenter事件被处理之前触发。返回false取消默认动作。
指向Ext.view.View
属于选项的记录
选项元素
选项索引
事件对象
The options object passed to Ext.util.Observable.addListener.
选项鼠标移开之前 在选项上的mouseleave事件被处理之前触发。返回false取消默认动作。
指向Ext.view.View
属于选项的记录
选项元素
选项索引
事件对象
The options object passed to Ext.util.Observable.addListener.
选项鼠标释放之前 在选项上的mouseup事件被处理之前触发。返回false取消默认动作。
指向Ext.view.View
属于选项的记录
选项元素
选项索引
事件对象
The options object passed to Ext.util.Observable.addListener.
在一个属性值改变的时候触发。处理结果如果返回false则取消属性值更改。 (这个将在属性记录 Ext.data.Model.reject 的内部调用 ).
f从容器中删除任何Ext.Component 之前触发。 处理器可以返回false取消remove操作。
The component being removed
The options object passed to Ext.util.Observable.addListener.
在组件渲染 rendered之前触发. 在事件监听器中返回 false 可以停止render操作.
The options object passed to Ext.util.Observable.addListener.
选择一条记录前触发。 如果任何监听器返回假，取消选择。
被选择的记录
被选择的记录的行索引
The options object passed to Ext.util.Observable.addListener.
当调用 show 方法组件显示前触发. 从事件处理返回 false 将停止显示.
The options object passed to Ext.util.Observable.addListener.
在state对象被恢复之前触发。从一个事件处理程序返回false来阻止恢复。
散列值StateProvider返回的状态。 如果这个事件没有被禁止，然而state对象被传递到applyState。 默认情况下，这只是拷贝到这个对象的属性值。 重载的方法也许来提供自定义的状态恢复。
The options object passed to Ext.util.Observable.addListener.
在state对象保存到配置state的提供者之前触发。返回false来阻止保存。
state的散列值。这是通过调用getState()确定的对象。
这个方法必须由开发人员提供返回什么来代表state是必须的， 默认情况下，Ext.state.Stateful有一个null实现。
The options object passed to Ext.util.Observable.addListener.
组件失去焦点时触发.
blur event.
The options object passed to Ext.util.Observable.addListener.
在Panel被重置大小后出发
被重置大小的Panel
Panel被重置大小后的新宽度
Panel被重置大小后的新高度
The options object passed to Ext.util.Observable.addListener.
触发 一次 - 组件首次布局初始化大小后触发.
The initial width
The initial height
The options object passed to Ext.util.Observable.addListener.
从Ext.grid.plugin.Editing转发的事件.
触发事件当用户开始编辑之后又取消编辑以后.
这个编辑事件具有以下属性：
The options object passed to Ext.util.Observable.addListener.
单击表格单元格时触发。
所单击的TD元素。
所单击的TR元素。
The options object passed to Ext.util.Observable.addListener.
双击表格单元格时触发。
所双击的TD元素。
所双击的TR元素。
The options object passed to Ext.util.Observable.addListener.
在Panel被关闭之后触发。
正在被关闭的Panel。
The options object passed to Ext.util.Observable.addListener.
在Panel折叠时候触发。
被折叠的Panel。
The options object passed to Ext.util.Observable.addListener.
列隐藏
这个grid的header Container里面封装了所以的header的配置项.
Column header Component里面封装了所有的Column配置项.
The options object passed to Ext.util.Observable.addListener.
列移动
这个grid的header Container里面封装了所以的header的配置项.
Column header Component里面封装了所有的Column配置项.
The options object passed to Ext.util.Observable.addListener.
改变列大小
这个grid的header Container里面封装了所以的header的配置项.
Column header Component里面封装了所有的Column配置项.
宽度
The options object passed to Ext.util.Observable.addListener.
列显示
这个grid的header Container里面封装了所以的header的配置项.
Column header Component里面封装了所有的Column配置项.
The options object passed to Ext.util.Observable.addListener.
容器上的单击事件 容器被单击时触发。
指向Ext.view.View
事件对象
The options object passed to Ext.util.Observable.addListener.
容器上的双击事件 容器被双击时触发。
指向Ext.view.View
事件对象
The options object passed to Ext.util.Observable.addListener.
容器上的鼠标移出事件 当你将鼠标移出容器时触发。
指向Ext.view.View
事件对象
The options object passed to Ext.util.Observable.addListener.
容器上的鼠标悬停事件 当你将鼠标移动到容器时触发。
指向Ext.view.View
事件对象
The options object passed to Ext.util.Observable.addListener.
容器上的鼠标释放事件 在容器上有鼠标释放时触发。
指向Ext.view.View
事件对象
The options object passed to Ext.util.Observable.addListener.
组件失去激活后触发.
The options object passed to Ext.util.Observable.addListener.
取消选择一条记录后触发。
被取消选择的记录
被取消选择的行索引
The options object passed to Ext.util.Observable.addListener.
在组件被 destroy 之后触发.
The options object passed to Ext.util.Observable.addListener.
组件被禁用后触发.
The options object passed to Ext.util.Observable.addListener.
从Ext.grid.plugin.Editing转发的事件.
开始编辑以后触发事件. 例子:
grid.on('edit', function(editor, e) {
// 编辑完成后，提交更改
e.record.commit();
});
这个编辑事件具有以下属性:
The options object passed to Ext.util.Observable.addListener.
组件被启用后触发.
The options object passed to Ext.util.Observable.addListener.
在Panel被展开之后触发。
被展开的Panel。
The options object passed to Ext.util.Observable.addListener.
组件获取焦点时触发.
focus event.
The options object passed to Ext.util.Observable.addListener.
组件被隐藏后触发, 当调用 hide 方法隐藏组件后触发.
The options object passed to Ext.util.Observable.addListener.
当Panel图标改变或重置的时候触发。
被重置的图标的Panel。
新的图标。
原始的图标。
The options object passed to Ext.util.Observable.addListener.
当Panel图标样式改变或者被重置时触发。
被重置图标样式的Panel。
新的图标样式。
原始的图标样式。
The options object passed to Ext.util.Observable.addListener.
选项的单击事件 单击选项时触发。
指向Ext.view.View
属于选项的记录
选项元素
选项索引
事件对象
The options object passed to Ext.util.Observable.addListener.
选项的双击事件 双击选项时触发。
指向Ext.view.View
属于选项的记录
选项元素
选项索引
事件对象
The options object passed to Ext.util.Observable.addListener.
选项的鼠标按下事件 当鼠标按下选项时触发
指向Ext.view.View
属于选项的记录
选项元素
选项索引
事件对象
The options object passed to Ext.util.Observable.addListener.
选项的鼠标移入事件 当鼠标移入选项时触发
指向Ext.view.View
属于选项的记录
选项元素
选项索引
事件对象
The options object passed to Ext.util.Observable.addListener.
选项的鼠标移开事件 当鼠标移开选项时触发
指向Ext.view.View
属于选项的记录
选项元素
选项索引
事件对象
The options object passed to Ext.util.Observable.addListener.
选项的鼠标释放事件 当鼠标释放选项时触发
指向Ext.view.View
属于选项的记录
选项元素
选项索引
事件对象
The options object passed to Ext.util.Observable.addListener.
组件移动之后触发.
新的X坐标
新的Y坐标
The options object passed to Ext.util.Observable.addListener.
在reconfigure事件之后触发。
传递到reconfigure方法中的store
传递到reconfigure方法中的column配置对象
The options object passed to Ext.util.Observable.addListener.
当移除子组件 Ext.Component 的时候触发.
这个事件会自动冒泡: 'remove' 当这个添加的子组件的子项移除子组件的的时候 ...
要移除的子组件
The options object passed to Ext.util.Observable.addListener.
当组件从一个容器中移除时触发
持有组件的容器
The options object passed to Ext.util.Observable.addListener.
在组件被 rendered 之后触发.
The options object passed to Ext.util.Observable.addListener.
在组件被调整大小之后触发. 注意在首次布局初始化大小时 不 触发. 在生命周期里, 使用 boxready 事件.
这是宽度调整后的值
这是高度调整后的值
这是原来的宽度
这是原来的高度
The options object passed to Ext.util.Observable.addListener.
选择完一条记录后触发。
被选择的记录
被选择的记录的行索引
The options object passed to Ext.util.Observable.addListener.
一个选项发生改变之后触发。
选择的记录
The options object passed to Ext.util.Observable.addListener.
当调用 show 方法组件显示后触发.
The options object passed to Ext.util.Observable.addListener.
排序改变
这个grid的header Container里面封装了所以的header的配置项.
Column header Component里面封装了所有的Column配置项.
The options object passed to Ext.util.Observable.addListener.
在state对象被恢复之后触发。
散列值StateProvider返回的状态。state对象被传递到applyState。 默认情况下，这只是拷贝到这个对象的属性值。 重载的方法也许来提供自定义的状态恢复。
The options object passed to Ext.util.Observable.addListener.
在state对象保存到配置state的提供者之后触发。
state的散列值。这是通过调用getState()确定的对象。
这个方法必须由开发人员提供返回什么代表state是必须的， 默认情况下，Ext.state.Stateful有一个null实现。
The options object passed to Ext.util.Observable.addListener.
当Panel的title被重置或改变的时候触发。
被重置title的Panel。
新的title内容。
原始的title内容。
The options object passed to Ext.util.Observable.addListener.
从Ext.grid.plugin.Editing转发的事件.
在编辑以后触发该事件,但是在设置值到record之前，如果事件处理返回false会取消更改。
示例显示如何移除一些记录(不是全部)的右上角的红三角形(脏数据编辑标志). 通过观察gird的validateedit事件, 如果是有针对性的进行行编辑的话，它可以取消编辑，然后设置该字段的新值到record中。 例子：
grid.on('validateedit', function(editor, e) {
var myTargetRow = 6;
if (e.rowIdx == myTargetRow) {
e.cancel = true;
e.record.data[e.field] = e.value;
}
});
这个编辑事件具有以下属性：
The options object passed to Ext.util.Observable.addListener.
当表格视图可用时触发(使用此事件来选择默认的行)。
The options object passed to Ext.util.Observable.addListener.