/**
- * @class Ext.layout.Layout
- * @extends Object
- * @private
- * Base Layout class - extended by ComponentLayout and ContainerLayout
+ * Base Layout class - extended by ComponentLayout and ContainerLayout
*/
-
Ext.define('Ext.layout.Layout', {
/* Begin Definitions */
@@ -37,12 +33,12 @@ Ext.define('Ext.layout.Layout', {
if (layout instanceof Ext.layout.Layout) {
return Ext.createByAlias('layout.' + layout);
} else {
- if (Ext.isObject(layout)) {
- type = layout.type;
+ if (!layout || typeof layout === 'string') {
+ type = layout || defaultType;
+ layout = {};
}
else {
- type = layout || defaultType;
- layout = {};
+ type = layout.type || defaultType;
}
return Ext.createByAlias('layout.' + type, layout || {});
}
@@ -78,27 +74,34 @@ Ext.define('Ext.layout.Layout', {
},
beforeLayout : function() {
- this.renderItems(this.getLayoutItems(), this.getRenderTarget());
+ this.renderChildren();
return true;
},
+ renderChildren: function () {
+ this.renderItems(this.getLayoutItems(), this.getRenderTarget());
+ },
+
/**
* @private
* Iterates over all passed items, ensuring they are rendered. If the items are already rendered,
* also determines if the items are in the proper place dom.
*/
renderItems : function(items, target) {
- var ln = items.length,
+ var me = this,
+ ln = items.length,
i = 0,
item;
for (; i < ln; i++) {
item = items[i];
if (item && !item.rendered) {
- this.renderItem(item, target, i);
- }
- else if (!this.isValidParent(item, target, i)) {
- this.moveItem(item, target, i);
+ me.renderItem(item, target, i);
+ } else if (!me.isValidParent(item, target, i)) {
+ me.moveItem(item, target, i);
+ } else {
+ // still need to configure the item, it may have moved in the container.
+ me.configureItem(item);
}
}
},
@@ -119,14 +122,21 @@ Ext.define('Ext.layout.Layout', {
* @private
* Renders the given Component into the target Element.
* @param {Ext.Component} item The Component to render
- * @param {Ext.core.Element} target The target Element
+ * @param {Ext.Element} target The target Element
* @param {Number} position The position within the target to render the item to
*/
renderItem : function(item, target, position) {
+ var me = this;
if (!item.rendered) {
+ if (me.itemCls) {
+ item.addCls(me.itemCls);
+ }
+ if (me.owner.itemCls) {
+ item.addCls(me.owner.itemCls);
+ }
item.render(target, position);
- this.configureItem(item);
- this.childrenChanged = true;
+ me.configureItem(item);
+ me.childrenChanged = true;
}
},
@@ -152,10 +162,13 @@ Ext.define('Ext.layout.Layout', {
* initialized flag when complete.
*/
initLayout : function() {
- if (!this.initialized && !Ext.isEmpty(this.targetCls)) {
- this.getTarget().addCls(this.targetCls);
+ var me = this,
+ targetCls = me.targetCls;
+
+ if (!me.initialized && !Ext.isEmpty(targetCls)) {
+ me.getTarget().addCls(targetCls);
}
- this.initialized = true;
+ me.initialized = true;
},
// @private Sets the layout owner
@@ -168,22 +181,12 @@ Ext.define('Ext.layout.Layout', {
return [];
},
- /**
+ /**
* @private
* Applies itemCls
+ * Empty template method
*/
- configureItem: function(item) {
- var me = this,
- el = item.el,
- owner = me.owner;
-
- if (me.itemCls) {
- el.addCls(me.itemCls);
- }
- if (owner.itemCls) {
- el.addCls(owner.itemCls);
- }
- },
+ configureItem: Ext.emptyFn,
// Placeholder empty functions for subclasses to extend
onLayout : Ext.emptyFn,
@@ -197,30 +200,41 @@ Ext.define('Ext.layout.Layout', {
* Removes itemCls
*/
afterRemove : function(item) {
- var me = this,
- el = item.el,
- owner = me.owner;
+ var el = item.el,
+ owner = this.owner,
+ itemCls = this.itemCls,
+ ownerCls = owner.itemCls;
- if (item.rendered) {
- if (me.itemCls) {
- el.removeCls(me.itemCls);
+ // Clear managed dimensions flag when removed from the layout.
+ if (item.rendered && !item.isDestroyed) {
+ if (itemCls) {
+ el.removeCls(itemCls);
}
- if (owner.itemCls) {
- el.removeCls(owner.itemCls);
+ if (ownerCls) {
+ el.removeCls(ownerCls);
}
}
+
+ // These flags are set at the time a child item is added to a layout.
+ // The layout must decide if it is managing the item's width, or its height, or both.
+ // See AbstractComponent for docs on these properties.
+ delete item.layoutManagedWidth;
+ delete item.layoutManagedHeight;
},
- /*
- * Destroys this layout. This is a template method that is empty by default, but should be implemented
+ /**
+ * Destroys this layout. This is a template method that is empty by default, but should be implemented
* by subclasses that require explicit destruction to purge event handlers or remove DOM nodes.
- * @protected
+ * @template
*/
destroy : function() {
- if (!Ext.isEmpty(this.targetCls)) {
- var target = this.getTarget();
+ var targetCls = this.targetCls,
+ target;
+
+ if (!Ext.isEmpty(targetCls)) {
+ target = this.getTarget();
if (target) {
- target.removeCls(this.targetCls);
+ target.removeCls(targetCls);
}
}
this.onDestroy();