Sencha Touch 2 - Scrollable Dataview与Panel中的其他项重叠

Question

我想添加一个也与dataview一起滚动的部分，我宁愿不在dataview和它链接的商店中添加它，因为如果一个项目被点击它会推送另一个视图，因此它会导致错误试图找到一个不存在的视图。

基本上我希望Container中的所有项目都可以滚动，而不仅仅是数据视图。

以下是此视图中的代码：

    config:{
    title:'Learning Journey',
    layout:'fit',

    items:[
        {
            html:'<p>This will be overlapped when the text is too long or when scrolled.</p>'
        },
        {
            xtype:'dataview',
            store:'MenuStore',
            itemTpl:'<div class="menuData {panelColour}"><h1>{panelTitle}</h1><br> {panelDesc}'
        }
    ]
}

我确信这个问题有一个简单的答案，但我无法理解它（我是Sencha Touch 2菜鸟）。

谢谢！

这是一张显示问题的图片：http://i58.tinypic.com/2v1nqk4.jpg

Answer 1

问题是包装容器的布局。 fit确保容器的所有项目都将填满整个容器。因此，html容器的宽度和高度均设置为100％。但这也适用于您的数据视图。所以这两个项目都将完全填满包装容器。

要解决此问题，只需将包装容器的布局设置为vbox即可。因此数据视图将直接插入到您的html容器中。

如果您希望html容器可滚动，则必须为其添加scrollable: true属性。但别忘了提供一些高度！