学习ExtJS table布局_extjs
程序员文章站
2024-01-11 12:11:16
...
一、Table布局由类Ext.layout.TableLayout定义,类以于html中的table,可以对行或列进行合并。
layoutConfig使用columns指定父容器分成3列,
rowspan合并行数目。
colspan合并列数目。
二、应用举例
Ext.onReady(function(){
var _panel = new Ext.Panel({
title:"人员信息",
renderTo:Ext.getBody(),
width:500,
height:200,
layout:"table",
layoutConfig: {
columns: 3
},
items:[{title:"子元素1",html:"这是子元素1中的内容",rowspan:2,height:100},
{title:"子元素2",html:"这是子元素2中的内容",colspan:2},
{title:"子元素3",html:"这是子元素3中的内容"},
{title:"子元素4",html:"这是子元素4中的内容"}
]
}
);
layoutConfig使用columns指定父容器分成3列,
rowspan合并行数目。
colspan合并列数目。
二、应用举例
复制代码 代码如下:
Ext.onReady(function(){
var _panel = new Ext.Panel({
title:"人员信息",
renderTo:Ext.getBody(),
width:500,
height:200,
layout:"table",
layoutConfig: {
columns: 3
},
items:[{title:"子元素1",html:"这是子元素1中的内容",rowspan:2,height:100},
{title:"子元素2",html:"这是子元素2中的内容",colspan:2},
{title:"子元素3",html:"这是子元素3中的内容"},
{title:"子元素4",html:"这是子元素4中的内容"}
]
}
);
推荐阅读
-
学习ExtJS table布局_extjs
-
ExtJS 4 复杂 百叶窗(accordion)布局
-
ExtJS 4 复杂 百叶窗(accordion)布局
-
学习ExtJS TextField常用方法_extjs
-
学习ExtJS accordion布局_extjs
-
ExtJS 2.0实用简明教程 之Border区域布局_extjs
-
学习ExtJS(二) Button常用方法
-
Extjs学习笔记之七 布局_extjs
-
Flutter学习笔记(23)--多个子元素的布局Widget(Rwo、Column、Stack、IndexedStack、Table、Wrap)
-
[ExtJS5学习笔记]第二十九节 sencha ext js 5.1.0中动态更换皮肤主题