Sencha Touch 2.3 - 如何在多个容器上滚动操作时垂直滚动

时间:2014-06-03 18:48:13

标签: extjs sencha-touch

我按照图片和下面的代码制作屏幕。请注意,垂直滚动仅适用于列表视图。有没有办法让我可以在整个窗口中进行垂直滚动操作 - 这样顶部的图片和配置文件就会消失,而且在滚动时不会留在视口中?

enter image description here

Ext.define('Volt.view.FeedView', {
    extend: 'Ext.Panel',

    requires: [
        'Ext.TitleBar',
        'Ext.Button',
        'Ext.Toolbar',
        'Volt.view.FeedListView'
    ],

    xtype: 'feedViewCard',

    config: {
        iconCls: 'home',
        title: 'FeedView',

        layout: {
            type: 'vbox'
        },

        items: [
            {
                xtype: 'toolbar',
                title: 'Home',
                docked: 'top',
                items: [

                    //2 buttons here
                ]
            },
            {
                // profile summary at top
                xtype: 'container',
                flex: 1,
                layout: 'hbox',
                items:[
                    {
                        //picture of user
                        xtype: 'image',
                        src: 'http://www.sencha.com/assets/images/sencha-avatar-64x64.png',
                        flex: 1
                    },
                    {
                        //text and EM count
                        xtype: 'container',
                        flex:2,
                        html:'profile text and earthmiles count'
                    }
                ]


            },
            {
                xtype: 'list',
                //more code here

            }
        ]
    },





});

1 个答案:

答案 0 :(得分:0)

使整个面板可滚动,如下所示: -

Ext.define('Volt.view.FeedView', {
    extend: 'Ext.Panel',

    requires: [
        'Ext.TitleBar',
        'Ext.Button',
        'Ext.Toolbar',
        'Volt.view.FeedListView'
    ],

    xtype: 'feedViewCard',

    config: {
        iconCls: 'home',
        title: 'FeedView',
        scrollable: 'vertical', // or true
   ...