src/toolbar/Spacer.js

   1 /**
   2  * @class Ext.toolbar.Spacer
   3  * @extends Ext.toolbar.Item
   4  * A simple element that adds extra horizontal space between items in a toolbar.
   5  * By default a 2px wide space is added via css specification:
   6  *
   7  *     .x-toolbar .x-toolbar-spacer {
   8  *         width:2px;
   9  *     }
  10  *
  11  * ## Example
  12  *
  13  * {@img Ext.toolbar.Spacer/Ext.toolbar.Spacer.png Toolbar Spacer}
  14  *
  15  *     Ext.create('Ext.panel.Panel', {
  16  *         title: 'Toolbar Spacer Example',
  17  *         width: 300,
  18  *         height: 200,
  19  *         tbar : [
  20  *             'Item 1',
  21  *             {xtype: 'tbspacer'}, // or ' '
  22  *             'Item 2',
  23  *             // space width is also configurable via javascript
  24  *             {xtype: 'tbspacer', width: 50}, // add a 50px space
  25  *             'Item 3'
  26  *         ],
  27  *         renderTo: Ext.getBody()
  28  *     });
  29  *
  30  * @constructor
  31  * Creates a new Spacer
  32  * @xtype tbspacer
  33  */
  34 Ext.define('Ext.toolbar.Spacer', {
  35     extend: 'Ext.Component',
  36     alias: 'widget.tbspacer',
  37     alternateClassName: 'Ext.Toolbar.Spacer',
  38     baseCls: Ext.baseCSSPrefix + 'toolbar-spacer',
  39     focusable: false
  40 });