--- /dev/null
+<html>\r
+<head>\r
+ <title>Vbox</title>\r
+ <link rel="stylesheet" type="text/css" href="../../resources/css/ext-all.css"/>\r
+\r
+ <!-- GC -->\r
+ <!-- LIBS -->\r
+ <script type="text/javascript" src="../../adapter/ext/ext-base.js"></script>\r
+ <!-- ENDLIBS -->\r
+\r
+ <script type="text/javascript" src="../../ext-all.js"></script>\r
+ <script type="text/javascript" src="../ux/FieldLabeler.js"></script>\r
+ <script type="text/javascript" src="../ux/FieldReplicator.js"></script>\r
+\r
+ <script type="text/javascript" src="vbox-form.js"></script>\r
+ <link rel="stylesheet" type="text/css" href="forms.css"/>\r
+\r
+ <!-- Common Styles for the examples -->\r
+ <link rel="stylesheet" type="text/css" href="../shared/examples.css"/>\r
+</head>\r
+<body>\r
+<script type="text/javascript" src="../shared/examples.js"></script>\r
+<!-- EXAMPLES -->\r
+<h1>vbox Layout with Forms</h1>\r
+<p>The <code><b>align:'stretch'</b></code> config of the vbox layout manager ensures\r
+all child items are 100% of the container width.</p>\r
+<p>The <code><b>flex</b></code> config of child items of a vbox layout specifies what share of the vertical\r
+space left when unflexed items are accounted for to allocate for that child item.</p>\r
+<p>Compare this to <a href="anchoring.html">The anchoring example</a>. That anchors the fields\r
+to a hardcoded offset from the edge of the Container. The box layout managers allow much more\r
+flexibility in use of available space.</p>\r
+<p>The js is not minified so it is readable. See <a href="vbox-form.js">vbox-form.js</a>.</p>\r
+<p>This also illustrates the use of plugins to alter the default behaviour of Components. The <b>Send To</b>\r
+field clones itself until the final one is left blank to allow multiple mail recipients. The layout\r
+manager keeps the vertical space allocated correctly.</p>\r
+</body>\r
+</html>
\ No newline at end of file
git.ithinksw.org / extjs.git / blobdiff