Ext JS 4.0.7 Sencha Docs

Ext.layout.container.Container

Alternate names

Ext.layout.ContainerLayout

Hierarchy

Subclasses

Files

This class is intended to be extended or created via the layout configuration property. See Ext.container.Container.layout for additional details.

Available since: 2.3.0

Defined By

Config options

Flag to notify the ownerCt Component on afterLayout of a change ...

Flag to notify the ownerCt Component on afterLayout of a change

Defaults to: false

Available since: 4.0.0

Flag to notify the ownerCt Container on afterLayout of a change ...

Flag to notify the ownerCt Container on afterLayout of a change

Defaults to: false

Available since: 4.0.0

An optional extra CSS class that will be added to the container. ...

An optional extra CSS class that will be added to the container. This can be useful for adding customized styles to the container or any of its children using standard CSS rules. See Ext.Component.componentCls also.

Available since: 4.0.0

Defined By

Properties

Available since: 4.0.0

...

Defaults to: false

Available since: 4.0.0

End Definitions ...

End Definitions

Defaults to: true

Available since: 4.0.0

Get the reference to the current class from which this object was instantiated. ...

Get the reference to the current class from which this object was instantiated. Unlike statics, this.self is scope-dependent and it's meant to be used for dynamic inheritance. See statics for a detailed comparison

Ext.define('My.Cat', {
    statics: {
        speciesName: 'Cat' // My.Cat.speciesName = 'Cat'
    },

    constructor: function() {
        alert(this.self.speciesName); / dependent on 'this'

        return this;
    },

    clone: function() {
        return new this.self();
    }
});


Ext.define('My.SnowLeopard', {
    extend: 'My.Cat',
    statics: {
        speciesName: 'Snow Leopard'         // My.SnowLeopard.speciesName = 'Snow Leopard'
    }
});

var cat = new My.Cat();                     // alerts 'Cat'
var snowLeopard = new My.SnowLeopard();     // alerts 'Snow Leopard'

var clone = snowLeopard.clone();
alert(Ext.getClassName(clone));             // alerts 'My.SnowLeopard'

Available since: 4.0.0

End Definitions ...

End Definitions

Defaults to: 'container'

Available since: 4.0.0

Methods

Defined By

Instance Methods

...

Available since: 4.0.0

Parameters

Returns

...

Available since: 4.0.6

Parameters

Returns

Removes itemCls ...

Removes itemCls

Available since: 4.0.0

Parameters

Ext.layout.container.Container
view source
( )
Containers should not lay out child components when collapsed. ...

Containers should not lay out child components when collapsed.

Available since: 4.0.0

Overrides: Ext.layout.container.AbstractContainer.beforeLayout

Call the original method that was previously overridden with override Ext.define('My.Cat', { constructor: functi...

Call the original method that was previously overridden with override

Ext.define('My.Cat', {
    constructor: function() {
        alert("I'm a cat!");

        return this;
    }
});

My.Cat.override({
    constructor: function() {
        alert("I'm going to be a cat!");

        var instance = this.callOverridden();

        alert("Meeeeoooowwww");

        return instance;
    }
});

var kitty = new My.Cat(); // alerts "I'm going to be a cat!"
                          // alerts "I'm a cat!"
                          // alerts "Meeeeoooowwww"

Available since: 4.0.0

Parameters

  • args : Array/Arguments

    The arguments, either an array or the arguments object

Returns

  • Object

    Returns the result after calling the overridden method

Call the parent's overridden method. ...

Call the parent's overridden method. For example:

Ext.define('My.own.A', {
    constructor: function(test) {
        alert(test);
    }
});

Ext.define('My.own.B', {
    extend: 'My.own.A',

    constructor: function(test) {
        alert(test);

        this.callParent([test + 1]);
    }
});

Ext.define('My.own.C', {
    extend: 'My.own.B',

    constructor: function() {
        alert("Going to call parent's overriden constructor...");

        this.callParent(arguments);
    }
});

var a = new My.own.A(1); // alerts '1'
var b = new My.own.B(1); // alerts '1', then alerts '2'
var c = new My.own.C(2); // alerts "Going to call parent's overriden constructor..."
                         // alerts '2', then alerts '3'

Available since: 4.0.0

Parameters

  • args : Array/Arguments

    The arguments, either an array or the arguments object from the current method, for example: this.callParent(arguments)

Returns

  • Object

    Returns the result from the superclass' method

Applies itemCls Empty template method ...

Applies itemCls Empty template method

Available since: 4.0.0

Destroys this layout. ...

Destroys this layout. This is a template method that is empty by default, but should be implemented by subclasses that require explicit destruction to purge event handlers or remove DOM nodes.

Available since: 4.0.0

This is a template method. a hook into the functionality of this class. Feel free to override it in child classes.

...

Available since: 4.0.0

Returns an array of child components either for a render phase (Performed in the beforeLayout method of the layout's ...

Returns an array of child components either for a render phase (Performed in the beforeLayout method of the layout's base class), or the layout phase (onLayout).

Available since: 4.0.0

Returns

Overrides: Ext.layout.Layout.getLayoutItems

Ext.layout.container.Container
view source
( )private
...

Available since: 4.0.0

Returns the element into which rendering must take place. ...

Returns the element into which rendering must take place. Defaults to the owner Container's target element.

May be overridden in layout managers which implement an inner element.

Available since: 4.0.0

Returns

Ext.layout.container.Container
view source
( ) : Arrayprotected
Returns all items that are rendered ...

Returns all items that are rendered

Available since: 3.4.0

Returns

Returns the owner component's resize element. ...

Returns the owner component's resize element.

Available since: 4.0.0

Returns

Ext.layout.container.Container
view source
( ) : Arrayprotected
Returns all items that are both rendered and visible ...

Returns all items that are both rendered and visible

Available since: 4.0.0

Returns

( config ) : Objectchainableprotected
Initialize configuration for this class. ...

Initialize configuration for this class. a typical example:

Ext.define('My.awesome.Class', {
    // The default config
    config: {
        name: 'Awesome',
        isAwesome: true
    },

    constructor: function(config) {
        this.initConfig(config);

        return this;
    }
});

var awesome = new My.awesome.Class({
    name: 'Super Awesome'
});

alert(awesome.getName()); // 'Super Awesome'

Available since: 4.0.0

Parameters

Returns

  • Object

    mixins The mixin prototypes as key - value pairs

Adds the layout's targetCls if necessary and sets initialized flag when complete. ...

Adds the layout's targetCls if necessary and sets initialized flag when complete.

Available since: 4.0.0

( item, target, position )private
Validates item is in the proper place in the dom. ...
  • Validates item is in the proper place in the dom.

Available since: 4.0.0

Parameters

...

Available since: 4.0.0

Ext.layout.container.Container
view source
( item, box )private
End Definitions ...

End Definitions

Available since: 4.0.0

Parameters

( name, cls )private
Used internally by the mixins pre-processor ...

Used internally by the mixins pre-processor

Available since: 4.0.6

Parameters

( item, target, position )private
Moved Component to the provided target instead. ...

Moved Component to the provided target instead.

Available since: 4.0.0

Parameters

...

Available since: 4.0.0

Placeholder empty functions for subclasses to extend ...

Placeholder empty functions for subclasses to extend

Available since: 4.0.0

...

Available since: 4.0.0

( name, value )private
...

Available since: 4.0.6

Parameters

( name, fn )private
...

Available since: 4.0.0

Parameters

...

Available since: 4.0.3

( item, target, position )private
Renders the given Component into the target Element. ...

Renders the given Component into the target Element.

Available since: 4.0.0

Parameters

  • item : Ext.Component

    The Component to render

  • target : Ext.Element

    The target Element

  • position : Number

    The position within the target to render the item to

Iterates over all passed items, ensuring they are rendered. ...

Iterates over all passed items, ensuring they are rendered. If the items are already rendered, also determines if the items are in the proper place dom.

Available since: 4.0.0

Parameters

( config ) : Ext.Basechainableprivate
...

Available since: 4.0.0

Parameters

Returns

Set the size of an item within the Container. ...

Set the size of an item within the Container. We should always use setCalculatedSize.

Available since: 4.0.0

Parameters

Sets the layout owner ...

Sets the layout owner

Available since: 4.0.0

Parameters

Get the reference to the class from which this object was instantiated. ...

Get the reference to the class from which this object was instantiated. Note that unlike self, this.statics() is scope-independent and it always returns the class from which it was called, regardless of what this points to during run-time

Ext.define('My.Cat', {
    statics: {
        totalCreated: 0,
        speciesName: 'Cat' // My.Cat.speciesName = 'Cat'
    },

    constructor: function() {
        var statics = this.statics();

        alert(statics.speciesName);     // always equals to 'Cat' no matter what 'this' refers to
                                        // equivalent to: My.Cat.speciesName

        alert(this.self.speciesName);   // dependent on 'this'

        statics.totalCreated++;

        return this;
    },

    clone: function() {
        var cloned = new this.self;                      // dependent on 'this'

        cloned.groupName = this.statics().speciesName;   // equivalent to: My.Cat.speciesName

        return cloned;
    }
});


Ext.define('My.SnowLeopard', {
    extend: 'My.Cat',

    statics: {
        speciesName: 'Snow Leopard'     // My.SnowLeopard.speciesName = 'Snow Leopard'
    },

    constructor: function() {
        this.callParent();
    }
});

var cat = new My.Cat();                 // alerts 'Cat', then alerts 'Cat'

var snowLeopard = new My.SnowLeopard(); // alerts 'Cat', then alerts 'Snow Leopard'

var clone = snowLeopard.clone();
alert(Ext.getClassName(clone));         // alerts 'My.SnowLeopard'
alert(clone.groupName);                 // alerts 'Cat'

alert(My.Cat.totalCreated);             // alerts 3

Available since: 4.0.0

Returns

Defined By

Static Methods

( members ) : Ext.Basechainablestatic
Add / override static properties of this class. ...

Add / override static properties of this class.

Ext.define('My.cool.Class', {
    ...
});

My.cool.Class.addStatics({
    someProperty: 'someValue',      // My.cool.Class.someProperty = 'someValue'
    method1: function() { ... },    // My.cool.Class.method1 = function() { ... };
    method2: function() { ... }     // My.cool.Class.method2 = function() { ... };
});

Available since: 4.0.2

Parameters

Returns

( fromClass, members ) : Ext.Basechainablestatic
Borrow another class' members to the prototype of this class. ...

Borrow another class' members to the prototype of this class.

Ext.define('Bank', {
    money: '$$$',
    printMoney: function() {
        alert('$$$$$$$');
    }
});

Ext.define('Thief', {
    ...
});

Thief.borrow(Bank, ['money', 'printMoney']);

var steve = new Thief();

alert(steve.money); // alerts '$$$'
steve.printMoney(); // alerts '$$$$$$$'

Available since: 4.0.2

Parameters

  • fromClass : Ext.Base

    The class to borrow members from

  • members : String/String[]

    The names of the members to borrow

Returns

Create a new instance of this Class. ...

Create a new instance of this Class.

Ext.define('My.cool.Class', {
    ...
});

My.cool.Class.create({
    someConfig: true
});

All parameters are passed to the constructor of the class.

Available since: 4.0.2

Returns

( alias, origin )static
Create aliases for existing prototype methods. ...

Create aliases for existing prototype methods. Example:

Ext.define('My.cool.Class', {
    method1: function() { ... },
    method2: function() { ... }
});

var test = new My.cool.Class();

My.cool.Class.createAlias({
    method3: 'method1',
    method4: 'method2'
});

test.method3(); // test.method1()

My.cool.Class.createAlias('method5', 'method3');

test.method5(); // test.method3() -> test.method1()

Available since: 4.0.2

Parameters

Get the current class' name in string format. ...

Get the current class' name in string format.

Ext.define('My.cool.Class', {
    constructor: function() {
        alert(this.self.getName()); // alerts 'My.cool.Class'
    }
});

My.cool.Class.getName(); // 'My.cool.Class'

Available since: 4.0.4

Returns

Add methods / properties to the prototype of this class. ...

Add methods / properties to the prototype of this class.

Ext.define('My.awesome.Cat', {
    constructor: function() {
        ...
    }
});

 My.awesome.Cat.implement({
     meow: function() {
        alert('Meowww...');
     }
 });

 var kitty = new My.awesome.Cat;
 kitty.meow();

Available since: 4.0.2

Parameters

( members ) : Ext.Basechainablestatic
Override prototype members of this class. ...

Override prototype members of this class. Overridden methods can be invoked via callOverridden

Ext.define('My.Cat', {
    constructor: function() {
        alert("I'm a cat!");

        return this;
    }
});

My.Cat.override({
    constructor: function() {
        alert("I'm going to be a cat!");

        var instance = this.callOverridden();

        alert("Meeeeoooowwww");

        return instance;
    }
});

var kitty = new My.Cat(); // alerts "I'm going to be a cat!"
                          // alerts "I'm a cat!"
                          // alerts "Meeeeoooowwww"

Available since: 4.0.2

Parameters

Returns