学习ExtJS border布局
程序员文章站
2022-03-07 11:07:00
一、border布局由类ext.layout.borderlayout定义,布局名称为border。该布局把容器分成东南西北中五个区域,分别由east,south, wes...
一、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:"右边面板"}
]
});
});
上一篇: ps怎么做人物投影?ps给芭蕾舞女孩添加逼真的倒影效果教程
下一篇: Extjs学习笔记之七 布局
推荐阅读
-
asp.net基础学习之前端页面布局
-
Bootstrap布局之栅格系统学习笔记
-
asp.net基础学习之前端页面布局
-
Flutter学习笔记(22)--单个子元素的布局Widget
-
Flutter学习之构建、布局及绘制三部曲
-
BootStrap学习系列之布局组件(下拉,按钮组[toolbar],上拉)
-
Android布局管理器-从实例入手学习相对布局管理器的使用
-
Flutter学习笔记(23)--多个子元素的布局Widget(Rwo、Column、Stack、IndexedStack、Table、Wrap)
-
Android学习笔记之——UI组件/RelativeLayout(相对布局)
-
Bootstrap布局之栅格系统学习笔记