1 | /*! |
---|
2 | * Ext JS Library 3.0.0 |
---|
3 | * Copyright(c) 2006-2009 Ext JS, LLC |
---|
4 | * licensing@extjs.com |
---|
5 | * http://www.extjs.com/license |
---|
6 | */ |
---|
7 | /** |
---|
8 | * @class Ext.ButtonGroup |
---|
9 | * @extends Ext.Panel |
---|
10 | * Container for a group of buttons. Example usage: |
---|
11 | * <pre><code> |
---|
12 | var p = new Ext.Panel({ |
---|
13 | title: 'Panel with Button Group', |
---|
14 | width: 300, |
---|
15 | height:200, |
---|
16 | renderTo: document.body, |
---|
17 | html: 'whatever', |
---|
18 | tbar: [{ |
---|
19 | xtype: 'buttongroup', |
---|
20 | {@link #columns}: 3, |
---|
21 | title: 'Clipboard', |
---|
22 | items: [{ |
---|
23 | text: 'Paste', |
---|
24 | scale: 'large', |
---|
25 | rowspan: 3, iconCls: 'add', |
---|
26 | iconAlign: 'top', |
---|
27 | cls: 'x-btn-as-arrow' |
---|
28 | },{ |
---|
29 | xtype:'splitbutton', |
---|
30 | text: 'Menu Button', |
---|
31 | scale: 'large', |
---|
32 | rowspan: 3, |
---|
33 | iconCls: 'add', |
---|
34 | iconAlign: 'top', |
---|
35 | arrowAlign:'bottom', |
---|
36 | menu: [{text: 'Menu Item 1'}] |
---|
37 | },{ |
---|
38 | xtype:'splitbutton', text: 'Cut', iconCls: 'add16', menu: [{text: 'Cut Menu Item'}] |
---|
39 | },{ |
---|
40 | text: 'Copy', iconCls: 'add16' |
---|
41 | },{ |
---|
42 | text: 'Format', iconCls: 'add16' |
---|
43 | }] |
---|
44 | }] |
---|
45 | }); |
---|
46 | * </code></pre> |
---|
47 | * @xtype buttongroup |
---|
48 | */ |
---|
49 | Ext.ButtonGroup = Ext.extend(Ext.Panel, { |
---|
50 | /** |
---|
51 | * @cfg {Number} columns The <tt>columns</tt> configuration property passed to the |
---|
52 | * {@link #layout configured layout manager}. See {@link Ext.layout.TableLayout#columns}. |
---|
53 | */ |
---|
54 | /** |
---|
55 | * @cfg {String} baseCls Defaults to <tt>'x-btn-group'</tt>. See {@link Ext.Panel#baseCls}. |
---|
56 | */ |
---|
57 | baseCls: 'x-btn-group', |
---|
58 | /** |
---|
59 | * @cfg {String} layout Defaults to <tt>'table'</tt>. See {@link Ext.Container#layout}. |
---|
60 | */ |
---|
61 | layout:'table', |
---|
62 | defaultType: 'button', |
---|
63 | /** |
---|
64 | * @cfg {Boolean} frame Defaults to <tt>true</tt>. See {@link Ext.Panel#frame}. |
---|
65 | */ |
---|
66 | frame: true, |
---|
67 | internalDefaults: {removeMode: 'container', hideParent: true}, |
---|
68 | |
---|
69 | initComponent : function(){ |
---|
70 | this.layoutConfig = this.layoutConfig || {}; |
---|
71 | Ext.applyIf(this.layoutConfig, { |
---|
72 | columns : this.columns |
---|
73 | }); |
---|
74 | if(!this.title){ |
---|
75 | this.addClass('x-btn-group-notitle'); |
---|
76 | } |
---|
77 | this.on('afterlayout', this.onAfterLayout, this); |
---|
78 | Ext.ButtonGroup.superclass.initComponent.call(this); |
---|
79 | }, |
---|
80 | |
---|
81 | applyDefaults : function(c){ |
---|
82 | c = Ext.ButtonGroup.superclass.applyDefaults.call(this, c); |
---|
83 | var d = this.internalDefaults; |
---|
84 | if(c.events){ |
---|
85 | Ext.applyIf(c.initialConfig, d); |
---|
86 | Ext.apply(c, d); |
---|
87 | }else{ |
---|
88 | Ext.applyIf(c, d); |
---|
89 | } |
---|
90 | return c; |
---|
91 | }, |
---|
92 | |
---|
93 | onAfterLayout : function(){ |
---|
94 | var bodyWidth = this.body.getFrameWidth('lr') + this.body.dom.firstChild.offsetWidth; |
---|
95 | this.body.setWidth(bodyWidth); |
---|
96 | this.el.setWidth(bodyWidth + this.getFrameWidth()); |
---|
97 | } |
---|
98 | /** |
---|
99 | * @cfg {Array} tools @hide |
---|
100 | */ |
---|
101 | }); |
---|
102 | |
---|
103 | Ext.reg('buttongroup', Ext.ButtonGroup); |
---|