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 
       } 
      ] 

      } 
      });