Category

Development Platform
Home > SourceCode/Document > Java Develop > JavaScript > View Code
toolbars.js
Package: ext-3.1.0.zip　[view]
Upload User: dawnssy
Upload Date: 2022-08-06
Package Size: 9345k
Code Size: 10k
Category:

JavaScript

Development Platform:

JavaScript

toolbars.js：Code Content
  1. /*!
  2.  * Ext JS Library 3.1.0
  3.  * Copyright(c) 2006-2009 Ext JS, LLC
  4.  * licensing@extjs.com
  5.  * http://www.extjs.com/license
  6.  */
  8. Ext.onReady(function(){
  9.    
  10.     var SamplePanel = Ext.extend(Ext.Panel, {
  11.         width: 500,
  12.         height:250,
  13.         style: 'margin-top:15px',
  14.         bodyStyle: 'padding:10px',
  15.         renderTo: 'docbody',
  16.         html: Ext.example.shortBogusMarkup,
  17.         autoScroll: true
  18.     });
  20.     new SamplePanel({
  21.         title: 'Standard',
  22.         tbar: [{
  23.             xtype:'splitbutton',
  24.             text: 'Menu Button',
  25.             iconCls: 'add16',
  26.             menu: [{text: 'Menu Button 1'}]
  27.         },'-',{
  28.             xtype:'splitbutton',
  29.             text: 'Cut',
  30.             iconCls: 'add16',
  31.             menu: [{text: 'Cut Menu Item'}]
  32.         },{
  33.             text: 'Copy',
  34.             iconCls: 'add16'
  35.         },{
  36.             text: 'Paste',
  37.             iconCls: 'add16',
  38.             menu: [{text: 'Paste Menu Item'}]
  39.         },'-',{
  40.             text: 'Format',
  41.             iconCls: 'add16'
  42.         }]
  43.     });
  45.     new SamplePanel({
  46.         title: 'Multi columns',
  47.         tbar: [{
  48.             xtype: 'buttongroup',
  49.             title: 'Clipboard',
  50.             columns: 2,
  51.             defaults: {
  52.                 scale: 'small'
  53.             },
  54.             items: [{
  55.                 xtype:'splitbutton',
  56.                 text: 'Menu Button',
  57.                 iconCls: 'add16',
  58.                 menu: [{text: 'Menu Item 1'}]
  59.             },{
  60.                 xtype:'splitbutton',
  61.                 text: 'Cut',
  62.                 iconCls: 'add16',
  63.                 menu: [{text: 'Cut Menu Item'}]
  64.             },{
  65.                 text: 'Copy',
  66.                 iconCls: 'add16'
  67.             },{
  68.                 text: 'Paste',
  69.                 iconCls: 'add16',
  70.                 menu: [{text: 'Paste Menu Item'}]
  71.             },{
  72.                 text: 'Format',
  73.                 iconCls: 'add16'
  74.             }]
  75.         },{
  76.             xtype: 'buttongroup',
  77.             title: 'Other Bugus Actions',
  78.             columns: 2,
  79.             defaults: {
  80.                 scale: 'small'
  81.             },
  82.             items: [{
  83.                 xtype:'splitbutton',
  84.                 text: 'Menu Button',
  85.                 iconCls: 'add16',
  86.                 menu: [{text: 'Menu Button 1'}]
  87.             },{
  88.                 xtype:'splitbutton',
  89.                 text: 'Cut',
  90.                 iconCls: 'add16',
  91.                 menu: [{text: 'Cut Menu Item'}]
  92.             },{
  93.                 text: 'Copy',
  94.                 iconCls: 'add16'
  95.             },{
  96.                 text: 'Paste',
  97.                 iconCls: 'add16',
  98.                 menu: [{text: 'Paste Menu Item'}]
  99.             },{
  100.                 text: 'Format',
  101.                 iconCls: 'add16'
  102.             }]
  103.         }]
  104.     });
  108.     new SamplePanel({
  109.         title: 'Multi columns (No titles, double stack)',
  110.         tbar: [{
  111.             xtype: 'buttongroup',
  112.             columns: 3,
  113.             defaults: {
  114.                 scale: 'small'
  115.             },
  116.             items: [{
  117.                 xtype:'splitbutton',
  118.                 text: 'Menu Button',
  119.                 iconCls: 'add16',
  120.                 menu: [{text: 'Menu Item 1'}]
  121.             },{
  122.                 xtype:'splitbutton',
  123.                 text: 'Cut',
  124.                 iconCls: 'add16',
  125.                 menu: [{text: 'Cut Menu Item'}]
  126.             },{
  127.                 text: 'Copy',
  128.                 iconCls: 'add16'
  129.             },{
  130.                 text: 'Paste',
  131.                 iconCls: 'add16',
  132.                 menu: [{text: 'Paste Menu Item'}]
  133.             },{
  134.                 text: 'Format',
  135.                 iconCls: 'add16'
  136.             }]
  137.         },{
  138.             xtype: 'buttongroup',
  139.             columns: 3,
  140.             defaults: {
  141.                 scale: 'small'
  142.             },
  143.             items: [{
  144.                 xtype:'splitbutton',
  145.                 text: 'Menu Button',
  146.                 iconCls: 'add16',
  147.                 menu: [{text: 'Menu Item 1'}]
  148.             },{
  149.                 xtype:'splitbutton',
  150.                 text: 'Cut',
  151.                 iconCls: 'add16',
  152.                 menu: [{text: 'Cut Menu Item'}]
  153.             },{
  154.                 text: 'Copy',
  155.                 iconCls: 'add16'
  156.             },{
  157.                 text: 'Paste',
  158.                 iconCls: 'add16',
  159.                 menu: [{text: 'Paste Menu Item'}]
  160.             },{
  161.                 text: 'Format',
  162.                 iconCls: 'add16'
  163.             }]
  164.         }]
  165.     });
  167.     new SamplePanel({
  168.         title: 'Mix and match icon sizes to create a huge unusable toolbar',
  169.         tbar: [{
  170.             xtype: 'buttongroup',
  171.             columns: 3,
  172.             title: 'Clipboard',
  173.             items: [{
  174.                 text: 'Paste',
  175.                 scale: 'large',
  176.                 rowspan: 3, iconCls: 'add',
  177.                 iconAlign: 'top',
  178.                 cls: 'x-btn-as-arrow'
  179.             },{
  180.                 xtype:'splitbutton',
  181.                 text: 'Menu Button',
  182.                 scale: 'large',
  183.                 rowspan: 3,
  184.                 iconCls: 'add',
  185.                 iconAlign: 'top',
  186.                 arrowAlign:'bottom',
  187.                 menu: [{text: 'Menu Item 1'}]
  188.             },{
  189.                 xtype:'splitbutton', text: 'Cut', iconCls: 'add16', menu: [{text: 'Cut Menu Item'}]
  190.             },{
  191.                 text: 'Copy', iconCls: 'add16'
  192.             },{
  193.                 text: 'Format', iconCls: 'add16'
  194.             }]
  195.         },{
  196.             xtype: 'buttongroup',
  197.             columns: 3,
  198.             title: 'Other Actions',
  199.             items: [{
  200.                 text: 'Paste',
  201.                 scale: 'large',
  202.                 rowspan: 3, iconCls: 'add',
  203.                 iconAlign: 'top',
  204.                 cls: 'x-btn-as-arrow'
  205.             },{
  206.                 xtype:'splitbutton',
  207.                 text: 'Menu Button',
  208.                 scale: 'large',
  209.                 rowspan: 3,
  210.                 iconCls: 'add',
  211.                 iconAlign: 'top',
  212.                 arrowAlign:'bottom',
  213.                 menu: [{text: 'Menu Button 1'}]
  214.             },{
  215.                 xtype:'splitbutton', text: 'Cut', iconCls: 'add16', menu: [{text: 'Cut Menu Item'}]
  216.             },{
  217.                 text: 'Copy', iconCls: 'add16'
  218.             },{
  219.                 text: 'Format', iconCls: 'add16'
  220.             }]
  221.         }]
  222.     });
  224.     new SamplePanel({
  225.         title: 'Medium icons, arrows to the bottom',
  226.         tbar: [{
  227.             xtype: 'buttongroup',
  228.             title: 'Clipboard',
  229.             defaults: {
  230.                 scale: 'medium',
  231.                 iconAlign:'top'
  232.             },
  233.             items: [{
  234.                 xtype:'splitbutton',
  235.                 text: 'Menu Button',
  236.                 iconCls: 'add24',
  237.                 arrowAlign:'bottom',
  238.                 menu: [{text: 'Menu Item 1'}]
  239.             },{
  240.                 xtype:'splitbutton',
  241.                 text: 'Cut',
  242.                 iconCls: 'add24',
  243.                 arrowAlign:'bottom',
  244.                 menu: [{text: 'Cut Menu Item'}]
  245.             },{
  246.                 text: 'Copy',
  247.                 iconCls: 'add24',
  248.                 cls: 'x-btn-as-arrow'
  249.             },{
  250.                 text: 'Paste',
  251.                 iconCls: 'add24',
  252.                 arrowAlign:'bottom',
  253.                 menu: [{text: 'Paste Menu Item'}]
  254.             },{
  255.                 text: 'Format<br/>Stuff',
  256.                 iconCls: 'add24'
  257.             }]
  258.         },{
  259.             xtype: 'buttongroup',
  260.             title: 'Other Bogus Actions',
  261.             defaults: {
  262.                 scale: 'medium',
  263.                 iconAlign:'top'
  264.             },
  265.             items: [{
  266.                 xtype:'splitbutton',
  267.                 text: 'Menu Button',
  268.                 iconCls: 'add24',
  269.                 arrowAlign:'bottom',
  270.                 menu: [{text: 'Menu Item 1'}]
  271.             },{
  272.                 xtype:'splitbutton',
  273.                 text: 'Cut',
  274.                 iconCls: 'add24',
  275.                 arrowAlign:'bottom',
  276.                 menu: [{text: 'Cut Menu Item'}]
  277.             },{
  278.                 text: 'Copy',
  279.                 iconCls: 'add24',
  280.                 cls: 'x-btn-as-arrow'
  281.             },{
  282.                 text: 'Paste',
  283.                 iconCls: 'add24',
  284.                 arrowAlign:'bottom',
  285.                 menu: [{text: 'Paste Menu Item'}]
  286.             },{
  287.                 text: 'Format',
  288.                 iconCls: 'add24',
  289.                 cls: 'x-btn-as-arrow'
  290.             }]
  291.         }]
  292.     });
  295.     new SamplePanel({
  296.         title: 'Medium icons, text and arrows to the left',
  297.         tbar: [{
  298.             xtype:'buttongroup',
  299.             items: [{
  300.                 text: 'Cut',
  301.                 iconCls: 'add24',
  302.                 scale: 'medium'
  303.             },{
  304.                 text: 'Copy',
  305.                 iconCls: 'add24',
  306.                 scale: 'medium'
  307.             },{
  308.                 text: 'Paste',
  309.                 iconCls: 'add24',
  310.                 scale: 'medium',
  311.                 menu: [{text: 'Paste Menu Item'}]
  312.             }]
  313.         }, {
  314.             xtype:'buttongroup',
  315.             items: [{
  316.                 text: 'Format',
  317.                 iconCls: 'add24',
  318.                 scale: 'medium'
  319.             }]
  320.         }]
  321.     });
  323.     new SamplePanel({
  324.         title: 'Small icons, text and arrows to the left',
  325.         tbar: [{
  326.             xtype:'buttongroup',
  327.             items: [{
  328.                 text: 'Cut',
  329.                 iconCls: 'add16',
  330.                 scale: 'small'
  331.             },{
  332.                 text: 'Copy',
  333.                 iconCls: 'add16',
  334.                 scale: 'small'
  335.             },{
  336.                 text: 'Paste',
  337.                 iconCls: 'add16',
  338.                 scale: 'small',
  339.                 menu: [{text: 'Paste Menu Item'}]
  340.             }]
  341.         }, {
  342.             xtype:'buttongroup',
  343.             items: [{
  344.                 text: 'Format',
  345.                 iconCls: 'add16',
  346.                 scale: 'small'
  347.             }]
  348.         }]
  349.     });
  351. });