X-Git-Url: http://git.ithinksw.org/extjs.git/blobdiff_plain/7a654f8d43fdb43d78b63d90528bed6e86b608cc..HEAD:/docs/source/VBox.html diff --git a/docs/source/VBox.html b/docs/source/VBox.html index 4f786265..8ee24661 100644 --- a/docs/source/VBox.html +++ b/docs/source/VBox.html @@ -1,37 +1,55 @@ -Sencha Documentation Project
/**
- * @class Ext.layout.container.VBox
- * @extends Ext.layout.container.Box
- * <p>A layout that arranges items vertically down a Container. This layout optionally divides available vertical
- * space between child items containing a numeric <code>flex</code> configuration.</p>
+
+
+
+  
+  The source code
+  
+  
+  
+  
+
+
+  
/**
+ * A layout that arranges items vertically down a Container. This layout optionally divides available vertical space
+ * between child items containing a numeric `flex` configuration.
+ *
  * This layout may also be used to set the widths of child items by configuring it with the {@link #align} option.
- * {@img Ext.layout.container.VBox/Ext.layout.container.VBox.png Ext.layout.container.VBox container layout}
- * Example usage:
-	Ext.create('Ext.Panel', {
-		width: 500,
-		height: 400,
-		title: "VBoxLayout Panel",
-		layout: {                        
-			type: 'vbox',
-			align: 'center'
-		},
-		renderTo: document.body,
-		items: [{                        
-			xtype: 'panel',
-			title: 'Inner Panel One',
-			width: 250,
-			flex: 2                      
-		},{
-			xtype: 'panel',
-			title: 'Inner Panel Two',
-			width: 250,			
-			flex: 4
-		},{
-			xtype: 'panel',
-			title: 'Inner Panel Three',
-			width: '50%',			
-			flex: 4
-		}]
-	});
+ *
+ *     @example
+ *     Ext.create('Ext.Panel', {
+ *         width: 500,
+ *         height: 400,
+ *         title: "VBoxLayout Panel",
+ *         layout: {
+ *             type: 'vbox',
+ *             align: 'center'
+ *         },
+ *         renderTo: document.body,
+ *         items: [{
+ *             xtype: 'panel',
+ *             title: 'Inner Panel One',
+ *             width: 250,
+ *             flex: 2
+ *         },
+ *         {
+ *             xtype: 'panel',
+ *             title: 'Inner Panel Two',
+ *             width: 250,
+ *             flex: 4
+ *         },
+ *         {
+ *             xtype: 'panel',
+ *             title: 'Inner Panel Three',
+ *             width: '50%',
+ *             flex: 4
+ *         }]
+ *     });
  */
 Ext.define('Ext.layout.container.VBox', {
 
@@ -40,23 +58,17 @@ Ext.define('Ext.layout.container.VBox', {
     alias: ['layout.vbox'],
     extend: 'Ext.layout.container.Box',
     alternateClassName: 'Ext.layout.VBoxLayout',
-    
+
     /* End Definitions */
 
-    /**
+    /**
      * @cfg {String} align
-     * Controls how the child items of the container are aligned. Acceptable configuration values for this
-     * property are:
-     * <div class="mdetail-params"><ul>
-     * <li><b><tt>left</tt></b> : <b>Default</b><div class="sub-desc">child items are aligned horizontally
-     * at the <b>left</b> side of the container</div></li>
-     * <li><b><tt>center</tt></b> : <div class="sub-desc">child items are aligned horizontally at the
-     * <b>mid-width</b> of the container</div></li>
-     * <li><b><tt>stretch</tt></b> : <div class="sub-desc">child items are stretched horizontally to fill
-     * the width of the container</div></li>
-     * <li><b><tt>stretchmax</tt></b> : <div class="sub-desc">child items are stretched horizontally to
-     * the size of the largest item.</div></li>
-     * </ul></div>
+     * Controls how the child items of the container are aligned. Acceptable configuration values for this property are:
+     *
+     * - **left** : **Default** child items are aligned horizontally at the **left** side of the container
+     * - **center** : child items are aligned horizontally at the **mid-width** of the container
+     * - **stretch** : child items are stretched horizontally to fill the width of the container
+     * - **stretchmax** : child items are stretched horizontally to the size of the largest item.
      */
     align : 'left', // left, center, stretch, strechmax
 
@@ -86,5 +98,21 @@ Ext.define('Ext.layout.container.VBox', {
     perpendicularRB: 'r',
     perpendicularLeftTop: 'left',
     perpendicularRightBottom: 'right',
-    perpendicularPosition: 'x'
-});
\ No newline at end of file + perpendicularPosition: 'x', + configureItem: function(item) { + if (item.flex) { + item.layoutManagedHeight = 1; + } else { + item.layoutManagedHeight = 2; + } + + if (this.align === 'stretch' || this.align === 'stretchmax') { + item.layoutManagedWidth = 1; + } else { + item.layoutManagedWidth = 2; + } + this.callParent(arguments); + } +});
+ +