如何在 Ext js 面板中分别在面板的顶部和左侧添加高度和宽度？答案

【问题标题】：How can I add height and Width on Top and Left side of a Panel respectively in Ext js panel?如何在 Ext js 面板中分别在面板的顶部和左侧添加高度和宽度？
【发布时间】：2016-01-11 07:06:27
【问题描述】：

我在 Ext js 4.0 中创建了一个 TabPanel。

我向面板动态添加了一些网格。随着网格数量的增加，面板的大小也会增加。

下面是代表它的屏幕截图：

单网格面板：

在上图中，我添加了单个网格。现在我将在现有网格下方添加更多网格，如下所示：

具有多个网格的面板：

正如您在第二张图片中看到的那样，面板的高度增加了，并且面板右侧出现了滚动条。

现在在上面的例子中，面板的高度从面板的底部开始增加。但我想在第一个网格的顶部添加网格并增加面板顶部的高度。

同样，我想增加面板左侧的宽度。如何做到这一点？

我不想在顶部添加网格并将所有其他网格移动到底部，因为面板中存在大量相互排列的网格。

【问题讨论】：

老实说，我无法得到你想要达到的目标。您能否扩展您的问题的描述，或者更好的是，添加一些图片/方案/小提琴。
@SergeyNovikov 我已经编辑并试图以更好的方式解释它

标签： javascript html extjs

【解决方案1】：

这不能如你所愿，因为 ExtJS 和纯 JavaScript 和 HTML 中的参考点总是在左上角，即 (0,0)。

如果你想在其他网格之上添加一个网格，你必须使用container.insert(0,component)，从而改变所有其他网格的位置。然后你可以scrollTo底部。

【讨论】：

【解决方案2】：

您可以在面板的第一个位置设置手动添加网格，例如：

var Mypanel = Ext.ComponentQuery.query('#mypanel')[0];

Mypanel.insert(0,cmp1);

即使您可以使用以下示例手动设置滚动条在顶部的位置。添加每个滚动条的位置

scrollPos = Mypanel.getEl().down('.x-grid-view').getScroll().top;

动态设置scrollPos： Mypanel.getEl().down('.x-grid-view').scrollTo('top',scrollPos,true);

将 scrollPos 设置在顶部位置： Mypanel.getEl().down('.x-grid-view').scrollTo('top',0,true);

【讨论】：