docs/output/Ext.layout.container.Accordion.js

   1 Ext.data.JsonP.Ext_layout_container_Accordion({
   2   "tagname": "class",
   3   "name": "Ext.layout.container.Accordion",
   4   "doc": "<p>This is a layout that manages multiple Panels in an expandable accordion style such that only\n<b>one Panel can be expanded at any given time</b>. Each Panel has built-in support for expanding and collapsing.</p>\n\n\n<p>Note: Only Ext.Panels <b>and all subclasses of Ext.panel.Panel</b> may be used in an accordion layout Container.</p>\n\n\n<p><p><img src=\"doc-resources/Ext.layout.container.Accordion/Ext.layout.container.Accordion.png\" alt=\"Ext.layout.container.Accordion container layout\"></p></p>\n\n<p>Example usage:</p>\n\n\n<pre><code>Ext.create('Ext.panel.Panel', {\n    title: 'Accordion Layout',\n    width: 300,\n    height: 300,\n    layout:'accordion',\n    defaults: {\n        // applied to each contained panel\n        bodyStyle: 'padding:15px'\n    },\n    layoutConfig: {\n        // layout-specific configs go here\n        titleCollapse: false,\n        animate: true,\n        activeOnTop: true\n    },\n    items: [{\n        title: 'Panel 1',\n        html: 'Panel content!'\n    },{\n        title: 'Panel 2',\n        html: 'Panel content!'\n    },{\n        title: 'Panel 3',\n        html: 'Panel content!'\n    }],\n    renderTo: Ext.getBody()\n});\n</code></pre>\n\n",
   5   "extends": "Ext.layout.container.VBox",
   6   "mixins": [
   7
   8   ],
   9   "alternateClassNames": [
  10     "Ext.layout.AccordionLayout"
  11   ],
  12   "xtype": null,
  13   "author": null,
  14   "docauthor": null,
  15   "singleton": false,
  16   "private": false,
  17   "cfg": [
  18     {
  19       "tagname": "cfg",
  20       "name": "activeOnTop",
  21       "member": "Ext.layout.container.Accordion",
  22       "type": "Boolean",
  23       "doc": "<p><b>Not implemented in PR4.</b></p>\n\n\n<p>Only valid when {@link #multi\" is <code>false</code>.</p>\n\n\n<p>True to swap the position of each panel as it is expanded so that it becomes the first item in the container,\nfalse to keep the panels in the rendered order. <b>This is NOT compatible with \"animate:true\"</b> (defaults to false).</p>\n",
  24       "private": false,
  25       "filename": "/Users/nick/Projects/sencha/SDK/extjs/src/layout/container/Accordion.js",
  26       "linenr": 85,
  27       "html_filename": "Accordion.html",
  28       "href": "Accordion.html#Ext-layout-container-Accordion-cfg-activeOnTop",
  29       "shortDoc": "Not implemented in PR4.\n\n\nOnly valid when {@link #multi\" is false.\n\n\nTrue to swap the position of each panel as it is..."
  30     },
  31     {
  32       "tagname": "cfg",
  33       "name": "align",
  34       "member": "Ext.layout.container.VBox",
  35       "type": "String",
  36       "doc": "<p>Controls how the child items of the container are aligned. Acceptable configuration values for this\nproperty are:</p>\n\n<div class=\"mdetail-params\"><ul>\n<li><b><tt>left</tt></b> : <b>Default</b><div class=\"sub-desc\">child items are aligned horizontally\nat the <b>left</b> side of the container</div></li>\n<li><b><tt>center</tt></b> : <div class=\"sub-desc\">child items are aligned horizontally at the\n<b>mid-width</b> of the container</div></li>\n<li><b><tt>stretch</tt></b> : <div class=\"sub-desc\">child items are stretched horizontally to fill\nthe width of the container</div></li>\n<li><b><tt>stretchmax</tt></b> : <div class=\"sub-desc\">child items are stretched horizontally to\nthe size of the largest item.</div></li>\n</ul></div>\n\n",
  37       "private": false,
  38       "filename": "/Users/nick/Projects/sencha/SDK/extjs/src/layout/container/VBox.js",
  39       "linenr": 46,
  40       "html_filename": "VBox.html",
  41       "href": "VBox.html#Ext-layout-container-VBox-cfg-align",
  42       "shortDoc": "Controls how the child items of the container are aligned. Acceptable configuration values for this\nproperty are:\n\n\nl..."
  43     },
  44     {
  45       "tagname": "cfg",
  46       "name": "animate",
  47       "member": "Ext.layout.container.Accordion",
  48       "type": "Boolean",
  49       "doc": "<p>True to slide the contained panels open and closed during expand/collapse using animation, false to open and\nclose directly with no animation (defaults to <code>true</code>). Note: The layout performs animated collapsing\nand expanding, <i>not</i> the child Panels.</p>\n",
  50       "private": false,
  51       "filename": "/Users/nick/Projects/sencha/SDK/extjs/src/layout/container/Accordion.js",
  52       "linenr": 78,
  53       "html_filename": "Accordion.html",
  54       "href": "Accordion.html#Ext-layout-container-Accordion-cfg-animate",
  55       "shortDoc": "True to slide the contained panels open and closed during expand/collapse using animation, false to open and\nclose di..."
  56     },
  57     {
  58       "tagname": "cfg",
  59       "name": "autoWidth",
  60       "member": "Ext.layout.container.Accordion",
  61       "type": "Boolean",
  62       "doc": "<p><b>This config is ignored in ExtJS 4.x.</b></p>\n\n\n<p>Child Panels have their width actively managed to fit within the accordion's width.</p>\n",
  63       "private": false,
  64       "filename": "/Users/nick/Projects/sencha/SDK/extjs/src/layout/container/Accordion.js",
  65       "linenr": 52,
  66       "html_filename": "Accordion.html",
  67       "href": "Accordion.html#Ext-layout-container-Accordion-cfg-autoWidth",
  68       "shortDoc": "This config is ignored in ExtJS 4.x.\n\n\nChild Panels have their width actively managed to fit within the accordion's w..."
  69     },
  70     {
  71       "tagname": "cfg",
  72       "name": "bindToOwnerCtComponent",
  73       "member": "Ext.layout.container.AbstractContainer",
  74       "type": "Boolean",
  75       "doc": "<p>Flag to notify the ownerCt Component on afterLayout of a change</p>\n",
  76       "private": false,
  77       "filename": "/Users/nick/Projects/sencha/SDK/platform/src/layout/container/AbstractContainer.js",
  78       "linenr": 24,
  79       "html_filename": "AbstractContainer2.html",
  80       "href": "AbstractContainer2.html#Ext-layout-container-AbstractContainer-cfg-bindToOwnerCtComponent"
  81     },
  82     {
  83       "tagname": "cfg",
  84       "name": "bindToOwnerCtContainer",
  85       "member": "Ext.layout.container.AbstractContainer",
  86       "type": "Boolean",
  87       "doc": "<p>Flag to notify the ownerCt Container on afterLayout of a change</p>\n",
  88       "private": false,
  89       "filename": "/Users/nick/Projects/sencha/SDK/platform/src/layout/container/AbstractContainer.js",
  90       "linenr": 30,
  91       "html_filename": "AbstractContainer2.html",
  92       "href": "AbstractContainer2.html#Ext-layout-container-AbstractContainer-cfg-bindToOwnerCtContainer"
  93     },
  94     {
  95       "tagname": "cfg",
  96       "name": "clearInnerCtOnLayout",
  97       "member": "Ext.layout.container.Box",
  98       "type": "Boolean",
  99       "doc": "\n",
 100       "private": false,
 101       "filename": "/Users/nick/Projects/sencha/SDK/extjs/src/layout/container/Box.js",
 102       "linenr": 128,
 103       "html_filename": "Box.html",
 104       "href": "Box.html#Ext-layout-container-Box-cfg-clearInnerCtOnLayout"
 105     },
 106     {
 107       "tagname": "cfg",
 108       "name": "collapseFirst",
 109       "member": "Ext.layout.container.Accordion",
 110       "type": "Boolean",
 111       "doc": "<p>True to make sure the collapse/expand toggle button always renders first (to the left of) any other tools\nin the contained Panels' title bars, false to render it last (defaults to false).</p>\n",
 112       "private": false,
 113       "filename": "/Users/nick/Projects/sencha/SDK/extjs/src/layout/container/Accordion.js",
 114       "linenr": 72,
 115       "html_filename": "Accordion.html",
 116       "href": "Accordion.html#Ext-layout-container-Accordion-cfg-collapseFirst",
 117       "shortDoc": "True to make sure the collapse/expand toggle button always renders first (to the left of) any other tools\nin the cont..."
 118     },
 119     {
 120       "tagname": "cfg",
 121       "name": "defaultMargins",
 122       "member": "Ext.layout.container.Box",
 123       "type": "Object",
 124       "doc": "<p>If the individual contained items do not have a <tt>margins</tt>\nproperty specified or margin specified via CSS, the default margins from this property will be\napplied to each item.</p>\n\n\n<br><p>This property may be specified as an object containing margins\n\n\n<p>to apply in the format:</p></p>\n\n<pre><code>{\n    top: (top margin),\n    right: (right margin),\n    bottom: (bottom margin),\n    left: (left margin)\n}</code></pre>\n\n\n<p>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:</p>\n\n\n<div class=\"mdetail-params\"><ul>\n<li>If there is only one value, it applies to all sides.</li>\n<li>If there are two values, the top and bottom borders are set to the\nfirst value and the right and left are set to the second.</li>\n<li>If there are three values, the top is set to the first value, the left\nand right are set to the second, and the bottom is set to the third.</li>\n<li>If there are four values, they apply to the top, right, bottom, and\nleft, respectively.</li>\n</ul></div>\n\n\n<p>Defaults to:</p>\n\n\n<pre><code>{top:0, right:0, bottom:0, left:0}\n</code></pre>\n\n",
 125       "private": false,
 126       "filename": "/Users/nick/Projects/sencha/SDK/extjs/src/layout/container/Box.js",
 127       "linenr": 32,
 128       "html_filename": "Box.html",
 129       "href": "Box.html#Ext-layout-container-Box-cfg-defaultMargins",
 130       "shortDoc": "If the individual contained items do not have a margins\nproperty specified or margin specified via CSS, the default m..."
 131     },
 132     {
 133       "tagname": "cfg",
 134       "name": "fill",
 135       "member": "Ext.layout.container.Accordion",
 136       "type": "Boolean",
 137       "doc": "<p>True to adjust the active item's height to fill the available space in the container, false to use the\nitem's current height, or auto height if not explicitly set (defaults to true).</p>\n",
 138       "private": false,
 139       "filename": "/Users/nick/Projects/sencha/SDK/extjs/src/layout/container/Accordion.js",
 140       "linenr": 46,
 141       "html_filename": "Accordion.html",
 142       "href": "Accordion.html#Ext-layout-container-Accordion-cfg-fill",
 143       "shortDoc": "True to adjust the active item's height to fill the available space in the container, false to use the\nitem's current..."
 144     },
 145     {
 146       "tagname": "cfg",
 147       "name": "flex",
 148       "member": "Ext.layout.container.Box",
 149       "type": "Number",
 150       "doc": "<p>This configuration option is to be applied to <b>child <tt>items</tt></b> of the container managed\nby this layout. Each child item with a <tt>flex</tt> property will be flexed <b>horizontally</b>\naccording to each item's <b>relative</b> <tt>flex</tt> value compared to the sum of all items with\na <tt>flex</tt> value specified.  Any child items that have either a <tt>flex = 0</tt> or\n<tt>flex = undefined</tt> will not be 'flexed' (the initial size will not be changed).</p>\n",
 151       "private": false,
 152       "filename": "/Users/nick/Projects/sencha/SDK/extjs/src/layout/container/Box.js",
 153       "linenr": 102,
 154       "html_filename": "Box.html",
 155       "href": "Box.html#Ext-layout-container-Box-cfg-flex",
 156       "shortDoc": "This configuration option is to be applied to child items of the container managed\nby this layout. Each child item wi..."
 157     },
 158     {
 159       "tagname": "cfg",
 160       "name": "hideCollapseTool",
 161       "member": "Ext.layout.container.Accordion",
 162       "type": "Boolean",
 163       "doc": "<p>True to hide the contained Panels' collapse/expand toggle buttons, false to display them (defaults to false).\nWhen set to true, <a href=\"#/api/Ext.layout.container.Accordion-cfg-titleCollapse\" rel=\"Ext.layout.container.Accordion-cfg-titleCollapse\" class=\"docClass\">titleCollapse</a> is automatically set to <code>true</code>.</p>\n",
 164       "private": false,
 165       "filename": "/Users/nick/Projects/sencha/SDK/extjs/src/layout/container/Accordion.js",
 166       "linenr": 66,
 167       "html_filename": "Accordion.html",
 168       "href": "Accordion.html#Ext-layout-container-Accordion-cfg-hideCollapseTool",
 169       "shortDoc": "True to hide the contained Panels' collapse/expand toggle buttons, false to display them (defaults to false).\nWhen se..."
 170     },
 171     {
 172       "tagname": "cfg",
 173       "name": "itemCls",
 174       "member": "Ext.layout.container.AbstractContainer",
 175       "type": "String",
 176       "doc": "<p>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\n<a href=\"#/api/Ext.Component\" rel=\"Ext.Component\" class=\"docClass\">Ext.Component</a>.<a href=\"#/api/Ext.Component--ctCls\" rel=\"Ext.Component--ctCls\" class=\"docClass\">ctCls</a> also.</p>\n\n\n<p></p></p>\n",
 177       "private": false,
 178       "filename": "/Users/nick/Projects/sencha/SDK/platform/src/layout/container/AbstractContainer.js",
 179       "linenr": 36,
 180       "html_filename": "AbstractContainer2.html",
 181       "href": "AbstractContainer2.html#Ext-layout-container-AbstractContainer-cfg-itemCls",
 182       "shortDoc": "An optional extra CSS class that will be added to the container. This can be useful for adding\ncustomized styles to t..."
 183     },
 184     {
 185       "tagname": "cfg",
 186       "name": "multi",
 187       "member": "Ext.layout.container.Accordion",
 188       "type": "Boolean",
 189       "doc": "<p>Defaults to <code>false</code>. Set to <code>true</code> to enable multiple accordion items to be open at once.</p>\n",
 190       "private": false,
 191       "filename": "/Users/nick/Projects/sencha/SDK/extjs/src/layout/container/Accordion.js",
 192       "linenr": 93,
 193       "html_filename": "Accordion.html",
 194       "href": "Accordion.html#Ext-layout-container-Accordion-cfg-multi"
 195     },
 196     {
 197       "tagname": "cfg",
 198       "name": "pack",
 199       "member": "Ext.layout.container.Box",
 200       "type": "String",
 201       "doc": "<p>Controls how the child items of the container are packed together. Acceptable configuration values\nfor this property are:</p>\n\n<div class=\"mdetail-params\"><ul>\n<li><b><tt>start</tt></b> : <b>Default</b><div class=\"sub-desc\">child items are packed together at\n<b>left</b> side of container</div></li>\n<li><b><tt>center</tt></b> : <div class=\"sub-desc\">child items are packed together at\n<b>mid-width</b> of container</div></li>\n<li><b><tt>end</tt></b> : <div class=\"sub-desc\">child items are packed together at <b>right</b>\nside of container</div></li>\n</ul></div>\n\n",
 202       "private": false,
 203       "filename": "/Users/nick/Projects/sencha/SDK/extjs/src/layout/container/Box.js",
 204       "linenr": 89,
 205       "html_filename": "Box.html",
 206       "href": "Box.html#Ext-layout-container-Box-cfg-pack",
 207       "shortDoc": "Controls how the child items of the container are packed together. Acceptable configuration values\nfor this property ..."
 208     },
 209     {
 210       "tagname": "cfg",
 211       "name": "padding",
 212       "member": "Ext.layout.container.Box",
 213       "type": "String",
 214       "doc": "<p>Sets the padding to be applied to all child items managed by this layout.</p>\n\n\n<p>This property must be specified as a string containing\nspace-separated, numeric padding values. The order of the sides associated\nwith each value matches the way CSS processes padding values:</p>\n\n\n<div class=\"mdetail-params\"><ul>\n<li>If there is only one value, it applies to all sides.</li>\n<li>If there are two values, the top and bottom borders are set to the\nfirst value and the right and left are set to the second.</li>\n<li>If there are three values, the top is set to the first value, the left\nand right are set to the second, and the bottom is set to the third.</li>\n<li>If there are four values, they apply to the top, right, bottom, and\nleft, respectively.</li>\n</ul></div>\n\n\n<p>Defaults to: <code>\"0\"</code></p>\n\n",
 215       "private": false,
 216       "filename": "/Users/nick/Projects/sencha/SDK/extjs/src/layout/container/Box.js",
 217       "linenr": 68,
 218       "html_filename": "Box.html",
 219       "href": "Box.html#Ext-layout-container-Box-cfg-padding",
 220       "shortDoc": "Sets the padding to be applied to all child items managed by this layout.\n\n\nThis property must be specified as a stri..."
 221     },
 222     {
 223       "tagname": "cfg",
 224       "name": "titleCollapse",
 225       "member": "Ext.layout.container.Accordion",
 226       "type": "Boolean",
 227       "doc": "<p><b>Not implemented in PR2.</b></p>\n\n\n<p>True to allow expand/collapse of each contained panel by clicking anywhere on the title bar, false to allow\nexpand/collapse only when the toggle tool button is clicked (defaults to true).  When set to false,\n<a href=\"#/api/Ext.layout.container.Accordion-cfg-hideCollapseTool\" rel=\"Ext.layout.container.Accordion-cfg-hideCollapseTool\" class=\"docClass\">hideCollapseTool</a> should be false also.</p>\n",
 228       "private": false,
 229       "filename": "/Users/nick/Projects/sencha/SDK/extjs/src/layout/container/Accordion.js",
 230       "linenr": 58,
 231       "html_filename": "Accordion.html",
 232       "href": "Accordion.html#Ext-layout-container-Accordion-cfg-titleCollapse",
 233       "shortDoc": "Not implemented in PR2.\n\n\nTrue to allow expand/collapse of each contained panel by clicking anywhere on the title bar..."
 234     }
 235   ],
 236   "method": [
 237     {
 238       "tagname": "method",
 239       "name": "getLayoutItems",
 240       "member": "Ext.layout.container.AbstractContainer",
 241       "doc": "<p>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).</p>\n\n",
 242       "params": [
 243
 244       ],
 245       "return": {
 246         "type": "Array",
 247         "doc": "<p>of child components</p>\n"
 248       },
 249       "private": false,
 250       "static": false,
 251       "filename": "/Users/nick/Projects/sencha/SDK/platform/src/layout/container/AbstractContainer.js",
 252       "linenr": 87,
 253       "html_filename": "AbstractContainer2.html",
 254       "href": "AbstractContainer2.html#Ext-layout-container-AbstractContainer-method-getLayoutItems",
 255       "shortDoc": "Returns an array of child components either for a render phase (Performed in the beforeLayout method of the layout's\n..."
 256     },
 257     {
 258       "tagname": "method",
 259       "name": "getRenderTarget",
 260       "member": "Ext.layout.container.AbstractContainer",
 261       "doc": "<p>Returns the element into which rendering must take place. Defaults to the owner Container's <a href=\"#/api/Ext.AbstractComponent--targetEl\" rel=\"Ext.AbstractComponent--targetEl\" class=\"docClass\">Ext.AbstractComponent.targetEl</a>.</p>\n\n\n<p>May be overridden in layout managers which implement an inner element.</p>\n",
 262       "params": [
 263
 264       ],
 265       "return": {
 266         "type": "Ext.core.Element",
 267         "doc": "\n"
 268       },
 269       "private": false,
 270       "static": false,
 271       "filename": "/Users/nick/Projects/sencha/SDK/platform/src/layout/container/AbstractContainer.js",
 272       "linenr": 106,
 273       "html_filename": "AbstractContainer2.html",
 274       "href": "AbstractContainer2.html#Ext-layout-container-AbstractContainer-method-getRenderTarget",
 275       "shortDoc": "Returns the element into which rendering must take place. Defaults to the owner Container's Ext.AbstractComponent.tar..."
 276     },
 277     {
 278       "tagname": "method",
 279       "name": "getTarget",
 280       "member": "Ext.layout.container.AbstractContainer",
 281       "doc": "<p>Returns the owner component's resize element.</p>\n",
 282       "params": [
 283
 284       ],
 285       "return": {
 286         "type": "Ext.core.Element",
 287         "doc": "\n"
 288       },
 289       "private": false,
 290       "static": false,
 291       "filename": "/Users/nick/Projects/sencha/SDK/platform/src/layout/container/AbstractContainer.js",
 292       "linenr": 99,
 293       "html_filename": "AbstractContainer2.html",
 294       "href": "AbstractContainer2.html#Ext-layout-container-AbstractContainer-method-getTarget",
 295       "shortDoc": "<p>Returns the owner component's resize element.</p>\n"
 296     },
 297     {
 298       "tagname": "method",
 299       "name": "updateChildBoxes",
 300       "member": "Ext.layout.container.Box",
 301       "doc": "<p>Resizes and repositions each child component</p>\n",
 302       "params": [
 303         {
 304           "type": "Array",
 305           "name": "boxes",
 306           "doc": "<p>The box measurements</p>\n",
 307           "optional": false
 308         }
 309       ],
 310       "return": {
 311         "type": "void",
 312         "doc": "\n"
 313       },
 314       "private": false,
 315       "static": false,
 316       "filename": "/Users/nick/Projects/sencha/SDK/extjs/src/layout/container/Box.js",
 317       "linenr": 580,
 318       "html_filename": "Box.html",
 319       "href": "Box.html#Ext-layout-container-Box-method-updateChildBoxes",
 320       "shortDoc": "<p>Resizes and repositions each child component</p>\n"
 321     }
 322   ],
 323   "property": [
 324
 325   ],
 326   "event": [
 327
 328   ],
 329   "filename": "/Users/nick/Projects/sencha/SDK/extjs/src/layout/container/Accordion.js",
 330   "linenr": 1,
 331   "html_filename": "Accordion.html",
 332   "href": "Accordion.html#Ext-layout-container-Accordion",
 333   "cssVar": [
 334
 335   ],
 336   "cssMixin": [
 337
 338   ],
 339   "component": false,
 340   "superclasses": [
 341     "Ext.layout.Layout",
 342     "Ext.layout.container.AbstractContainer",
 343     "Ext.layout.container.Container",
 344     "Ext.layout.container.Box",
 345     "Ext.layout.container.VBox"
 346   ],
 347   "subclasses": [
 348
 349   ],
 350   "mixedInto": [
 351
 352   ],
 353   "allMixins": [
 354
 355   ]
 356 });