examples/layout/table.js

   1 Ext.onReady(function() {
   2     var panel = Ext.create('Ext.Panel', {
   3         id:'main-panel',
   4         baseCls:'x-plain',
   5         renderTo: Ext.getBody(),
   6         layout: {
   7             type: 'table',
   8             columns: 3
   9         },
  10         // applied to child components
  11         defaults: {frame:true, width:200, height: 200},
  12         items:[{
  13             title:'Item 1'
  14         },{
  15             title:'Item 2'
  16         },{
  17             title:'Item 3'
  18         },{
  19             title:'Item 4',
  20             width:410,
  21             colspan:2
  22         },{
  23             title:'Item 5'
  24         },{
  25             title:'Item 6'
  26         },{
  27             title:'Item 7',
  28             width:410,
  29             colspan:2
  30         },{
  31             title:'Item 8',
  32             rowspan: 2,
  33             height: 410
  34         },{
  35             title:'Item 9'
  36         },{
  37             title:'Item 10'
  38         },{
  39             title:'Item 11',
  40             rowspan: 2,
  41             height: 410
  42         },{
  43             title:'Item 12'
  44         },{
  45             title:'Item 13'
  46         },{
  47             title:'Item 14',
  48             rowspan: 2,
  49             height: 410
  50         },{
  51             title:'Item 15'
  52         },{
  53             title:'Item 16'
  54         },{
  55             title:'Item 17',
  56             rowspan: 2,
  57             height: 410
  58         },{
  59             title:'Item 18',
  60             width:410,
  61             colspan:2
  62         },{
  63             title:'Item 19'
  64         },{
  65             title:'Item 20'
  66         }]
  67     });
  68 });