sencha-touch - 列表滚动问题

Question

我的列表有问题。我无法滚动它们。列表向下移动，但在 Tapend 后跳到顶部。我使用 Sencha touch PR4，并在 Ipad 和 Google Chrome 上进行了测试

我用这个视图

Ext.define('TimeShift.view.Activity', {
    extend: 'Ext.Panel',
    id: 'Activity',
    alias: 'widget.Activity',
    layout: 'card',
    config: {
        items: [
            { xtype: 'list',
                layout: 'card', //    fullscreen: true,
                store: 'ActivityStore',
                scrollable: 'vertical',
                itemTpl: '<div class="contact">{Purpose}</div>',
                items: [
                    {
                        xtype: 'toolbar',
                        docked: 'top',
                        title: 'Aktivit&#228;ten'
                    }] 
    }]
    },
    initialize: function () {
        console.log('initialize ActivityList');
        this.callParent();
    }
});

这个视图在这个容器中

Ext.define('TimeShift.view.ListContainer', {
    extend: 'Ext.Container',
    id: 'ListContainer',
    alias: 'widget.ListContainer',

    cardAnimation: 'slider',
    scrollable: true,
    autoDestroy: true,
    config: {
        items: [

            { xtype: 'Activity' }
        ]

    },
    initialize: function () {
        console.log('initialize ListContainer');
        this.callParent();
    }
});

我希望有一个人可以帮助我。

Answer 1

使用布局“适合”到您的父容器，或者您也可以指定父容器的高度。如果视口在需要显示下一个项目的跨度之后现在没有，它将不会滚动。您需要为滚动指定边界。

Ext.define('TimeShift.view.ListContainer', {
extend: 'Ext.Container',
id: 'ListContainer',
alias: 'widget.ListContainer',
**layout: 'fit',**
cardAnimation: 'slider',
scrollable: true,
autoDestroy: true,
config: {
    items: [

        { xtype: 'Activity' }
    ]

},
initialize: function () {
    console.log('initialize ListContainer');
    this.callParent();
}
});

（未经测试。希望这会有所帮助。）