EXT borderLayout图解（初学有用）

    EXT borderLayout图解（初学有用）

 

Ext.onReady(function(){
			var south = new Ext.Panel({
				region : "south",// 布局为south
				margins: '5 5 5 5',	
				collapsible: true,			
				title : "south",
				height : 150,
				frame : true
			});
			
			var north = new Ext.Panel({
				region : "north",// 布局为north
				margins: '5 5 5 5',
				collapsible: true,
				title : "north",
				height : 150,
				frame : true
			});
			
			var west = new Ext.Panel({
				region : "west",// 布局为west
				margins: '0 5 0 5',
				collapsible: true,
				title : "west",
				width : 150,
				frame : true
			});
			
			var east = new Ext.Panel({
				region : "east",// 布局为east
				margins: '0 5 0 5',
				collapsible: true,
				title : "east",
				width : 150,
				frame : true
			});
			
			var center = new Ext.Panel({
				region : "center", //使用borderLayout region : "center"必须要有
				title : "center",
				frame : true
			});
			
			var win = new Ext.Window({
				title : "borderLayout",
				layout : "border", // 定义layout
				width : 650,
				height : 500,
				resizabled : false,
				items : [south,north,east,west,center]
			}).show();
		});