Sencha Touch 2-將輪播添加到面板

Question

我正在嘗試將旋轉木馬添加到“面板”視圖中，該視圖內部具有多個子面板。 當我運行代碼時，雖然看不到輪播中的任何內容。 其他面板看起來很好。 這是我現在得到的代碼

Ext.define('app.view.HeroDetail', {
extend: 'Ext.Panel',
requires: ['Ext.Carousel'],
xtype: 'herodetail',
layout: 'vbox',
fullscreen: true,

config: {

items: [
    {
        xtype: 'panel',
        html: 'first panel',
        flex: 1
    },

    {
        xtype: 'carousel',
        items: [
            {
                xtype: 'panel',
                html: 'carousel1'
            },
            {
                xtype: 'panel',
                html: 'carousel2'
            }
        ],
        flex: 1
    },

    {
        xtype: 'panel',
        html: 'second panel',
        flex: 1
    }
]

}
});

我在這里想念什么？

Answer 1

試試這個代碼。 這對我有用。 在配置中定義布局：“ vbox” 。

            Ext.define('app.view.HeroDetail', {
            extend: 'Ext.Panel',
            requires: ['Ext.Carousel'],
            xtype: 'camerapanel',
            fullscreen: true,
            config: {
            layout: 'vbox', //defines layout inside config
            items: [
                {
                    xtype: 'panel',
                    html: 'first panel',
                    flex: 1
                },

                {
                    xtype: 'carousel',
                    flex: 1,
                    items: [
                        {
                            xtype: 'panel',
                            html: 'carousel1'
                        },
                        {
                            xtype: 'panel',
                            html: 'carousel2'
                        }
                    ]

                },

                {
                    xtype: 'panel',
                    html: 'second panel',
                    flex: 1
                }
            ]

            }
            });