Sencha touch 2 -如何添加垂直可滚动组件到水平旋转木马

Question

我花了好几天的时间在这个问题上，我真的不明白为什么在我看来应该是默认行为的事情会这么难做到。其他帖子似乎在问如何防止我希望达到的行为，所以我一定是做错了什么。

我想把这个组件:

Ext.define('Proximity.view.detail.DetailPanel', {
    extend: 'Ext.Panel',
    xtype: 'detailpanel',
    scrollable: 'true',
    config: {
        scrollable: 'true',
        layout: 'vbox',
        items: [
            {
                xtype: 'panel',
                bodyPadding: 15,
                docked: 'top',
                tpl: '<h3 class="detail-name">{name}</h3>' +
                    '<img class="detail-image" src="http://src.sencha.io/-34/x50/{image}"/>' +
                    '<div class="detail-description">"{description}"</div>' +
                    '<div class="detail-address">{street}, {suburb}</div>'
            },
         // more items to come here
        ]
    }
});

进入这个旋转木马:

Ext.define('Proximity.view.result.ResultCarousel', {
    extend: 'Ext.Carousel',
    xtype: 'detailcarousel',
    config: {
        store: 'RemoteResultStore',
        direction: 'horizontal',
        fullscreen: true,
        defaults: {
            styleHtmlContent: true,
            scrollable: true
        }  
    }
});

这样，如果内容溢出当前屏幕，我可以向下滚动到底部。

但是当我将面板作为一堆项目添加到轮询器中时，轮询器中的每个页面都是垂直锁定的。任何来自DetailPanel组件的溢出都在屏幕外，完全无法访问。

在过去的几天里，我尝试了所有我能想到的布局、滚动、可滚动、全屏、停靠和项目堆叠的组合，但都无济于事。最后，我想在每个DetailPanel的底部添加一些按钮，但现在似乎不太可能实现。

有什么办法使这个工作吗?应该很简单，对吧?

Answer 1

我找到了答案，并把它放在这里和Sencha Touch论坛。

原来有一个未记录的配置选项称为'scrollDock'，使我试图做的一切工作在我想要的方式。

下面的代码现在可以正确滚动了:

Ext.define('Proximity.view.detail.DetailPanel', {
    extend: 'Ext.Panel',
    xtype: 'detailpanel',
    config: {
        layout: {
            type: 'vbox',
            align: 'start',
            pack: 'start'
        },
        items: [
            {
                xtype: 'panel',
                bodyPadding: 15,
                cls: 'detail-panel',
                layout: 'fit',
                scrollDock: 'top',
                tpl: '<h3 class="detail-name">{name}</h3>' +
                    '<img class="detail-image" src="http://src.sencha.io/-34/x50/{image}"/>' +
                    '<div class="detail-description">"{description}"</div>' +
                    '<div class="detail-address">{street}, {suburb}</div>'
            },
            // more stuff here
        ]
    }
});

我真的不知道为什么这不值得文档。也许Sencha的人能给我们点启示?

总之，我在这里找到了我的线索:http://www.sencha.com/forum/showthread.php?250883-Container-on-top-of-a-list

干杯!