日期:2014-05-16  浏览次数:20349 次

extjs简易viewport左右结构的使用

Ext.ux.ArchiveViewport = Ext.extend(Ext.Panel, {
??? layout : 'border',
??? getWestPanel : function() {
??? ??? this.westPanel = new Ext.Panel({
??? ??? ??? ??? ??? html : '重写getWestPanel'
??? ??? ??? ??? });
??? ??? return this.westPanel;
??? },
??? getCenterPanel : function() {
??? ??? this.centerPanel = new Ext.Panel({
??? ??? ??? ??? ??? html : '重写getCenterPanel'
??? ??? ??? ??? });
??? ??? return this.centerPanel;
??? },
??? westWidth :200,
??? westMinSize :200,
??? westMaxSize :200,
??? westConfig : function() {
??? ??? return this.treeConfig = {
??? ??? ??? region : 'west',
??? ??? ??? split : false,
??? ??? ??? width : this.westWidth,
??? ??? ??? border : true,
??? ??? ??? minSize : this.westMinSize,
??? ??? ??? maxSize : this.westMaxSize,
??? ??? ??? autoScroll : false,
??? ??? ??? layout : 'fit',
??? ??? ??? bodyStyle : 'border-bottom:0px;border-left:0px;border-top:0px;',
??? ??? ??? items : [this.getWestPanel()]
??? ??? }
??? },
??? centerConfig : function() {
??? ??? return this.gridConfig = {
??? ??? ??? region : 'center',
??? ??? ??? border : false,
??? ??? ??? layout : 'fit',
??? ??? ??? autoScroll : false,
??? ??? ??? items : [this.getCenterPanel()]
??? ??? }
??? },
??? border : false,
??? constructor : function(config) {
??? ??? config=config||{};
??? ??? Ext.apply(this,config);
??? ??? this.items = [this.westConfig(), this.centerConfig()]
??? ??? Ext.ux.ArchiveViewport.superclass.constructor.call(this);
??? }
})