X-Git-Url: http://git.ithinksw.org/extjs.git/blobdiff_plain/6746dc89c47ed01b165cc1152533605f97eb8e8d..HEAD:/docs/source/Auto2.html
diff --git a/docs/source/Auto2.html b/docs/source/Auto2.html
index 9e758116..a6e6895b 100644
--- a/docs/source/Auto2.html
+++ b/docs/source/Auto2.html
@@ -3,8 +3,8 @@
The source code
-
-
+
+
@@ -15,29 +15,82 @@
- /**
- * @class Ext.layout.component.Auto
- * @extends Ext.layout.component.Component
- * @private
+ /**
+ * @class Ext.layout.container.Auto
+ * @extends Ext.layout.container.Container
*
- * <p>The AutoLayout is the default layout manager delegated by {@link Ext.Component} to
- * render any child Elements when no <tt>{@link Ext.Component#layout layout}</tt> is configured.</p>
+ * The AutoLayout is the default layout manager delegated by {@link Ext.container.Container} to
+ * render any child Components when no `{@link Ext.container.Container#layout layout}` is configured into
+ * a `{@link Ext.container.Container Container}.` AutoLayout provides only a passthrough of any layout calls
+ * to any child containers.
+ *
+ * @example
+ * Ext.create('Ext.Panel', {
+ * width: 500,
+ * height: 280,
+ * title: "AutoLayout Panel",
+ * layout: 'auto',
+ * renderTo: document.body,
+ * items: [{
+ * xtype: 'panel',
+ * title: 'Top Inner Panel',
+ * width: '75%',
+ * height: 90
+ * },
+ * {
+ * xtype: 'panel',
+ * title: 'Bottom Inner Panel',
+ * width: '75%',
+ * height: 90
+ * }]
+ * });
*/
-
-Ext.define('Ext.layout.component.Auto', {
+Ext.define('Ext.layout.container.Auto', {
/* Begin Definitions */
- alias: 'layout.autocomponent',
+ alias: ['layout.auto', 'layout.autocontainer'],
- extend: 'Ext.layout.component.Component',
+ extend: 'Ext.layout.container.Container',
/* End Definitions */
- type: 'autocomponent',
+ type: 'autocontainer',
+
+ bindToOwnerCtComponent: true,
+
+ // @private
+ onLayout : function(owner, target) {
+ var me = this,
+ items = me.getLayoutItems(),
+ ln = items.length,
+ i;
+
+ // Ensure the Container is only primed with the clear element if there are child items.
+ if (ln) {
+ // Auto layout uses natural HTML flow to arrange the child items.
+ // To ensure that all browsers (I'm looking at you IE!) add the bottom margin of the last child to the
+ // containing element height, we create a zero-sized element with style clear:both to force a "new line"
+ if (!me.clearEl) {
+ me.clearEl = me.getRenderTarget().createChild({
+ cls: Ext.baseCSSPrefix + 'clear',
+ role: 'presentation'
+ });
+ }
+
+ // Auto layout allows CSS to size its child items.
+ for (i = 0; i < ln; i++) {
+ me.setItemSize(items[i]);
+ }
+ }
+ },
+
+ configureItem: function(item) {
+ this.callParent(arguments);
- onLayout : function(width, height) {
- this.setTargetSize(width, height);
+ // Auto layout does not manage any dimensions.
+ item.layoutManagedHeight = 2;
+ item.layoutManagedWidth = 2;
}
});