ExtJS 2.0实用简明教程 之Border区域布局
更新时间：2009年04月29日 13:27:33 作者：
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:"右边面板"}
]
});
});
执行上面的代码将会在页面中输出包含上下左右中五个区域的面板，如下图所示：
复制代码 代码如下:
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:"右边面板"}
]
});
});
执行上面的代码将会在页面中输出包含上下左右中五个区域的面板，如下图所示：
相关文章
EXTJS记事本 当CompositeField遇上RowEditor
用RowEditor作批量编辑器时，遇到一个问题，想要在Roweditor中使用三个下拉列表组成级联式选择控件2011-07-07
拖拽效果想必大家都有见到过吧，实现方式大同小异，在接下来的文章中为大家详细介绍下使用ExtJS是如何做到的2013-12-12
如何用的hibernate的自动注解，并且里面有一对多，多对一的关系，这是需要在不需要的字段上加上注解@JsonIgnore2013-12-12
ExtJS是一个Ajax框架，是一个用javascript写的，用于在客户端创建丰富多彩的web应用程序界面。ExtJS可以用来开发RIA也即富客户端的AJAX应用2008-12-12
Extjs中ComboBoxTree实现的下拉框树效果(自写)
最近涉及到的一个项目中，需要实现ComboBoxTree的效果，由于在Extjs中是没有这种效果，所以看看别人的资料自己写了一个，感兴趣的朋友可以参考下哈2013-05-05
在解决这个有很多优化方法，今天来说其中一种，那就是在Ant脚本打包的时候，把js中空格、注释去掉、以及合并，合并今天不说了，还未实现这个，在研究中2013-04-04
Extjs中DisplayField的日期或者数字格式化扩展
在用Extjs的时候，有时需要对 Ext.form.DisplyField 进行格式化。2010-09-09
动态加载grid在ExtJs中如何实现，貌似有很多的朋友都不知道吧，下面有个不错的示例，希望对大家有所帮助2013-09-09
今天做一个grid，里面的数据需要带明细，思来想去还是搞个表格嵌套吧,需要的朋友可以参考下2014-05-05
本文就将演示下一个实例使用该代码只需要13行代码 原始需要25-30行代码搞定，感兴趣的朋友可以参考下哈，希望可以帮助到你2013-04-04
最新评论