首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > JavaScript >

《ExtJS2.0适用简明教程》之Border区域布局

2012-11-22 
《ExtJS2.0实用简明教程》之Border区域布局Border布局由类Ext.layout.BorderLayout定义,布局名称为border。该

《ExtJS2.0实用简明教程》之Border区域布局

Border布局由类Ext.layout.BorderLayout定义,布局名称为border。该布局把容器分成东南西北中五个区域,分别由east,south, west,north, cente来表示,在往容器中添加子元素的时候,我们只需要指定这些子元素所在的位置,Border布局会自动把子元素放到布局指定的位置。看下面的代码:

Ext.onReady(function(){?new Ext.Viewport({layout:"border",items:[{region:"north",height:50,title:"顶部面板"},{region:"south",height:50,title:"底部面板"},{region:"center",title:"中央面板"},{region:"west",width:100,title:"左边面板"},{region:"east",width:100,title:"右边面板"}]}); });

??? 执行上面的代码将会在页面中输出包含上下左右中五个区域的面板,如下图所示:

《ExtJS2.0适用简明教程》之Border区域布局

热点排行