学习ExtJS border布局
程序员文章站
2022-06-17 16:13:35
一、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怎么通过图层名称搜索图层?
下一篇: 学习ExtJS Panel常用方法
推荐阅读
-
Flutter学习笔记(22)--单个子元素的布局Widget
-
Flutter学习之构建、布局及绘制三部曲
-
BootStrap学习系列之布局组件(下拉,按钮组[toolbar],上拉)
-
Android布局管理器-从实例入手学习相对布局管理器的使用
-
Flutter学习笔记(23)--多个子元素的布局Widget(Rwo、Column、Stack、IndexedStack、Table、Wrap)
-
Android学习笔记之——UI组件/RelativeLayout(相对布局)
-
Bootstrap布局之栅格系统学习笔记
-
Java开发桌面程序学习(二)————fxml布局与控件学习
-
flex 布局学习
-
三、WPF入门教程——布局和常用Panel学习