![\"Ext.layout.container.Card](\"doc-resources/Ext.layout.container.Card/Ext.layout.container.Card.png\")
Flag to notify the ownerCt Component on afterLayout of a change
\n", - "linenr": 17, - "html_filename": "AbstractContainer.html" - }, - { - "type": "Boolean", - "deprecated": null, - "alias": null, - "protected": false, - "tagname": "cfg", - "href": "AbstractContainer.html#Ext-layout-container-AbstractContainer-cfg-bindToOwnerCtContainer", - "static": false, - "filename": "/mnt/ebs/nightly/git/SDK/platform/src/layout/container/AbstractContainer.js", - "private": false, - "name": "bindToOwnerCtContainer", - "owner": "Ext.layout.container.AbstractContainer", - "doc": "Flag to notify the ownerCt Container on afterLayout of a change
\n", - "linenr": 23, - "html_filename": "AbstractContainer.html" - }, - { - "type": "Boolean", - "deprecated": null, - "alias": null, - "protected": false, - "tagname": "cfg", - "href": "AbstractCard.html#Ext-layout-container-AbstractCard-cfg-deferredRender", - "shortDoc": "True to render each contained item at the time it becomes active, false to render all contained items\nas soon as the ...", - "static": false, - "filename": "/mnt/ebs/nightly/git/SDK/platform/src/layout/container/AbstractCard.js", - "private": false, - "name": "deferredRender", - "owner": "Ext.layout.container.AbstractCard", - "doc": "True to render each contained item at the time it becomes active, false to render all contained items\nas soon as the layout is rendered (defaults to false). If there is a significant amount of content or\na lot of heavy controls being rendered into panels that are not displayed by default, setting this to\ntrue might improve performance.
\n", - "linenr": 40, - "html_filename": "AbstractCard.html" - }, - { - "type": "String", - "deprecated": null, - "alias": null, - "protected": false, - "tagname": "cfg", - "href": "AbstractContainer.html#Ext-layout-container-AbstractContainer-cfg-itemCls", - "shortDoc": "An optional extra CSS class that will be added to the container. ...", - "static": false, - "filename": "/mnt/ebs/nightly/git/SDK/platform/src/layout/container/AbstractContainer.js", - "private": false, - "name": "itemCls", - "owner": "Ext.layout.container.AbstractContainer", - "doc": "An optional extra CSS class that will be added to the container. This can be useful for adding\ncustomized styles to the container or any of its children using standard CSS rules. See\nExt.Component.ctCls also.
\n\n\n\n", - "linenr": 29, - "html_filename": "AbstractContainer.html" - } - ], - "method": [ - { - "deprecated": null, - "alias": null, - "protected": false, - "tagname": "method", - "href": "AbstractCard.html#Ext-layout-container-AbstractCard-method-getActiveItem", - "shortDoc": "Return the active (visible) component in the layout. ...", - "static": false, - "filename": "/mnt/ebs/nightly/git/SDK/platform/src/layout/container/AbstractCard.js", - "private": false, - "params": [ - - ], - "name": "getActiveItem", - "owner": "Ext.layout.container.AbstractCard", - "doc": "Return the active (visible) component in the layout.
\n", - "linenr": 89, - "return": { - "type": "Ext.Component", - "doc": "\n" - }, - "html_filename": "AbstractCard.html" - }, - { - "deprecated": null, - "alias": null, - "protected": false, - "tagname": "method", - "href": "AbstractContainer.html#Ext-layout-container-AbstractContainer-method-getLayoutItems", - "shortDoc": "Returns an array of child components either for a render phase (Performed in the beforeLayout method of the layout's\n...", - "static": false, - "filename": "/mnt/ebs/nightly/git/SDK/platform/src/layout/container/AbstractContainer.js", - "private": false, - "params": [ - - ], - "name": "getLayoutItems", - "owner": "Ext.layout.container.AbstractContainer", - "doc": "Returns an array of child components either for a render phase (Performed in the beforeLayout method of the layout's\nbase class), or the layout phase (onLayout).
\n\n", - "linenr": 49, - "return": { - "type": "Array", - "doc": "of child components
\n" - }, - "html_filename": "AbstractContainer.html" - }, - { - "deprecated": null, - "alias": null, - "protected": false, - "tagname": "method", - "href": "AbstractCard.html#Ext-layout-container-AbstractCard-method-getNext", - "shortDoc": "Return the active (visible) component in the layout to the next card ...", - "static": false, - "filename": "/mnt/ebs/nightly/git/SDK/platform/src/layout/container/AbstractCard.js", - "private": false, - "params": [ - - ], - "name": "getNext", - "owner": "Ext.layout.container.AbstractCard", - "doc": "Return the active (visible) component in the layout to the next card
\n", - "linenr": 148, - "return": { - "type": "Ext.Component", - "doc": "The next component or false.
\n" - }, - "html_filename": "AbstractCard.html" - }, - { - "deprecated": null, - "alias": null, - "protected": false, - "tagname": "method", - "href": "AbstractCard.html#Ext-layout-container-AbstractCard-method-getPrev", - "shortDoc": "Return the active (visible) component in the layout to the previous card ...", - "static": false, - "filename": "/mnt/ebs/nightly/git/SDK/platform/src/layout/container/AbstractCard.js", - "private": false, - "params": [ - - ], - "name": "getPrev", - "owner": "Ext.layout.container.AbstractCard", - "doc": "Return the active (visible) component in the layout to the previous card
\n", - "linenr": 172, - "return": { - "type": "Ext.Component", - "doc": "The previous component or false.
\n" - }, - "html_filename": "AbstractCard.html" - }, - { - "deprecated": null, - "alias": null, - "protected": false, - "tagname": "method", - "href": "AbstractContainer.html#Ext-layout-container-AbstractContainer-method-getRenderTarget", - "shortDoc": "Returns the element into which rendering must take place. ...", - "static": false, - "filename": "/mnt/ebs/nightly/git/SDK/platform/src/layout/container/AbstractContainer.js", - "private": false, - "params": [ - - ], - "name": "getRenderTarget", - "owner": "Ext.layout.container.AbstractContainer", - "doc": "Returns the element into which rendering must take place. Defaults to the owner Container's Ext.AbstractComponent.targetEl.
\n\n\nMay be overridden in layout managers which implement an inner element.
\n", - "linenr": 68, - "return": { - "type": "Ext.core.Element", - "doc": "\n" - }, - "html_filename": "AbstractContainer.html" - }, - { - "deprecated": null, - "alias": null, - "protected": true, - "tagname": "method", - "href": "Container.html#Ext-layout-container-Container-method-getRenderedItems", - "shortDoc": "Returns all items that are rendered ...", - "static": false, - "filename": "/mnt/ebs/nightly/git/SDK/extjs/src/layout/container/Container.js", - "private": false, - "params": [ - - ], - "name": "getRenderedItems", - "owner": "Ext.layout.container.Container", - "doc": "Returns all items that are rendered
\n", - "linenr": 53, - "return": { - "type": "Array", - "doc": "All matching items
\n" - }, - "html_filename": "Container.html" - }, - { - "deprecated": null, - "alias": null, - "protected": false, - "tagname": "method", - "href": "AbstractContainer.html#Ext-layout-container-AbstractContainer-method-getTarget", - "shortDoc": "Returns the owner component's resize element. ...", - "static": false, - "filename": "/mnt/ebs/nightly/git/SDK/platform/src/layout/container/AbstractContainer.js", - "private": false, - "params": [ - - ], - "name": "getTarget", - "owner": "Ext.layout.container.AbstractContainer", - "doc": "Returns the owner component's resize element.
\n", - "linenr": 61, - "return": { - "type": "Ext.core.Element", - "doc": "\n" - }, - "html_filename": "AbstractContainer.html" - }, - { - "deprecated": null, - "alias": null, - "protected": true, - "tagname": "method", - "href": "Container.html#Ext-layout-container-Container-method-getVisibleItems", - "shortDoc": "Returns all items that are both rendered and visible ...", - "static": false, - "filename": "/mnt/ebs/nightly/git/SDK/extjs/src/layout/container/Container.js", - "private": false, - "params": [ - - ], - "name": "getVisibleItems", - "owner": "Ext.layout.container.Container", - "doc": "Returns all items that are both rendered and visible
\n", - "linenr": 76, - "return": { - "type": "Array", - "doc": "All matching items
\n" - }, - "html_filename": "Container.html" - }, - { - "deprecated": null, - "alias": null, - "protected": false, - "tagname": "method", - "href": "AbstractCard.html#Ext-layout-container-AbstractCard-method-next", - "shortDoc": "Sets the active (visible) component in the layout to the next card ...", - "static": false, - "filename": "/mnt/ebs/nightly/git/SDK/platform/src/layout/container/AbstractCard.js", - "private": false, - "params": [ - - ], - "name": "next", - "owner": "Ext.layout.container.AbstractCard", - "doc": "Sets the active (visible) component in the layout to the next card
\n", - "linenr": 161, - "return": { - "type": "Ext.Component", - "doc": "the activated component or false when nothing activated.
\n" - }, - "html_filename": "AbstractCard.html" - }, - { - "deprecated": null, - "alias": null, - "protected": false, - "tagname": "method", - "href": "AbstractCard.html#Ext-layout-container-AbstractCard-method-prev", - "shortDoc": "Sets the active (visible) component in the layout to the previous card ...", - "static": false, - "filename": "/mnt/ebs/nightly/git/SDK/platform/src/layout/container/AbstractCard.js", - "private": false, - "params": [ - - ], - "name": "prev", - "owner": "Ext.layout.container.AbstractCard", - "doc": "Sets the active (visible) component in the layout to the previous card
\n", - "linenr": 185, - "return": { - "type": "Ext.Component", - "doc": "the activated component or false when nothing activated.
\n" - }, - "html_filename": "AbstractCard.html" - }, - { - "deprecated": null, - "alias": null, - "protected": false, - "tagname": "method", - "href": "Card.html#Ext-layout-container-Card-method-setActiveItem", - "shortDoc": "Makes the given card active. ...", - "static": false, - "filename": "/mnt/ebs/nightly/git/SDK/extjs/src/layout/container/Card.js", - "private": false, - "params": [ - { - "type": "Ext.Component/Number/String", - "optional": false, - "doc": "The component, component id,\nitemId, or index of component.
\n", - "name": "newCard" - } - ], - "name": "setActiveItem", - "owner": "Ext.layout.container.Card", - "doc": "Makes the given card active.
\n\nvar card1 = Ext.create('Ext.panel.Panel', {itemId: 'card-1'});\nvar card2 = Ext.create('Ext.panel.Panel', {itemId: 'card-2'});\nvar panel = Ext.create('Ext.panel.Panel', {\n layout: 'card',\n activeItem: 0,\n items: [card1, card2]\n});\n// These are all equivalent\npanel.getLayout().setActiveItem(card2);\npanel.getLayout().setActiveItem('card-2');\npanel.getLayout().setActiveItem(1);\nthe activated component or false when nothing activated.\nFalse is returned also when trying to activate an already active card.
\n" - }, - "html_filename": "Card.html" - } - ], - "property": [ - - ], - "cssVar": [ - - ], - "cssMixin": [ - - ], - "event": [ - - ] - }, - "singleton": false, - "alias": null, - "superclasses": [ - "Ext.layout.Layout", - "Ext.layout.container.AbstractContainer", - "Ext.layout.container.Container", - "Ext.layout.container.AbstractFit", - "Ext.layout.container.Fit", - "Ext.layout.container.AbstractCard" - ], - "protected": false, - "tagname": "class", - "mixins": [ - - ], - "href": "Card.html#Ext-layout-container-Card", - "subclasses": [ - - ], - "static": false, - "author": null, - "component": false, - "filename": "/mnt/ebs/nightly/git/SDK/extjs/src/layout/container/Card.js", - "private": false, - "alternateClassNames": [ - "Ext.layout.CardLayout" - ], - "name": "Ext.layout.container.Card", - "doc": "This layout manages multiple child Components, each fitted to the Container, where only a single child Component can be\nvisible at any given time. This layout style is most commonly used for wizards, tab implementations, etc.\nThis class is intended to be extended or created via the layout:'card' Ext.container.Container.layout config,\nand should generally not need to be created directly via the new keyword.
\n\nThe CardLayout's focal method is setActiveItem. Since only one panel is displayed at a time,\nthe only way to move from one Component to the next is by calling setActiveItem, passing the id or index of\nthe next panel to display. The layout itself does not provide a user interface for handling this navigation,\nso that functionality must be provided by the developer.
\n\nIn the following example, a simplistic wizard setup is demonstrated. A button bar is added\nto the footer of the containing panel to provide navigation buttons. The buttons will be handled by a\ncommon navigation routine. Note that other uses of a CardLayout (like a tab control) would require a\ncompletely different implementation. For serious implementations, a better approach would be to extend\nCardLayout to provide the custom functionality needed.
\n\n
Example usage:
\n\nvar navigate = function(panel, direction){\n // This routine could contain business logic required to manage the navigation steps.\n // It would call setActiveItem as needed, manage navigation button state, handle any\n // branching logic that might be required, handle alternate actions like cancellation\n // or finalization, etc. A complete wizard implementation could get pretty\n // sophisticated depending on the complexity required, and should probably be\n // done as a subclass of CardLayout in a real-world implementation.\n var layout = panel.getLayout();\n layout[direction]();\n Ext.getCmp('move-prev').setDisabled(!layout.getPrev());\n Ext.getCmp('move-next').setDisabled(!layout.getNext());\n};\n\nExt.create('Ext.panel.Panel', {\n title: 'Example Wizard',\n width: 300,\n height: 200,\n layout: 'card',\n activeItem: 0, // make sure the active item is set on the container config!\n bodyStyle: 'padding:15px',\n defaults: {\n // applied to each contained panel\n border: false\n },\n // just an example of one possible navigation scheme, using buttons\n bbar: [\n {\n id: 'move-prev',\n text: 'Back',\n handler: function(btn) {\n navigate(btn.up(\"panel\"), \"prev\");\n },\n disabled: true\n },\n '->', // greedy spacer so that the buttons are aligned to each side\n {\n id: 'move-next',\n text: 'Next',\n handler: function(btn) {\n navigate(btn.up(\"panel\"), \"next\");\n }\n }\n ],\n // the panels (or \"cards\") within the layout\n items: [{\n id: 'card-0',\n html: '<h1>Welcome to the Wizard!</h1><p>Step 1 of 3</p>'\n },{\n id: 'card-1',\n html: '<p>Step 2 of 3</p>'\n },{\n id: 'card-2',\n html: '<h1>Congratulations!</h1><p>Step 3 of 3 - Complete</p>'\n }],\n renderTo: Ext.getBody()\n});\nAlternate names
Ext.layout.CardLayoutHierarchy
Files
This layout manages multiple child Components, each fitted to the Container, where only a single child Component can be\nvisible at any given time. This layout style is most commonly used for wizards, tab implementations, etc.\nThis class is intended to be extended or created via the layout:'card' Ext.container.Container.layout config,\nand should generally not need to be created directly via the new keyword.
\n\nThe CardLayout's focal method is setActiveItem. Since only one panel is displayed at a time,\nthe only way to move from one Component to the next is by calling setActiveItem, passing the next panel to display\n(or its id or index). The layout itself does not provide a user interface for handling this navigation,\nso that functionality must be provided by the developer.
\n\nTo change the active card of a container, call the setActiveItem method of its layout:
\n\nExt.create('Ext.panel.Panel', {\n layout: 'card',\n items: [\n { html: 'Card 1' },\n { html: 'Card 2' }\n ],\n renderTo: Ext.getBody()\n});\n\np.getLayout().setActiveItem(1);\nIn the following example, a simplistic wizard setup is demonstrated. A button bar is added\nto the footer of the containing panel to provide navigation buttons. The buttons will be handled by a\ncommon navigation routine. Note that other uses of a CardLayout (like a tab control) would require a\ncompletely different implementation. For serious implementations, a better approach would be to extend\nCardLayout to provide the custom functionality needed.
\n\nvar navigate = function(panel, direction){\n // This routine could contain business logic required to manage the navigation steps.\n // It would call setActiveItem as needed, manage navigation button state, handle any\n // branching logic that might be required, handle alternate actions like cancellation\n // or finalization, etc. A complete wizard implementation could get pretty\n // sophisticated depending on the complexity required, and should probably be\n // done as a subclass of CardLayout in a real-world implementation.\n var layout = panel.getLayout();\n layout[direction]();\n Ext.getCmp('move-prev').setDisabled(!layout.getPrev());\n Ext.getCmp('move-next').setDisabled(!layout.getNext());\n};\n\nExt.create('Ext.panel.Panel', {\n title: 'Example Wizard',\n width: 300,\n height: 200,\n layout: 'card',\n bodyStyle: 'padding:15px',\n defaults: {\n // applied to each contained panel\n border: false\n },\n // just an example of one possible navigation scheme, using buttons\n bbar: [\n {\n id: 'move-prev',\n text: 'Back',\n handler: function(btn) {\n navigate(btn.up(\"panel\"), \"prev\");\n },\n disabled: true\n },\n '->', // greedy spacer so that the buttons are aligned to each side\n {\n id: 'move-next',\n text: 'Next',\n handler: function(btn) {\n navigate(btn.up(\"panel\"), \"next\");\n }\n }\n ],\n // the panels (or \"cards\") within the layout\n items: [{\n id: 'card-0',\n html: '<h1>Welcome to the Wizard!</h1><p>Step 1 of 3</p>'\n },{\n id: 'card-1',\n html: '<p>Step 2 of 3</p>'\n },{\n id: 'card-2',\n html: '<h1>Congratulations!</h1><p>Step 3 of 3 - Complete</p>'\n }],\n renderTo: Ext.getBody()\n});\nFlag to notify the ownerCt Component on afterLayout of a change
\nDefaults to: false
Flag to notify the ownerCt Container on afterLayout of a change
\nDefaults to: false
If the individual contained items do not have a margins\nproperty specified or margin specified via CSS, the default margins from this property will be\napplied to each item.
\n\n\nThis property may be specified as an object containing margins\n\n\n
to apply in the format:
\n\n{\n top: (top margin),\n right: (right margin),\n bottom: (bottom margin),\n left: (left margin)\n}This property may also be specified as a string containing\nspace-separated, numeric margin values. The order of the sides associated\nwith each value matches the way CSS processes margin values:
\n\n\nDefaults to:
\n\n\n{top:0, right:0, bottom:0, left:0}\nDefaults to: {top: 0, right: 0, bottom: 0, left: 0}
True to render each contained item at the time it becomes active, false to render all contained items\nas soon as the layout is rendered. If there is a significant amount of content or\na lot of heavy controls being rendered into panels that are not displayed by default, setting this to\ntrue might improve performance.
\nDefaults to: false
An optional extra CSS class that will be added to the container. This can be useful for adding\ncustomized styles to the container or any of its children using standard CSS rules. See\nExt.Component.componentCls also.
\n\n\n\nGet the reference to the current class from which this object was instantiated. Unlike statics,\nthis.self is scope-dependent and it's meant to be used for dynamic inheritance. See statics\nfor a detailed comparison
Ext.define('My.Cat', {\n statics: {\n speciesName: 'Cat' // My.Cat.speciesName = 'Cat'\n },\n\n constructor: function() {\n alert(this.self.speciesName); / dependent on 'this'\n\n return this;\n },\n\n clone: function() {\n return new this.self();\n }\n});\n\n\nExt.define('My.SnowLeopard', {\n extend: 'My.Cat',\n statics: {\n speciesName: 'Snow Leopard' // My.SnowLeopard.speciesName = 'Snow Leopard'\n }\n});\n\nvar cat = new My.Cat(); // alerts 'Cat'\nvar snowLeopard = new My.SnowLeopard(); // alerts 'Snow Leopard'\n\nvar clone = snowLeopard.clone();\nalert(Ext.getClassName(clone)); // alerts 'My.SnowLeopard'\nContainers should not lay out child components when collapsed.
\nCall the original method that was previously overridden with override
\n\nExt.define('My.Cat', {\n constructor: function() {\n alert(\"I'm a cat!\");\n\n return this;\n }\n});\n\nMy.Cat.override({\n constructor: function() {\n alert(\"I'm going to be a cat!\");\n\n var instance = this.callOverridden();\n\n alert(\"Meeeeoooowwww\");\n\n return instance;\n }\n});\n\nvar kitty = new My.Cat(); // alerts \"I'm going to be a cat!\"\n // alerts \"I'm a cat!\"\n // alerts \"Meeeeoooowwww\"\nThe arguments, either an array or the arguments object
Returns the result after calling the overridden method
\nCall the parent's overridden method. For example:
\n\nExt.define('My.own.A', {\n constructor: function(test) {\n alert(test);\n }\n});\n\nExt.define('My.own.B', {\n extend: 'My.own.A',\n\n constructor: function(test) {\n alert(test);\n\n this.callParent([test + 1]);\n }\n});\n\nExt.define('My.own.C', {\n extend: 'My.own.B',\n\n constructor: function() {\n alert(\"Going to call parent's overriden constructor...\");\n\n this.callParent(arguments);\n }\n});\n\nvar a = new My.own.A(1); // alerts '1'\nvar b = new My.own.B(1); // alerts '1', then alerts '2'\nvar c = new My.own.C(2); // alerts \"Going to call parent's overriden constructor...\"\n // alerts '2', then alerts '3'\nThe arguments, either an array or the arguments object\nfrom the current method, for example: this.callParent(arguments)
Returns the result from the superclass' method
\nDestroys this layout. This is a template method that is empty by default, but should be implemented\nby subclasses that require explicit destruction to purge event handlers or remove DOM nodes.
\nThis is a template method. A hook into the functionality of this class.Feel free to override it in child classes.
Returns an array of child components either for a render phase (Performed in the beforeLayout method of the layout's\nbase class), or the layout phase (onLayout).
\n\nof child components
\nReturn the active (visible) component in the layout to the next card
\nThe next component or false.
\nReturn the active (visible) component in the layout to the previous card
\nThe previous component or false.
\nReturns the element into which rendering must take place. Defaults to the owner Container's target element.
\n\n\nMay be overridden in layout managers which implement an inner element.
\nInitialize configuration for this class. a typical example:
\n\nExt.define('My.awesome.Class', {\n // The default config\n config: {\n name: 'Awesome',\n isAwesome: true\n },\n\n constructor: function(config) {\n this.initConfig(config);\n\n return this;\n }\n});\n\nvar awesome = new My.awesome.Class({\n name: 'Super Awesome'\n});\n\nalert(awesome.getName()); // 'Super Awesome'\nmixins The mixin prototypes as key - value pairs
\nSets the active (visible) component in the layout to the next card
\nthe activated component or false when nothing activated.
\nSets the active (visible) component in the layout to the previous card
\nthe activated component or false when nothing activated.
\nMakes the given card active.
\n\nvar card1 = Ext.create('Ext.panel.Panel', {itemId: 'card-1'});\nvar card2 = Ext.create('Ext.panel.Panel', {itemId: 'card-2'});\nvar panel = Ext.create('Ext.panel.Panel', {\n layout: 'card',\n activeItem: 0,\n items: [card1, card2]\n});\n// These are all equivalent\npanel.getLayout().setActiveItem(card2);\npanel.getLayout().setActiveItem('card-2');\npanel.getLayout().setActiveItem(1);\nthe activated component or false when nothing activated.\nFalse is returned also when trying to activate an already active card.
\nGet the reference to the class from which this object was instantiated. Note that unlike self,\nthis.statics() is scope-independent and it always returns the class from which it was called, regardless of what\nthis points to during run-time
Ext.define('My.Cat', {\n statics: {\n totalCreated: 0,\n speciesName: 'Cat' // My.Cat.speciesName = 'Cat'\n },\n\n constructor: function() {\n var statics = this.statics();\n\n alert(statics.speciesName); // always equals to 'Cat' no matter what 'this' refers to\n // equivalent to: My.Cat.speciesName\n\n alert(this.self.speciesName); // dependent on 'this'\n\n statics.totalCreated++;\n\n return this;\n },\n\n clone: function() {\n var cloned = new this.self; // dependent on 'this'\n\n cloned.groupName = this.statics().speciesName; // equivalent to: My.Cat.speciesName\n\n return cloned;\n }\n});\n\n\nExt.define('My.SnowLeopard', {\n extend: 'My.Cat',\n\n statics: {\n speciesName: 'Snow Leopard' // My.SnowLeopard.speciesName = 'Snow Leopard'\n },\n\n constructor: function() {\n this.callParent();\n }\n});\n\nvar cat = new My.Cat(); // alerts 'Cat', then alerts 'Cat'\n\nvar snowLeopard = new My.SnowLeopard(); // alerts 'Cat', then alerts 'Snow Leopard'\n\nvar clone = snowLeopard.clone();\nalert(Ext.getClassName(clone)); // alerts 'My.SnowLeopard'\nalert(clone.groupName); // alerts 'Cat'\n\nalert(My.Cat.totalCreated); // alerts 3\nAdd / override static properties of this class.
\n\nExt.define('My.cool.Class', {\n ...\n});\n\nMy.cool.Class.addStatics({\n someProperty: 'someValue', // My.cool.Class.someProperty = 'someValue'\n method1: function() { ... }, // My.cool.Class.method1 = function() { ... };\n method2: function() { ... } // My.cool.Class.method2 = function() { ... };\n});\nthis
\nBorrow another class' members to the prototype of this class.
\n\nExt.define('Bank', {\n money: '$$$',\n printMoney: function() {\n alert('$$$$$$$');\n }\n});\n\nExt.define('Thief', {\n ...\n});\n\nThief.borrow(Bank, ['money', 'printMoney']);\n\nvar steve = new Thief();\n\nalert(steve.money); // alerts '$$$'\nsteve.printMoney(); // alerts '$$$$$$$'\nThe class to borrow members from
\nThe names of the members to borrow
\nthis
\nCreate a new instance of this Class.
\n\nExt.define('My.cool.Class', {\n ...\n});\n\nMy.cool.Class.create({\n someConfig: true\n});\nAll parameters are passed to the constructor of the class.
\nthe created instance.
\nCreate aliases for existing prototype methods. Example:
\n\nExt.define('My.cool.Class', {\n method1: function() { ... },\n method2: function() { ... }\n});\n\nvar test = new My.cool.Class();\n\nMy.cool.Class.createAlias({\n method3: 'method1',\n method4: 'method2'\n});\n\ntest.method3(); // test.method1()\n\nMy.cool.Class.createAlias('method5', 'method3');\n\ntest.method5(); // test.method3() -> test.method1()\nThe new method name, or an object to set multiple aliases. See\nflexSetter
\nThe original method name
\nGet the current class' name in string format.
\n\nExt.define('My.cool.Class', {\n constructor: function() {\n alert(this.self.getName()); // alerts 'My.cool.Class'\n }\n});\n\nMy.cool.Class.getName(); // 'My.cool.Class'\nclassName
\nAdd methods / properties to the prototype of this class.
\n\nExt.define('My.awesome.Cat', {\n constructor: function() {\n ...\n }\n});\n\n My.awesome.Cat.implement({\n meow: function() {\n alert('Meowww...');\n }\n });\n\n var kitty = new My.awesome.Cat;\n kitty.meow();\nOverride prototype members of this class. Overridden methods can be invoked via\ncallOverridden
\n\nExt.define('My.Cat', {\n constructor: function() {\n alert(\"I'm a cat!\");\n\n return this;\n }\n});\n\nMy.Cat.override({\n constructor: function() {\n alert(\"I'm going to be a cat!\");\n\n var instance = this.callOverridden();\n\n alert(\"Meeeeoooowwww\");\n\n return instance;\n }\n});\n\nvar kitty = new My.Cat(); // alerts \"I'm going to be a cat!\"\n // alerts \"I'm a cat!\"\n // alerts \"Meeeeoooowwww\"\nthis
\n