Extjs4布局详解(三)——accordion布局

accordion布局：accordion布局也称手风琴布局，在accordion布局下，在任何时间里，只有一个面板处于激活状态。其中每个面边都支持展开和折叠。注意：只有Ext.Panels 和所有Ext.panel.Panel 子项，才可以使用accordion布局。

示例代码：

 

Ext.create('Ext.panel.Panel', {
		title: 'Accordion Layout',    
		width: 300,     
		height: 300,
		x:20,
		y:20,
		layout:'accordion',    
		defaults: {
			bodyStyle: 'padding:15px'
		},
		layoutConfig: {       
			titleCollapse: false,        
			animate: true,        
			activeOnTop: true     
		},    
		items: [{        
			title: 'Panel 1',        
			html: 'Panel content!'     
		},{        
			title: 'Panel 2',        
			html: 'Panel content!'    
		},{
			title: 'Panel 3',        
			html: 'Panel content!'    
		}],     
		renderTo: Ext.getBody()
	});

示例截图