javascript - 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

试试这个代码。这对我有用。在配置中定义layout:'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
                }
            ]

            }
            });