Extjs学习总结之28viewport

viewport和布局差不多的，看看图就知道了：

viewport.js:

Ext.onReady(function(){Ext.BLANL_IMAGE_URL = "../../resources/image/default/s.gif";//var north = new Ext.Panel({//title:"北方",//region:"north",//height:80//});////var south = new Ext.Panel({//title:"南方",//region:"south",//height:80//});////var center = new Ext.Panel({//title:"中间",//region:"center"//});////var west = new Ext.Panel({//title:"西方",//region:"west",//width:200,//split:true,//collapsible:true  //伸展收缩效果//});////var east = new Ext.Panel({//title:"东方",//region:"east",//width:200,//split:true//});////var vp = new Ext.Viewport({//layout:'border',//items:[north,west,east,center]//});var top = new Ext.Panel({region:'north',title:"标题",height:80,border:true,html:"LOGO",margins:'0 0 5 0'});var left = new Ext.tree.TreePanel({region:'west',collapsible:true,title:"数据结构",width:200,autoScroll:true,split:true//listners:{}});var root = new Ext.tree.TreeNode({text:"根结点"});var child1 = new Ext.tree.TreeNode({text:"子结点1",url:"a.jsp"});var child2 = new Ext.tree.TreeNode({text:"子节点2",url:"b.jsp"});var child3 = new Ext.tree.TreeNode({text:"子节点3",url:"c.jsp"});root.appendChild([child1,child2,child3]);left.setRootNode(root);var center = new Ext.TabPanel({region:'center',items:{id:"opt1",title:"Default Tab",html:"欢迎进入。。。"},enableTabScroll:true});center.setActiveTab("opt1");var bottom = new Ext.Panel({region:'south',title:'Information',collapsible:true,html:'版权所有，翻版必究',split:true,height:100,minHeight:100,bodyStyle:"padding:10px;font-size:12px;text-align:center"});var vp = new Ext.Viewport({layout:'border',items:[top,left,center,bottom]});//展开所有结点left.expandAll();});

效果图：
 
	
				
	
					   
Extjs学习总结之28viewport
	  	   
Extjs 之 viewport
	  	   
Extjs框架viewport总结之最简单的viewport案例图解(入门专用)
	  	   
extjs学习（四）--Viewport及Window
	  	   
Extjs学习总结之感想
	  	   
Extjs 2.2 Viewport实用案例之二
	  	   
HTML5学习笔记之viewport
	  	   
Extjs学习总结之04消息框
	  	   
Extjs学习总结之05动画函数
	  	   
Extjs学习总结之07格式化
	  	   
Extjs学习总结之13面板panel
	  	   
Extjs学习总结之14窗体window
	  	   
Extjs学习总结之16组件component
	  	   
Extjs学习总结之22GridPanel扩展
	  	   
Extjs学习总结之24treePanel
	  	   
ExtJS梦想之旅（五）--Viewport的使用
	  	   
ExtJS ViewPort的使用
	  	   
Sencha touch 2.1学习之Viewport
	     		  
	  	   
如何解决软键盘弹出引起的各种不适
	  	   
ASIHTTPRequest 详解
	  	   
Git和Github
	  	   
窗口创建和关系
	  	   
java函数参数默认值
	  	   
Extjs学习总结之28viewport
	  	   
错误分析
	  	   
内存映射文件
	  	   
uva 10161 Ant on a Chessboard
	  	   
Extjs学习总结之感想
	  	   
正则表达式验证输入框是否为数字
	  	   
iCabMobile更新后，Installous的Downloads不能用的解决方法
	  	   
自定义ListView FastScroller滑块图片
	  	   
Linux下3G的应用