Extjs 2.2 Viewport实用案例之二

最新推荐文章于 2019-07-11 03:09:02 发布

NeroJings

最新推荐文章于 2019-07-11 03:09:02 发布

阅读量2k

点赞数

分类专栏： ExtJS

本文链接：https://blog.csdn.net/zhang6622056/article/details/8137468

版权

ExtJS 专栏收录该内容

24 篇文章 0 订阅

订阅专栏

刚刚完工一个Extjs项目在此将其Viewport代码总结一下。以备不时之需:

效果截图:

代码如下:

var indexview = new Ext.Viewport({
					layout: 'border',
					hideBorders : true,
					items:[{
						border : false,
						region:"north",
						height:100,
						frame : true,
						items : [{
							frame : true,
							layout : 'column',
							items : [{
								bodyStyle : 'padding:0px;border:1px',
								columnWidth : .2,
								html : '<img src="images/smshhis/logo.jpg">'
							},{
								bodyStyle : 'padding:0px;border:1px',
								columnWidth : .8,
								html : quitbtn+quickstr+curloginer
							}]
						}]
					},
					{
						title:"菜单",
						region:"west",
						width:200,
						collapsible : true,
						collapsed:false, //是否自动折叠
						layout:'fit',
						split : true,
						margins : '0 0 0 5',
						items : [{
								layout:'accordion',
								layoutConfig:{animate:true},
								items : alltree
							}]
					},{
							border: false,
							id : "centertab",
							region:"center",
							split : true,
							collapsible : true,
							layout : 'fit',
							items: centertabs = new Ext.TabPanel({
									plugins: new Ext.ux.TabCloseMenu(),
									//id : 'centertab',
									deferredRender : false,
									animScroll : true,
									autoTabs : true,
									enableTabScroll : true,
									autoDestroy : true,
									border : false,
									bodyStyle : 'border:0px;',
									layoutOnTabChange : true,
									activeTab : 0,
									items : [{title : '系统信息',
											 frame : true,
											 closable:false,
											 autoScroll : true,
											 border : false,
											 iconCls : 'nav3',
											 bodyStyle : 'border:0px;'
											 }]
							})
					},
					{
						id : 'downpanel',
						border:false,
						region:"south",
						height:50,
						title:"通知",
						collapsible:true,
						html : '<marquee width=100% οnmοuseοver="this.stop()"  οnmοuseοut="this.start()" id="notice">'+paoma+'</marquee>'
					}]
				});