TabPanel中元素的对齐方式

Question

我应该如何操作TabPanel中的元素？

例如，在第一个标签上，我有两个项目 - 这些是图表。但是第二项在第一项（线图）的底部对齐。如何将右侧的第二项（折线图）与左侧的第一项对齐？

这是ff代码

Ext.define('UM.view.main.umcontent',{
    extend: 'Ext.tab.Panel',
    xtype: 'umcontent',

    height: 400,
    width: 2000,
    tabPosition: 'left',

    tabRotation: 0,
    tabBar: {

        border: true,

    },

    defaults: {
        textAlign: 'left',
        bodyPadding: 15
    },




items: [{
    title: 'Home',
    autoScroll: true,
    items:[{
            xtype: 'OverallCost',

           },

           {
             xtype:'OverallCount'
           }

    ]

}, {
    title: 'Utilization Summary',
    autoScroll: true,
    items:[{

        xtype: 'Overall'
        }]
}, {
    title: 'TOPs'
}, {
    title: ' Cases'
},
{
    title: 'Members Details'

},
{
    title: 'Download Report'
}
]

})

Answer 1

有一些调整布局的选项

1. 在父面板中使用layout:'border，然后为要移动的每个项目指定区域（北，东，南，西或中心）。

2. 使用'layout:'absolute'然后定义每个项目的x和y坐标。请参阅文档here。

3. 使用定义明确here的layout:'hbox'。