docs/source/Fit.html

   1 <!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.container.Fit'>/**
   2 </span> * @class Ext.layout.container.Fit
   3  * @extends Ext.layout.container.AbstractFit
   4  * &lt;p&gt;This is a base class for layouts that contain &lt;b&gt;a single item&lt;/b&gt; that automatically expands to fill the layout's
   5  * container.  This class is intended to be extended or created via the &lt;tt&gt;layout:'fit'&lt;/tt&gt; {@link Ext.container.Container#layout}
   6  * config, and should generally not need to be created directly via the new keyword.&lt;/p&gt;
   7  * &lt;p&gt;FitLayout does not have any direct config options (other than inherited ones).  To fit a panel to a container
   8  * using FitLayout, simply set layout:'fit' on the container and add a single panel to it.  If the container has
   9  * multiple panels, only the first one will be displayed.
  10  * {@img Ext.layout.container.Fit/Ext.layout.container.Fit.png Ext.layout.container.Fit container layout}
  11  * Example usage:&lt;/p&gt;
  12  * &lt;pre&gt;&lt;code&gt;
  13     Ext.create('Ext.panel.Panel', {
  14         title: 'Fit Layout',
  15         width: 300,
  16         height: 150,
  17         layout:'fit',
  18         items: {
  19             title: 'Inner Panel',
  20             html: 'This is the inner panel content',
  21             bodyPadding: 20,
  22             border: false
  23         },
  24         renderTo: Ext.getBody()
  25     });
  26 &lt;/code&gt;&lt;/pre&gt;
  27  */
  28 Ext.define('Ext.layout.container.Fit', {
  29
  30     /* Begin Definitions */
  31
  32     extend: 'Ext.layout.container.AbstractFit',
  33     alias: 'layout.fit',
  34     alternateClassName: 'Ext.layout.FitLayout',
  35
  36     /* End Definitions */
  37
  38     // @private
  39     onLayout : function() {
  40         var me = this;
  41         me.callParent();
  42
  43         if (me.owner.items.length) {
  44             me.setItemBox(me.owner.items.get(0), me.getLayoutTargetSize());
  45         }
  46     },
  47
  48     getTargetBox : function() {
  49         return this.getLayoutTargetSize();
  50     },
  51
  52     setItemBox : function(item, box) {
  53         var me = this;
  54         if (item &amp;&amp; box.height &gt; 0) {
  55             if (me.isManaged('width') === true) {
  56                box.width = undefined;
  57             }
  58             if (me.isManaged('height') === true) {
  59                box.height = undefined;
  60             }
  61             me.setItemSize(item, box.width, box.height);
  62         }
  63     }
  64 });</pre></pre></body></html>