src/examples/kitchensink/app/view/Buttons.js

   1 /**
   2  * Demonstrates a range of Button options the framework offers out of the box
   3  */
   4 Ext.define('Kitchensink.view.Buttons', {
   5     extend: 'Ext.Container',
   6
   7     requires: 'Ext.layout.VBox',
   8
   9     config: {
  10         layout: {
  11             type : 'vbox',
  12             pack : 'center',
  13             align: 'stretch'
  14         },
  15         defaults: {
  16             xtype: 'container',
  17             flex : 1,
  18             layout: {
  19                 type : 'hbox',
  20                 align: 'middle'
  21             },
  22             defaults: {
  23                 xtype : 'button',
  24                 flex  : 1,
  25                 margin: 10
  26             }
  27         },
  28         items: [
  29             {
  30                 items: [
  31                     {text: 'Normal'},
  32                     {ui: 'round', text: 'Round'},
  33                     {ui: 'small', text: 'Small'}
  34                 ]
  35             },
  36             {
  37                 items: [
  38                     {ui: 'decline', text: 'Decline'},
  39                     {ui: 'decline-round', text: 'Round'},
  40                     {ui: 'decline-small', text: 'Small'}
  41                 ]
  42             },
  43             {
  44                 items: Ext.os.deviceType.toLowerCase() == "phone" ? [
  45                     {ui: 'confirm', text: 'Confirm'},
  46                     {ui: 'confirm-round', text: 'Round'},
  47                     {ui: 'confirm-small', text: 'Small'}
  48                 ] : [
  49                     {ui: 'confirm', text: 'Confirm'},
  50                     {ui: 'confirm-round', text: 'Round'},
  51                     {ui: 'confirm-small', text: 'Small'},
  52                     {ui: 'back', text: 'Back'}
  53                 ]
  54             }
  55         ]
  56     }
  57 });