{@link #add}
- * @xtype toolbar
+ * @param {Object/Object[]} config A config object or an array of buttons to {@link #add}
* @docauthor Robert Dougan layout:'hbox'
).
- * Developers may override this configuration option if another layout
+ * This class assigns a default layout (`layout: 'hbox'`).
+ * Developers _may_ override this configuration option if another layout
* is required (the constructor must be passed a configuration object in this
* case instead of an array).
* See {@link Ext.container.Container#layout} for additional information.
@@ -232,16 +234,22 @@ Ext.define('Ext.toolbar.Toolbar', {
/**
* @cfg {Boolean} enableOverflow
- * Defaults to false. Configure true
to make the toolbar provide a button
- * which activates a dropdown Menu to show items which overflow the Toolbar's width.
+ * Configure true to make the toolbar provide a button which activates a dropdown Menu to show
+ * items which overflow the Toolbar's width.
*/
enableOverflow: false,
+
+ /**
+ * @cfg {String} menuTriggerCls
+ * Configure the icon class of the overflow button.
+ */
+ menuTriggerCls: Ext.baseCSSPrefix + 'toolbar-more-icon',
// private
trackMenus: true,
-
+
itemCls: Ext.baseCSSPrefix + 'toolbar-item',
-
+
initComponent: function() {
var me = this,
keys;
@@ -250,7 +258,7 @@ Ext.define('Ext.toolbar.Toolbar', {
if (!me.layout && me.enableOverflow) {
me.layout = { overflowHandler: 'Menu' };
}
-
+
if (me.dock === 'right' || me.dock === 'left') {
me.vertical = true;
}
@@ -259,18 +267,19 @@ Ext.define('Ext.toolbar.Toolbar', {
type: me.layout
} : me.layout || {}, {
type: me.vertical ? 'vbox' : 'hbox',
- align: me.vertical ? 'stretchmax' : 'middle'
+ align: me.vertical ? 'stretchmax' : 'middle',
+ clearInnerCtOnLayout: true
});
-
+
if (me.vertical) {
me.addClsWithUI('vertical');
}
-
+
// @TODO: remove this hack and implement a more general solution
if (me.ui === 'footer') {
me.ignoreBorderManagement = true;
}
-
+
me.callParent();
/**
@@ -280,7 +289,7 @@ Ext.define('Ext.toolbar.Toolbar', {
* @param {Boolean} lastOverflow overflow state
*/
me.addEvents('overflowchange');
-
+
// Subscribe to Ext.FocusManager for key navigation
keys = me.vertical ? ['up', 'down'] : ['left', 'right'];
Ext.FocusManager.subscribe(me, {
@@ -288,24 +297,38 @@ Ext.define('Ext.toolbar.Toolbar', {
});
},
+ getRefItems: function(deep) {
+ var me = this,
+ items = me.callParent(arguments),
+ layout = me.layout,
+ handler;
+
+ if (deep && me.enableOverflow) {
+ handler = layout.overflowHandler;
+ if (handler && handler.menu) {
+ items = items.concat(handler.menu.getRefItems(deep));
+ }
+ }
+ return items;
+ },
+
/**
- * Adds element(s) to the toolbar -- this function takes a variable number of - * arguments of mixed type and adds them to the toolbar.
- *Note: See the notes within {@link Ext.container.Container#add}.
- * @param {Mixed} arg1 The following types of arguments are all valid: