-<!DOCTYPE html><html><head><title>Sencha Documentation Project</title><link rel="stylesheet" href="../reset.css" type="text/css"><link rel="stylesheet" href="../prettify.css" type="text/css"><link rel="stylesheet" href="../prettify_sa.css" type="text/css"><script type="text/javascript" src="../prettify.js"></script></head><body onload="prettyPrint()"><pre class="prettyprint"><pre><span id='Ext-layout.Layout'>/**
-</span> * @class Ext.layout.Layout
- * @extends Object
- * @private
- * Base Layout class - extended by ComponentLayout and ContainerLayout
+<!DOCTYPE html>
+<html>
+<head>
+ <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+ <title>The source code</title>
+ <link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />
+ <script type="text/javascript" src="../resources/prettify/prettify.js"></script>
+ <style type="text/css">
+ .highlight { display: block; background-color: #ddd; }
+ </style>
+ <script type="text/javascript">
+ function highlight() {
+ document.getElementById(location.hash.replace(/#/, "")).className = "highlight";
+ }
+ </script>
+</head>
+<body onload="prettyPrint(); highlight();">
+ <pre class="prettyprint lang-js"><span id='Ext-layout-Layout'>/**
+</span> * Base Layout class - extended by ComponentLayout and ContainerLayout
*/
-
Ext.define('Ext.layout.Layout', {
/* Begin Definitions */
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 || {});
}
Ext.apply(this, config);
},
-<span id='Ext-layout.Layout-method-layout'> /**
+<span id='Ext-layout-Layout-method-layout'> /**
</span> * @private
*/
layout : function() {
},
beforeLayout : function() {
- this.renderItems(this.getLayoutItems(), this.getRenderTarget());
+ this.renderChildren();
return true;
},
-<span id='Ext-layout.Layout-method-renderItems'> /**
+ renderChildren: function () {
+ this.renderItems(this.getLayoutItems(), this.getRenderTarget());
+ },
+
+<span id='Ext-layout-Layout-method-renderItems'> /**
</span> * @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);
}
}
},
return false;
},
-<span id='Ext-layout.Layout-method-renderItem'> /**
+<span id='Ext-layout-Layout-method-renderItem'> /**
</span> * @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;
}
},
-<span id='Ext-layout.Layout-method-moveItem'> /**
+<span id='Ext-layout-Layout-method-moveItem'> /**
</span> * @private
* Moved Component to the provided target instead.
*/
this.childrenChanged = true;
},
-<span id='Ext-layout.Layout-method-initLayout'> /**
+<span id='Ext-layout-Layout-method-initLayout'> /**
</span> * @private
* Adds the layout's targetCls if necessary and sets
* 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
return [];
},
-<span id='Ext-layout.Layout-method-configureItem'> /**
+<span id='Ext-layout-Layout-property-configureItem'> /**
</span> * @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,
onDestroy : Ext.emptyFn,
doOwnerCtLayouts : Ext.emptyFn,
-<span id='Ext-layout.Layout-method-afterRemove'> /**
+<span id='Ext-layout-Layout-method-afterRemove'> /**
</span> * @private
* 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
+<span id='Ext-layout-Layout-method-destroy'> /**
+</span> * 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();
}
-});</pre></pre></body></html>
\ No newline at end of file
+});</pre>
+</body>
+</html>
git.ithinksw.org / extjs.git / blobdiff