Upgrade to ExtJS 3.3.1 - Released 11/30/2010
[extjs.git] / docs / source / FitLayout.html
1 <html>
2 <head>
3   <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />    
4   <title>The source code</title>
5     <link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />
6     <script type="text/javascript" src="../resources/prettify/prettify.js"></script>
7 </head>
8 <body  onload="prettyPrint();">
9     <pre class="prettyprint lang-js">/*!
10  * Ext JS Library 3.3.1
11  * Copyright(c) 2006-2010 Sencha Inc.
12  * licensing@sencha.com
13  * http://www.sencha.com/license
14  */
15 <div id="cls-Ext.layout.FitLayout"></div>/**
16  * @class Ext.layout.FitLayout
17  * @extends Ext.layout.ContainerLayout
18  * <p>This is a base class for layouts that contain <b>a single item</b> that automatically expands to fill the layout's
19  * container.  This class is intended to be extended or created via the <tt>layout:'fit'</tt> {@link Ext.Container#layout}
20  * config, and should generally not need to be created directly via the new keyword.</p>
21  * <p>FitLayout does not have any direct config options (other than inherited ones).  To fit a panel to a container
22  * using FitLayout, simply set layout:'fit' on the container and add a single panel to it.  If the container has
23  * multiple panels, only the first one will be displayed.  Example usage:</p>
24  * <pre><code>
25 var p = new Ext.Panel({
26     title: 'Fit Layout',
27     layout:'fit',
28     items: {
29         title: 'Inner Panel',
30         html: '&lt;p&gt;This is the inner panel content&lt;/p&gt;',
31         border: false
32     }
33 });
34 </code></pre>
35  */
36 Ext.layout.FitLayout = Ext.extend(Ext.layout.ContainerLayout, {
37     // private
38     monitorResize:true,
39
40     type: 'fit',
41
42     getLayoutTargetSize : function() {
43         var target = this.container.getLayoutTarget();
44         if (!target) {
45             return {};
46         }
47         // Style Sized (scrollbars not included)
48         return target.getStyleSize();
49     },
50
51     // private
52     onLayout : function(ct, target){
53         Ext.layout.FitLayout.superclass.onLayout.call(this, ct, target);
54         if(!ct.collapsed){
55             this.setItemSize(this.activeItem || ct.items.itemAt(0), this.getLayoutTargetSize());
56         }
57     },
58
59     // private
60     setItemSize : function(item, size){
61         if(item && size.height > 0){ // display none?
62             item.setSize(size);
63         }
64     }
65 });
66 Ext.Container.LAYOUTS['fit'] = Ext.layout.FitLayout;</pre>    
67 </body>
68 </html>