Question

我的Ext.Panel上有一个vbox布局，有三个项目，Page1，Page2和Page3。

    var CountryDetailsAllPages = new Ext.Panel({
        scroll: 'vertical',
        fullscreen: true,
        layout: { type: 'vbox', align: 'stretch' },
        dockedItems: [Toolbar],
        items: [Page1,Page2,Page3]
    });

Page1，Page2和Page3包含各种其他面板，因此每个页面太大而无法在整个屏幕上显示（因此垂直滚动）。基本上，在加载时，Page1应该是可见的，用户必须向下滚动才能继续阅读其他页面。

然而，当它呈现时，Sencha Touch会尝试显示所有页面，结果是它们彼此重叠！

我正在从外部HTML文件加载页面内容，内容来自数据库，具体取决于用户的选择。我不能依赖固定的高度。

我该如何解决这个问题？

Answer 1

添加flex配置

 flex:3,
 fullscreen: true,
 layout: { type: 'vbox', align: 'stretch' },
 dockedItems: [Toolbar],

Answer 2

这是我之前发布的确切问题。如果您有一个具有vbox布局的面板。在那里你有多个面板，然后是一个列表。没有办法轻松计算所有物品的高度，因此滚动得很好。我发现的唯一方法是将顶部面板设置为一个非常巨大的高度，以便一切都适合。如果有一种动态的方式来设置高度以便所有项目都完美适合，那就太好了。 IE：列表内容以及周围的任何项目都会显示。

Sencha Touch 1.1 - 当前视图之外的项目的可滚动vbox布局

2 个答案: