0
我有3個extJs窗口。每個都有一些表單控件，然後有兩個顯示圖表的選項卡。目前所有窗口都出現在同一個地方，我必須拖動它們才能使它們像這樣連續排列| | | 。我如何在屏幕上創建3列，並將每個窗口放在其中一個窗口中。請找到下面一個窗口的代碼。是的，我已經看到這個鏈接 http://dev.sencha.com/deploy/ext-4.0.7-gpl/examples/layout/table.html但它不幫助我的事業。如果我創建3個列布局，如鏈接中提到的內容，則不會顯示任何內容。請假定所有的窗口都有相同的代碼並提供一種方法。還有一件事，我可以關閉，並在所有的窗口最大化功能。謝謝。extJs列布局問題
var win = Ext.create('Ext.Window', {
id: 'r1',
width: eachWindowWidth,
height: eachWindowHeight,
hidden: false,
maximizable: true,
title: 'Registered Hosts',
renderTo: Ext.getBody(),
tbar: [{
xtype: 'combo',
width: 50,
store: optionRegistered,
mode: 'local',
fieldLabel: '',
name: 'answer',
anchor: '90%',
displayField: 'answer',
valueField: 'id'
}, {
xtype: 'datefield',
width: 90,
name: 'time',
fieldLabel: '',
anchor: '90%'
}, {
xtype: "label",
width: 20,
fieldLabel: text,
name: 'txt',
text: 'to'
}, {
xtype: 'combo',
id: 'c22devices',
width: 50,
store: optionRegistered,
mode: 'local',
fieldLabel: '',
name: 'answer',
anchor: '90%',
displayField: 'answer',
valueField: 'id'
}, {
xtype: 'datefield',
id: 'cl22devices',
width: 90,
name: 'time',
fieldLabel: '',
anchor: '90%'
}, {
xtype: 'button',
text: 'Ok'
}],
items: [
{
xtype: "label",
fieldLabel: text,
name: 'txt',
text: text
}, {
xtype: 'tabpanel',
id: "tabs1",
activeTab: 0,
width: eachTabWidth,
height: eachTabHeight,
plain: true,
defaults: {
autoScroll: true,
bodyPadding: 10
},
items: [{
title: 'Normal Tab',
items: [{
id: 'chartCmp1',
xtype: 'chart',
height: 300,
width: 300,
style: 'background:#fff',
animate: true,
shadow: true,
store: storeRouge,
axes: [{
type: 'Numeric',
position: 'left',
fields: ['total'],
label: {
renderer: Ext.util.Format.numberRenderer('0,0')
},
grid: true,
minimum: 0
}, {
type: 'Category',
position: 'bottom',
grid: true,
fields: ['date'],
}],
series: [{
type: 'column',
axis: 'left',
highlight: true,
tips: {
trackMouse: true,
width: 140,
height: 28,
renderer: function (storeItem, item) {
this.setTitle(storeItem.get('date') + ': ' + storeItem.get('total') + ' $');
}
},
label: {
display: 'insideEnd',
'text-anchor': 'middle',
field: 'total',
renderer: Ext.util.Format.numberRenderer('0'),
orientation: 'vertical',
color: '#333'
},
xField: 'date',
yField: 'total'
}]
}]
}, {
title: 'Table View',
xtype: 'grid',
id: "gridChart1",
width: 200,
height: 200,
collapsible: false,
store: storeRouge,
multiSelect: true,
viewConfig: {
emptyText: 'No information to display'
},
columns: [{
text: 'Devices',
flex: 50,
dataIndex: 'date'
}, {
text: 'Pass',
flex: 50,
dataIndex: 'total'
}]
}]
}],
listeners: {
resize: function() {
Ext.getCmp("tabs1").setWidth(this.width);
Ext.getCmp("tabs1").setHeight(this.height);
Ext.getCmp("chartCmp1").setWidth(this.width * 100/100);
Ext.getCmp("gridChart1").setWidth(this.width * 100/100);
Ext.getCmp("gridChart1").setWidth(this.width * 100/100);
Ext.getCmp("gridChart1").setWidth(this.width * 100/100);
}
}
});
你如何結合你的窗戶？你把它們放進某種容器嗎？ – sha 2012-03-20 14:10:43
我試圖這樣做http://dev.sencha.com/deploy/ext-4.0.7-gpl/examples/layout/table.html – dev 2012-03-20 15:48:08
但是該示例佈局面板不是windows。你正在嘗試佈置窗口。這就是爲什麼我問你把窗戶放在哪裏？我不認爲你可以使用窗口而不是面板。 – sha 2012-03-20 15:50:08