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

   1 /**
   2  * Demonstrates a very simple tab panel with 3 tabs
   3  */
   4 Ext.define('Kitchensink.view.Tabs', {
   5     extend: 'Ext.tab.Panel',
   6
   7     config: {
   8         ui: 'dark',
   9         tabBar: {
  10             ui: 'dark',
  11             layout: {
  12                 pack: Ext.filterPlatform('ie10') ? 'start' : 'center'
  13             }
  14         },
  15         activeTab: 1,
  16         defaults: {
  17             scrollable: true
  18         },
  19         items: [
  20             {
  21                 title: 'Tab 1',
  22                 html : 'By default, tabs are aligned to the top of a view.',
  23                 cls: 'card dark',
  24                 iconCls: Ext.theme.is.Blackberry || Ext.theme.is.Blackberry103 || Ext.theme.is.CupertinoClassic || Ext.theme.is.Tizen ? 'home' : null
  25             },
  26             {
  27                 title: 'Tab 2',
  28                 html : 'A TabPanel can use different animations by setting <code>layout.animation.</code>',
  29                 cls  : 'card',
  30                 iconCls: Ext.theme.is.Blackberry || Ext.theme.is.Blackberry103 || Ext.theme.is.CupertinoClassic|| Ext.theme.is.Tizen ? 'organize' : null
  31             },
  32             {
  33                 title: 'Tab 3',
  34                 html : '<span class="action">User tapped Tab 3</span>',
  35                 cls  : 'card dark',
  36                 iconCls: Ext.theme.is.Blackberry || Ext.theme.is.Blackberry103 || Ext.theme.is.CupertinoClassic || Ext.theme.is.Tizen ? 'favorites' : null
  37             }
  38         ]
  39     }
  40 });