ext table layout

 

Ext.onReady(function(){

var addPanel=new Ext.Panel({

        title:"容器组件",

        width:500,

        height:200,

        layout:"table",

        layoutConfig: {

        columns: 3

        },

        items:[{title:"子元素1",html:"这是子元素1中的内容",rowspan:2,height:100},

        {title:"子元素2",html:"这是子元素2中的内容",colspan:2},

        {title:"子元素3",html:"这是子元素3中的内容"},

        {title:"子元素4",html:"这是子元素4中的内容"}

        ]

    });

var win_open = new Ext.Window( {

id:"win_open",

layout : 'fit',

width : 500,

height : 300,

constrain : true,

closeAction : 'hide',

draggable : true,

resizable : false,

modal : true,

plain : true,

items : [

addPanel

]

});

new Ext.Viewport({

   layout: 'border',

   items: [{

    xtype:'button',

    text:'新增',

    handler: function(){

    win_open.show();

   }

   }]

});

})