У меня есть требование, где мне нужно поместить один элемент внутри vbox макета.у моего элемента макет границы и west и center причина, по которой есть некоторый vbox компонент компоновки.ниже я ставлю код товара.На этой главной панели находится макет границы и причина, имеющая vbox, но это не работает.
мой код:
Ext.create('Ext.panel.Panel', {
width: 500,
height: 500,
title: 'Border Layout',
layout: 'border',
items: [{
title: 'South Region is resizable',
region: 'south', // position for region
xtype: 'panel',
height: 100,
layout : 'fit',
split: true,// enable resizing
margin: '0 5 5 5'
},{
// xtype: 'panel' implied by default
title: 'West Region is collapsible',
region:'west',
xtype: 'panel',
margin: '5 0 0 5',
width: 100,
layout: 'vbox',
height: 200,
items:[{
title: 'South Region is resizable',
xtype: 'panel',
height: 100
},{
title: 'ss Region is resizable2',
xtype: 'panel',
height: 100
}],
collapsible: true, // make collapsible
id: 'west-region-container',
},{
title: 'Center Region',
region: 'center', // center region is required, no width/height specified
xtype: 'panel',
width : 300,
layout: 'vbox',
margin: '5 5 0 0',
items:[{
title: 'South Region is resizable',
xtype: 'panel',
height: 50,
},
{
title: 'ss Region is resizable',
xtype: 'panel',
height: 10
}]
}],
renderTo: Ext.getBody()
});
Ниже приведен мой фактический код, где я использую vbox Layoutа затем border макет является одним из элементов этого.Я получаю ошибку запуска макета
Ext.define('myApp.myData.myApp', {
extend: 'Ext.container.Container',
alias: 'widget.myApp',
controller: 'myAppController',
items: [{
xtype: 'label',
margin: '5 10 0 0',
height: 28
},
{
xtype: 'panel',
itemId: 'mainPanel',
layout: {
type: 'vbox',
align: 'stretch'
},
defaults: {
margin: '3 10 2 5'
},
items: [
{
xtype: 'myPanel'
},{
xtype : 'panel',
height: 500,
width : 300,
layout: 'border',
items :[{
xtype : 'panel',
layout: {
type: 'vbox',
align: "stretch"
},
items :[{
xtype: 'myPanel1'
},{
xtype : 'myPanel2'
}]
},{
xtype : 'panel',
layout: {
type: "vbox",
align: "stretch"
},
items :[{
xtype: 'myGrid'
}]
}]
}
]
}]
});
Любая помощь будет дорогой.