Hierarchy
Ext.BaseExt.layout.LayoutExt.layout.component.ComponentSubclasses
Files
NOTE This is a private utility class for internal use by the framework. Don't rely on its existence.
此类应通过layout属性来扩展和创建. 详情参见Ext.Component.componentLayout
扩展事件
Defaults to: []
本身
获取当前类的引用，此对象被实例化。不同于 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'
成员
在所有计算循环开始前对布局进行预处理.
覆盖时注意: 此函数处于DOM写阶段, 须避免任何对DOM的读操作.
此布局所属组件的上下文环境项.
在所有计算循环开始前重置DOM属性值, 对计算进行预处理.
覆盖时注意: 此函数处于DOM写阶段, 须避免任何对DOM的读操作.
此布局所属组件的上下文环境项.
执行当前布局的计算. 此函数至少会被调用一次, 如果属性done在返回前被标记为未完成状态,则将 重复调用此函数. 在刚进入此函数时done的属性值总是为'true'.
覆盖时注意: 此函数处于DOM读阶段, 须避免任何对DOM的写操作. 作为代替, DOM的写操作应该被写入 Ext.layout.ContextItem中以在下次刷新时更新DOM.
此布局所属组件的上下文环境项.
调用原来的方法，这是以前的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)
返回调用父类的方法的结果。
此函数(如果被实现)会在布局即将完成循环周期(done没有被设为'false')时被调用. 一个布局 有可能在计算完成后而循环结束前就已经被清除, 这种情况下, 此函数将不被调用. 布局也可能在此函数调用 之后被执行清除, 这将导致calculate计算函数被重新执行, 然后再次调用此函数.
覆盖时注意: 此函数处于DOM读阶段, 须避免任何对DOM的写操作. 作为代替, DOM的写操作应该被写入 Ext.layout.ContextItem中以在下次刷新时更新DOM.
子类不一定要实现此函数, 事实上, 应仅在必要时才实现.
此布局所属组件的上下文环境项.
销毁此布局. 函数会从目标元素(target)中删除一个目标样式(targetCls)并调用'onDestroy'.
子类可以覆盖此函数或'onDestroy', 但是所有实现必须调用基类函数, 使基类能够完成清除工作.
此函数(或'onDestroy')可以由子类覆盖, 以用来清除事件处理或清除未直接管理的DOM节点.
此函数(如果被实现)会在所有布局计算结束后调用. 很多方面与completeLayout类似. 此函数 可以对当前(或其他)布局变进行清除(参见Ext.layout.Context.invalidate), 但是最好避免这种 情况. 此函数应用来进行最后的读取操作, 所以最好不要在这个阶段进行任何清除布局操作. 不过此函数仍可以 用来执行最后的检查操作, 即使这些检查可能需要所有其他的布局都完成计算并清除某些计算结果.
覆盖时注意: 此函数处于DOM读阶段, 须避免任何对DOM的写操作. 作为代替, DOM的写操作应该被写入 Ext.layout.ContextItem中以在下次刷新时更新DOM.
子类不一定要实现此函数, 事实上, 应仅在必要时才实现.
此布局所属组件的上下文环境项.
此函数在所有布局都完成计算且计算结构都刷新到DOM时调用. 不会再有更多的布局被执行, 且此函数在每个 布局的执行过程中仅被调用一次. 基类组件布局会缓存lastComponentSize.
覆盖时注意: 此函数处于DOM写入阶段, 须避免任何对DOM的读操作.
子类不一定要实现此函数, 事实上, 应仅在必要时才实现.
此布局所属组件的上下文环境项.
返回布局的子项集合. (默认为空集合).
这个类的初始化配置。典型例子:
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 混入原型 键-值对
在渲染前仅执行一次的初始化函数.
此函数(如果被实现)在所有布局都结束时调用, 且每个布局都有对lastComponentSize的缓存. 不会再有更多的布局被执行, 且此函数在每个布局的执行过程中仅被调用一次. 此函数与beginLayout 一起组成整个布局过程的始末.
覆盖时注意: 此函数处于DOM写入阶段, 须避免任何对DOM的读操作. 这是一个对过程全捕获的结尾函数, 所以 规则相对宽松. 即便如此, 处于性能的考虑, 最好也要避免对DOM的读取操作. 如果必须进行读操作, 考虑覆盖 实现finalizeLayout函数来进行所需地读操作.
子类不一定要实现此函数, 事实上, 应仅在必要时才实现.
此布局所属组件的上下文环境项.
当组件内容的子项发送某种变化时, 调用此函数. 此函数默认调用布局所属组件的 Ext.AbstractComponent.updateLayout函数.
被改变的子组件.
返回'true'表示布局已对内容的变化进行处理.
将组件渲染到目标元素(Element)上
待渲染组件
模板元素
组件被渲染插入到模板元素中的位置
获取从该对象被实例化的类的引用。 请注意不同于 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
配置扩展
方法/属性添加到这个类的原型。
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 当前类