X-Git-Url: http://git.ithinksw.org/extjs.git/blobdiff_plain/ee06f37b0f6f6d94cd05a6ffae556660f7c4a2bc..c930e9176a5a85509c5b0230e2bff5c22a591432:/docs/source/toolbars.html
diff --git a/docs/source/toolbars.html b/docs/source/toolbars.html
new file mode 100644
index 00000000..c8a37183
--- /dev/null
+++ b/docs/source/toolbars.html
@@ -0,0 +1,354 @@
+
+
+ The source code
+
+
+
+
+
+Ext.onReady(function(){
+
+ var SamplePanel = Ext.extend(Ext.Panel, {
+ width: 500,
+ height:250,
+ style: 'margin-top:15px',
+ bodyStyle: 'padding:10px',
+ renderTo: 'docbody',
+ html: Ext.example.shortBogusMarkup,
+ autoScroll: true
+ });
+
+ new SamplePanel({
+ title: 'Standard',
+ tbar: [{
+ xtype:'splitbutton',
+ text: 'Menu Button',
+ iconCls: 'add16',
+ menu: [{text: 'Menu Button 1'}]
+ },'-',{
+ xtype:'splitbutton',
+ text: 'Cut',
+ iconCls: 'add16',
+ menu: [{text: 'Cut Menu Item'}]
+ },{
+ text: 'Copy',
+ iconCls: 'add16'
+ },{
+ text: 'Paste',
+ iconCls: 'add16',
+ menu: [{text: 'Paste Menu Item'}]
+ },'-',{
+ text: 'Format',
+ iconCls: 'add16'
+ }]
+ });
+
+ new SamplePanel({
+ title: 'Multi columns',
+ tbar: [{
+ xtype: 'buttongroup',
+ title: 'Clipboard',
+ columns: 2,
+ defaults: {
+ scale: 'small'
+ },
+ items: [{
+ xtype:'splitbutton',
+ text: 'Menu Button',
+ iconCls: 'add16',
+ menu: [{text: 'Menu Item 1'}]
+ },{
+ xtype:'splitbutton',
+ text: 'Cut',
+ iconCls: 'add16',
+ menu: [{text: 'Cut Menu Item'}]
+ },{
+ text: 'Copy',
+ iconCls: 'add16'
+ },{
+ text: 'Paste',
+ iconCls: 'add16',
+ menu: [{text: 'Paste Menu Item'}]
+ },{
+ text: 'Format',
+ iconCls: 'add16'
+ }]
+ },{
+ xtype: 'buttongroup',
+ title: 'Other Bugus Actions',
+ columns: 2,
+ defaults: {
+ scale: 'small'
+ },
+ items: [{
+ xtype:'splitbutton',
+ text: 'Menu Button',
+ iconCls: 'add16',
+ menu: [{text: 'Menu Button 1'}]
+ },{
+ xtype:'splitbutton',
+ text: 'Cut',
+ iconCls: 'add16',
+ menu: [{text: 'Cut Menu Item'}]
+ },{
+ text: 'Copy',
+ iconCls: 'add16'
+ },{
+ text: 'Paste',
+ iconCls: 'add16',
+ menu: [{text: 'Paste Menu Item'}]
+ },{
+ text: 'Format',
+ iconCls: 'add16'
+ }]
+ }]
+ });
+
+
+
+ new SamplePanel({
+ title: 'Multi columns (No titles, double stack)',
+ tbar: [{
+ xtype: 'buttongroup',
+ columns: 3,
+ defaults: {
+ scale: 'small'
+ },
+ items: [{
+ xtype:'splitbutton',
+ text: 'Menu Button',
+ iconCls: 'add16',
+ menu: [{text: 'Menu Item 1'}]
+ },{
+ xtype:'splitbutton',
+ text: 'Cut',
+ iconCls: 'add16',
+ menu: [{text: 'Cut Menu Item'}]
+ },{
+ text: 'Copy',
+ iconCls: 'add16'
+ },{
+ text: 'Paste',
+ iconCls: 'add16',
+ menu: [{text: 'Paste Menu Item'}]
+ },{
+ text: 'Format',
+ iconCls: 'add16'
+ }]
+ },{
+ xtype: 'buttongroup',
+ columns: 3,
+ defaults: {
+ scale: 'small'
+ },
+ items: [{
+ xtype:'splitbutton',
+ text: 'Menu Button',
+ iconCls: 'add16',
+ menu: [{text: 'Menu Item 1'}]
+ },{
+ xtype:'splitbutton',
+ text: 'Cut',
+ iconCls: 'add16',
+ menu: [{text: 'Cut Menu Item'}]
+ },{
+ text: 'Copy',
+ iconCls: 'add16'
+ },{
+ text: 'Paste',
+ iconCls: 'add16',
+ menu: [{text: 'Paste Menu Item'}]
+ },{
+ text: 'Format',
+ iconCls: 'add16'
+ }]
+ }]
+ });
+
+ new SamplePanel({
+ title: 'Mix and match icon sizes to create a huge unusable toolbar',
+ tbar: [{
+ xtype: 'buttongroup',
+ columns: 3,
+ title: 'Clipboard',
+ items: [{
+ text: 'Paste',
+ scale: 'large',
+ rowspan: 3, iconCls: 'add',
+ iconAlign: 'top',
+ cls: 'x-btn-as-arrow'
+ },{
+ xtype:'splitbutton',
+ text: 'Menu Button',
+ scale: 'large',
+ rowspan: 3,
+ iconCls: 'add',
+ iconAlign: 'top',
+ arrowAlign:'bottom',
+ menu: [{text: 'Menu Item 1'}]
+ },{
+ xtype:'splitbutton', text: 'Cut', iconCls: 'add16', menu: [{text: 'Cut Menu Item'}]
+ },{
+ text: 'Copy', iconCls: 'add16'
+ },{
+ text: 'Format', iconCls: 'add16'
+ }]
+ },{
+ xtype: 'buttongroup',
+ columns: 3,
+ title: 'Other Actions',
+ items: [{
+ text: 'Paste',
+ scale: 'large',
+ rowspan: 3, iconCls: 'add',
+ iconAlign: 'top',
+ cls: 'x-btn-as-arrow'
+ },{
+ xtype:'splitbutton',
+ text: 'Menu Button',
+ scale: 'large',
+ rowspan: 3,
+ iconCls: 'add',
+ iconAlign: 'top',
+ arrowAlign:'bottom',
+ menu: [{text: 'Menu Button 1'}]
+ },{
+ xtype:'splitbutton', text: 'Cut', iconCls: 'add16', menu: [{text: 'Cut Menu Item'}]
+ },{
+ text: 'Copy', iconCls: 'add16'
+ },{
+ text: 'Format', iconCls: 'add16'
+ }]
+ }]
+ });
+
+ new SamplePanel({
+ title: 'Medium icons, arrows to the bottom',
+ tbar: [{
+ xtype: 'buttongroup',
+ title: 'Clipboard',
+ defaults: {
+ scale: 'medium',
+ iconAlign:'top'
+ },
+ items: [{
+ xtype:'splitbutton',
+ text: 'Menu Button',
+ iconCls: 'add24',
+ arrowAlign:'bottom',
+ menu: [{text: 'Menu Item 1'}]
+ },{
+ xtype:'splitbutton',
+ text: 'Cut',
+ iconCls: 'add24',
+ arrowAlign:'bottom',
+ menu: [{text: 'Cut Menu Item'}]
+ },{
+ text: 'Copy',
+ iconCls: 'add24',
+ cls: 'x-btn-as-arrow'
+ },{
+ text: 'Paste',
+ iconCls: 'add24',
+ arrowAlign:'bottom',
+ menu: [{text: 'Paste Menu Item'}]
+ },{
+ text: 'Format
Stuff',
+ iconCls: 'add24'
+ }]
+ },{
+ xtype: 'buttongroup',
+ title: 'Other Bogus Actions',
+ defaults: {
+ scale: 'medium',
+ iconAlign:'top'
+ },
+ items: [{
+ xtype:'splitbutton',
+ text: 'Menu Button',
+ iconCls: 'add24',
+ arrowAlign:'bottom',
+ menu: [{text: 'Menu Item 1'}]
+ },{
+ xtype:'splitbutton',
+ text: 'Cut',
+ iconCls: 'add24',
+ arrowAlign:'bottom',
+ menu: [{text: 'Cut Menu Item'}]
+ },{
+ text: 'Copy',
+ iconCls: 'add24',
+ cls: 'x-btn-as-arrow'
+ },{
+ text: 'Paste',
+ iconCls: 'add24',
+ arrowAlign:'bottom',
+ menu: [{text: 'Paste Menu Item'}]
+ },{
+ text: 'Format',
+ iconCls: 'add24',
+ cls: 'x-btn-as-arrow'
+ }]
+ }]
+ });
+
+
+ new SamplePanel({
+ title: 'Medium icons, text and arrows to the left',
+ tbar: [{
+ xtype:'buttongroup',
+ items: [{
+ text: 'Cut',
+ iconCls: 'add24',
+ scale: 'medium'
+ },{
+ text: 'Copy',
+ iconCls: 'add24',
+ scale: 'medium'
+ },{
+ text: 'Paste',
+ iconCls: 'add24',
+ scale: 'medium',
+ menu: [{text: 'Paste Menu Item'}]
+ }]
+ }, {
+ xtype:'buttongroup',
+ items: [{
+ text: 'Format',
+ iconCls: 'add24',
+ scale: 'medium'
+ }]
+ }]
+ });
+
+ new SamplePanel({
+ title: 'Small icons, text and arrows to the left',
+ tbar: [{
+ xtype:'buttongroup',
+ items: [{
+ text: 'Cut',
+ iconCls: 'add16',
+ scale: 'small'
+ },{
+ text: 'Copy',
+ iconCls: 'add16',
+ scale: 'small'
+ },{
+ text: 'Paste',
+ iconCls: 'add16',
+ scale: 'small',
+ menu: [{text: 'Paste Menu Item'}]
+ }]
+ }, {
+ xtype:'buttongroup',
+ items: [{
+ text: 'Format',
+ iconCls: 'add16',
+ scale: 'small'
+ }]
+ }]
+ });
+
+});
+
+
\ No newline at end of file