2 * @class Ext.layout.container.Fit
3 * @extends Ext.layout.container.AbstractFit
4 * <p>This is a base class for layouts that contain <b>a single item</b> that automatically expands to fill the layout's
5 * container. This class is intended to be extended or created via the <tt>layout:'fit'</tt> {@link Ext.container.Container#layout}
6 * config, and should generally not need to be created directly via the new keyword.</p>
7 * <p>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}
13 Ext.create('Ext.panel.Panel', {
20 html: '<p>This is the inner panel content</p>',
24 renderTo: Ext.getBody()
28 Ext.define('Ext.layout.container.Fit', {
30 /* Begin Definitions */
32 extend: 'Ext.layout.container.AbstractFit',
34 alternateClassName: 'Ext.layout.FitLayout',
39 onLayout : function() {
43 if (me.owner.items.length) {
44 me.setItemBox(me.owner.items.get(0), me.getLayoutTargetSize());
48 getTargetBox : function() {
49 return this.getLayoutTargetSize();
52 setItemBox : function(item, box) {
54 if (item && box.height > 0) {
55 if (me.isManaged('width') === true) {
56 box.width = undefined;
58 if (me.isManaged('height') === true) {
59 box.height = undefined;
61 me.setItemSize(item, box.width, box.height);